Делюсь золотой шкатулочкой с инструментами для оптимизации веб-страниц:

1. Самый крутой, о котором мало кто знает: Webpagetest. Огненная функция в нем — filmstrip view, где можно по-кадрово отсмотреть, как загружается страница и разглядеть, какой скрипт или стиль виноват в долгой загрузке. Медитируем на него без остановки.

2. Самый простой: PageSpeed Insights, довольно жесткий инструмент от гугла, где быстрая главная медузы набирает 6/100. Мы с командой RAWG последние 2 недели приносили человеческие жертвоприношения на страницу игры и подняли её мобильный рейтинг с 6 до 46, а десктопный — с 40 до 92. Главная польза PSI — простые и понятные советы, часть из которых очень дорого реализовать, но всё по делу. Вообще, его отчеты — отличный учебник по современной оптимизации для веб-разработчика. Дополнительный бонус — исходный код движка PSI, Lighthose открытый, можно посмотреть, за что именно дают или снимают баллы.

3. Google Chrome. Нам нужны две функции — первая, это Lighthouse (движок PSI из предыдущего пункта). Вторая — возможность затормозить сеть (вкладка Network) и затормозить процессор (вкладка Timeline). Позволяет отследить проблемы, которые на быстром интернете и мощном процессоре не заметны.

4. GTMetrix, многофукциональный комбайн, вдобавок к стандартным метрикам оценивает использование CDN, SSL и много других мелочей.

5. sitespeed.io: крутой инструмент для автоматизированного тестирования (докер образ, легкая интеграция в дэшборд графаны), внутри комбинирует множество опенсорс-утилит.

Самое главное, что нужно при оптимизации веб-страниц — пытливый ум и настойчивость. Не стесняйтесь просить помощи у знакомых, они могут сходу заметить то, что вы замыленным взглядом уже не увидите.

Если я забыл что-то важное — маякните в личку @samatg или в чатик @ctodailychat, пожалуйста.

Да пребудет с вами сила оптимизации!