Как мониторить перформанс в React



Собрал гайд по тому, как настроить свой мониторинг React-перформанса — как с живыми пользователями, так и синтетический. Со всеми подводными камнями, про которые знаю: https://3perf.com/blog/react-monitoring/



Зачем это всё

Мой любимый ответ на «как сделать, что приложение оставалось быстрым» — это настроить мониторинг перформанса. Это, конечно, не решает все проблемы (дашборд с мониторингом ещё нужно смотреть, а увиденные проблемы — исправлять), но помогает.



Челленж в том, что готовых инструментов для React-перформанса нет. Для мониторинга скорости загрузки есть миллион сервисов (SpeedCurve, Treo, Lighthouse CI и иже с ними). А вот что, если важна не скорость загрузки, а скорость реакции кнопочек? Придётся настраивать что-то своё — про это и гайд.



(первая статья на 3perf.com за пару лет, да )