Как я Jest с помощью SWC ускорял

[Doman]

Тоже двойственные чувства. С одной стороны, буст составил 50% и это круто. С другой - при локальном прогоне кэш быстро съедает всю разницу, выравнивая цифры, а в CI - 90% времени занимают разворачивание докер образа, установка зависимостей и подготовка к тестам (генерация пачки файлов), и двукратное ускорение оставшихся 10% на картину не влияют. Но, возможно, кому-то пригодится, тем более миграция действительно не очень сложная.

Кстати, у вас ведь не просто Jest - я вижу render(). Как вам React Testing Library? Всем устраивает? Не думали перейти на другой фреймворк? И раз уж упомянули в статье Vite, то не смотрели в сторону Vitest?

[jquery_dlya_slabih]

React Testing Library - устраивает более чем, мы на него переехали с enzyme. Изъянов в нем не нашли, даже стало немного приятней тесты писать, но это конечно субъективно.

По поводу vite, до него к сожалению руки еще не дошли. Очень хочу протестировать до конца swc и понять чем придется пожертвовать, если babel отключим. А потом уже esbuild, vite и может еще что-то интересное подвернется.

[DmitryKazakov8]

Когда я перевел сборку проекта (не тестов) с Babel на SWC получилось вот что. Верхние результаты с минификацией, которая тоже переехала с Terser на Terser.SWC. Также здесь включено море плагинов, которые остались без изменений, поэтому результат довольно чистый - изменился только транспайлер

(CI) Babel без прогретого кеша + Terser

#16 22.96 [WEBPACK] finished building node within 20.21 seconds
#16 40.69 [WEBPACK] finished building web within 36.324 seconds

(CI) SWC + Terser.SWC

#16 13.14 [WEBPACK] finished building node within 10.57 seconds
#16 29.60 [WEBPACK] finished building web within 24.831 seconds

(Локальная сборка без минификации) Babel без прогретого кеша

[WEBPACK] finished building node within 5.443 seconds
[WEBPACK] finished building web within 6.745 seconds

(Локальная сборка без минификации) Babel с прогретым кешем

[WEBPACK] finished building node within 2.348 seconds
[WEBPACK] finished building web within 4.044 seconds

(Локальная сборка без минификации) SWC

[WEBPACK] finished building node within 1.609 seconds
[WEBPACK] finished building web within 3.742 seconds

Все на одной машине, запуски делал раз по 5, среднее значение скорости менялось не сильно. Выводы получились следующие:

• SWC не требует прогревания кеша, что максимально отражается в CI

• Terser.SWC - очень быстрый минификатор, без него результаты не такие поразительные

• Переезд на SWC получился почти безболезненный (да, его нужно настроить и подобрать альтернативные плагины, как у babel, но мои кейсы с недавним добавлением swc-loadable-components закрылись полностью). Из негативных моментов - нет плагина для оптимизации lodash и сахарные декораторы SWC несовместимы с некоторыми библиотеками, поэтому пришлось переписать их на функциональные.

• Размер node_modules действительно вырос, но цифры у меня не сохранились.

Также делал замеры на более крупных проектах, там тоже локальная сборка примерно на 20% ускорилась относительно бабеля с кешем. На мой взгляд, отличный результат "на ровном месте" почти без изменения кода

[jquery_dlya_slabih]

Точно, есть же еще и terser.

Вьюшки часом не на react? Интересуюсь с целью понять на сколько хорошо работает react-refresh из коробки, немного смущен пометкой "эксперимент".

И за наводку на loadable тоже спасибо, понадобится.

[DmitryKazakov8]

На реакте, да, но рефрешем не пользуюсь, поэтому тут не подскажу - в основном в проектах SSR (кстати тоже прекрасно работает в SWC), поэтому использую полную перезагрузку страницы. Если нужно поработать над компонентом - то какой-нибудь стайлгайд.

[DmitryKazakov8]

Кстати по поводу установки зависимостей в CI - они как правило меняются не часто, и можно сделать кеш слоев именно в CI

#13 [ 5/10] COPY pnpm-lock.yaml /app/
#13 CACHED
#14 [ 7/10] RUN pnpm install --prod
#14 CACHED

Так будет упираться только в скорость копирования в большинстве случаев, а это хорошо оптимизируется. Лишние 100мб дадут лишь несколько секунд сверху. Я не силен в девопсировании, но у нас в рецепте билда на восстановление из кеша и все сопутствующее уходит 1 минута + 30с сборка, так что увеличение размера node_modules влияет незначительно.