Что произошло

Автор начинает с инструментов, без которых спор о скорости бессмысленен. В браузере — вкладка Performance с flame chart, Network с waterfall, Memory со снимками кучи, Coverage для неиспользуемого JS и CSS. В Node.js — console.time / console.timeEnd и API производительности.

Дальше — восемь направлений, каждое привязано к симптому, а не к моде. Debounce и throttle убирают лишнюю работу на scroll, resize и input. Ленивая загрузка модулей и тяжёлых компонентов не тащит всё в первый бандл. Оптимизация запросов данных — кэш, дедупликация, отказ от refetch на каждый ререндер.

В React и Vue имеет смысл снижать число ререндеров там, где профайлер показывает горячие точки — а не мемоизировать всё подряд. Web Workers выносят тяжёлые вычисления с главного потока. Изображения — AVIF/WebP, loading="lazy", preload только для LCP-ресурса. Размер бандла — tree-shaking, точечные импорты, нативные API вместо polyfill «на всякий случай».

Почему это важно

Производительность часто лечат «на глаз»: режут анимации или добавляют memo без профиля. Код усложняется, а LCP и TTI почти не двигаются. Список из статьи привязан к измеримым узким местам: лишние запросы, толстый бандл, блокировка главного потока.

Для full-stack это напоминание: и фронт, и Node-сервисы одинаково страдают от оптимизаций без baseline. Одна сессия в Performance tab часто находит «быстрые победы» быстрее, чем неделя микрорефакторинга.

На практике

1. Зафиксируйте baseline: Lighthouse + один сценарий пользователя в Performance tab.
2. Вкладка Coverage — часто быстрее всего выкинуть мёртвый CSS/JS, чем микрооптимизировать циклы.
3. Debounce для поиска на 200–300 ms; throttle для scroll — через requestAnimationFrame или разумный интервал.
4. Dynamic import() для админки, редактора, тяжёлых chart-библиотек.
5. Worker только если профайлер показывает блокировку главного потока >50 ms — иначе overhead не окупится.
6. Пересмотрите dependencies: целая UI-библиотека ради одной кнопки — частый источник лишних килобайт.
7. Включите сжатие (gzip/brotli), HTTP-кэш и CDN для статики — это пункт из «быстрых побед», который забывают после спора о React.

Итог

Восемь пунктов — не магия, а дисциплина измерения плюс типовые узкие места веб-приложений. Полный разбор с примерами — в оригинале на Dev.to.