Артем Хайдаров — Тестирование производительности React-компонентов в CI

Ближайшая конференция HolyJS: #javascript #js #holyjs #IT #conference #jugrugroup Расскажу, как внедрял автоматическое тестирование производительности React-компонентов в дизайн-систему и сервисы SberDevices, а также про инструмент, который создал во время решения этой задачи. На первый взгляд незаметные баги в компонентах, вызывающие проблемы производительности, просачиваются в продакшен, и проблема выявляется только после деплоя в виде изменившихся метрик. В этот момент бизнес-цели начинают конфликтовать с целями по скорости, и в итоге решение проблемы может затянуться надолго. Есть инструменты измерения производительности компонентов. Но у большинства из них нет поддержки React 18 или они не подходят под наши требования. Или они не автоматические и вообще ими никто не пользуется, потому что это дополнительная рутинная работа. Решение: реализовать и внедрить в проверки пул-реквеста систему тестирования производительности, которая будет честно измерять компоненты в нативной среде, при этом будет достаточно стабильной и выдавать как можно меньше ложных результатов в условиях прогонов на виртуальных машинах. Расскажу про все, что связано с задачей: про требования, исследование существующих инструментов, проблемы, реализацию. Технологии: TS, React 18, Puppeteer, , webpack, GitHub workflows.  Будет интересно разработчикам и лидам команд, вовлеченных в поддержку своих сервисов по производительности. Скачать презентацию с сайта —