Я в кроличьей норе оптимизации скорости сайта. У меня есть сайт, который получает ужасные оценки от всех обычных подозреваемых (в частности, PageSpeed и GT Metrics; в инструментах Pingdom он выглядит нормально).
Моя установка представляет собой один сервер T3-Medium с Apache и Wordpress за AWS ELB с развертыванием в CloudFront в качестве CDN.
Мои первые попытки улучшить производительность включали
- обновлен до Medium (на сервере работает около 1/2 дюжины веб-сайтов, но они крошечные — совокупный трафик на всех из них составляет всего несколько тысяч посещений в день — тем не менее, экземпляр «Small» был слишком вяло даже при одном ударе из-за нехватки памяти),
- установил плагин WP Super Cache (я уже работал за CloudFront, но установил плагин для кэширования самих страниц)
- В поведение CloudFront добавлены заголовки управления кешем.
- Удалены строки запроса из ключа кеша (это не традиционный сайт электронной коммерции, и реклама в Твиттере добавляла уникальную строку для каждого пользователя, что в основном приводило к промаху кеша при каждом просмотре страницы)
Однако даже при этом производительность по умолчанию неприемлема. Виновником, кажется, является доставка (и выполнение) javascript. Вот некоторые результаты GT Metrics, основанные на том, сколько ручного вмешательства я выполняю:
Cache-Miss Cache-Hit Cache-Miss Cache-Hit Cache-Miss Cache-Hit
Молоток по умолчанию Молоток по умолчанию YouTube Молоток Кувалда на YouTube Кувалда
ТТФБ 1 100 91 75 66 75 72 | 74 74 122 74 54 75 | 76 86 104 86 63 45
FCP 2 200 1 100 4 200 494 519 383 | 1 100 2 700 1 400 710 415 622 | 1 200 1 200 1 200 388 338 256
LCP 3 300 2 000 6 300 1 900 1 700 1 800 | 1 800 3 500 2 000 2 700 881 1 600 | 1 900 2 000 2 500 684 617 490
Под нагрузкой 4 600 3 200 7 600 2 300 3 000 2 700 | 2 900 4 900 2 700 3 100 1 500 2 500 | 2 000 2 000 2 400 766 824 489
TTI 4 700 3 300 7 600 2 500 2 900 3 200 | 3 000 8 000 2 800 3 400 1 700 3 000 | 8 000 6 800 1 200 6 700 6 700 6 400
Как вы можете видеть, если я ничего не делаю (первые две подтаблицы «по умолчанию»), сайт загружается почти 3 секунды при попадании в кеш, и часто больше 4 секунд при промахе кеша.
Это действительно корень вопроса. Что мне делать отсюда? Ниже я опишу, что я сейчас делаю, но я не думаю, что то, что я собираюсь описать, является стандартной практикой в Интернете, и, очевидно, Интернет в целом не страдает от такого рода производительности. .
Применение кувалды
Я не уверен, какая из этих метрик имеет наибольшее значение с точки зрения пользовательского опыта, но я подозреваю, что в моем случае это LCP и загрузка (я могу представить, что для некоторых веб-сайтов это TTI, но в моем случае нечего делать выше сгиба, так что старая метрика первого простоя ЦП была бы отличной, если бы Lighthouse все еще сообщала об этом).
То, что я делаю сейчас, это то, что у меня есть в разделе «Кувалда» таблицы. Я написал скрипт, который удаляет все несущественные теги src javascript и возвращает их только через 5 секунд или после первого взаимодействия с пользователем. Вы можете увидеть результаты. Даже при промахе кеша сайт загружается примерно за 2 секунды, а при попадании в кеш — намного меньше 1 секунды (мы можем игнорировать число TTI, потому что это моя 5-секундная задержка, и она не влияет на выше- складной внешний вид или интерактивность).
Хорошо, сайт «работает», но на самом деле не только кажется, что это не нужно делать в абстракции, но также есть некоторый javascript, который я бы очень хотел, чтобы он работал с самого начала.
Покопавшись, все проблемы кажутся сторонним JavaScript (т. Е. То, чего нет / не может быть в моем CDN). Некоторые из них просто вопиющие, и я могу справиться с этим внутри компании (например, я могу сказать маркетологам: «Используйте HotJar только тогда, когда вам действительно нужно, а затем выключайте его — он добавляет целую секунду к загрузке страницы». время"). Но некоторые из них являются просто «интернет-стандартами» — Stripe и Google Analytics добавляют ~ 500 мс между временем загрузки и временем выполнения.
Я могу продолжить доводку своей кувалды, как предложил Тим в комментариях, но это все еще не кажется правильным. Должно быть что-то, чего мне не хватает с точки зрения этой настройки и (особенно стороннего) JavaScript.
