23
Ноя

Встречайте, обновленный Google PageSpeed Insights, учитывающий еще больше данных, в том числе пользовательский опыт (CrUX), и научившийся эмулировать загрузку сайта для 3G-сетей у Lighthouse!

Если по правде, то готовиться к выходу новой версии нужно было с января. В начале года Google обновил алгоритмы ранжирования, что, впрочем, делает с завидной регулярностью, но на этот раз основная часть изменений пришлась именно на оценку скорости загрузки для мобильных браузеров. Ранее проведенные исследования показали, что 75% сайтов грузятся дольше 10 секунд, а чуть больше половины пользователей, особенно использующих портативные устройства, закрывают долго «думающую» страницу через 3 секунды. Быстрые сайты зарабатывают вдвое больше!

Теперь, когда стало ясно, почему 12 ноября вебмастера со всех уголков планеты жаловались на жизнь с удивительным даже для понедельника энтузиазмом, давайте разбираться что же изменилось во всеми любимом инструменте аналитики скорости загрузки страниц.

Следуя целям RAIL: что влияет на скорость загрузки страницы

Новая методика тестирования скорости загрузки Google PageSpeed Insights — усовершенствованное решение, ранее и до сих пор доступное в lighthouse, в частности, комплексный анализ FCP, FMP, FID и прочего. За страшными аббревиатурами скрываются вполне простые и понятные параметры оценки скорости загрузки страниц:

  • FCP (First Contentful Paint). Функция, начинающая отсчет скорости загрузки страницы с момента отрисовки первого контента. В роли последнего может выступать что угодно: растровая графика SVG, canvas или текст. Этот параметр важен, ведь если пользователь видит, что сайт подгружается, пусть и по кусочкам, он с большей вероятностью подождет завершения процесса, чем если будет любоваться пустым экраном и сомневаться в том, нажал ли он вообще кнопку Enter. Причины слишком низкой скорости очевидны: или проблемы с соединением у пользователя, или слишком «тяжелый» контент. Среднее значение FCP лежит в диапазоне 1-2.5 сек. Меньший показатель считается быстрым, больший — медленным.
  • FMP (First Meaningful Paint). Значимый контент по мнению Google разнится в зависимости от типа сайта. Для блога это будет заголовок и текст, а для интернет-магазина – картинки товаров. Анимацию загрузки и неоформленный контент (fouc), а также отображение панели навигации данная функция игнорирует. Обычно значимый контент подгружается долго, если разработчик выделил приоритет изображениям, стилям, шрифтам или скриптам, а этого, очевидно, делать не стоит.
  • DCL (DOMContentLoaded). Измеряет время до полноценной загрузки HTML и построения DOM-дерева.
  • TTI (Time to Interactive). Сайт считается готовым к взаимодействию после того, как произошла FMP, сработал DOMContentLoaded и загрузилось 85% контента. Данная функция состоит из двух частей: первая рассчитывает время до момента, когда интерфейс уже практически готов отвечать с небольшой задержкой, а вторая до полноценной загрузки. Способы исправления ситуаций, когда пользователь слишком долго видит сайт, как картинку, не реагирующую на попытки взаимодействия, значительно отличаются в зависимости от множества факторов, а значит и «лечение» нужно разное.

FID (First Input Delay) — функция, рассчитывающая, пожалуй, самый хитрый параметр. Значение первой задержки ввода вычисляется на основе данных всех пунктов из расположенного выше списка. Простыми словами FID — временной промежуток с момента перехода пользователя на сайт, до того, как браузер будет готов взаимодействовать с ним. Нормальное значение — 50-250 мс. Если показатель FID больше, скорее всего, браузер просто был занят другими задачами, например, пытался выполнить масштабный файл JavaScript.

Обновление коснулось и этих привычных инструментов, в частности, вместо значения DCL теперь отображается FID, что, впрочем, логично, ведь он объединяет в себе информацию о всем вышеперечисленном. PageSpeed Insights дает возможность оценить скорость и особенности загрузки по пунктам на графике.

Быстрее быстрого: как ускорить загрузку сайта еще сильнее

Разумеется, Google не бросил вебмастеров на произвол судьбы. Создатели Lighthouse любезно предлагают всем желающим скачать себе на Google Sheets табличку с детальным списком параметров оценки скорости загрузки и калькулятором для расчета ее итогового значения. Листая перечень можно заметить, что кроме данных полученных от функций, описанных выше, в ней есть еще 3 категории:

  • PWA — соответствие сайта требованиям к прогрессивным веб-приложениям;
  • Accessibility — доступность страницы поисковым роботам, все, что важно для индексации;
  • Best practices — использование официально одобряемых Google методов оптимизации.

Что касается первого пункта этого списка, то настоятельно рекомендуем найти на странице разработчиков Google не только эту табличку, но еще и чек-лист, в котором подробно расписано все, что нужно сделать и как, чтобы сайт стал не просто заурядным веб-ресурсом, а прогрессивным веб-приложением. Рекомендации по внедрению лучших практик, улучшению индексирования и, конечно же, повышению производительности, оцениваемую методами RAIL, там тоже представлены в ассортименте.

Кстати, на пресс-конференции приуроченной к выходу обновленного Google PageSpeed Insights, спикеры еще раз напомнили о том, что пора отказываться от изображений в форматах JPEG и PNG и срочно переходить на хотя бы JPEG 2000 или JPEG XR, а лучше на фирменный «гугловский» WebP, который, правда, не поддерживают некоторые из менее популярных браузеров. Впрочем, напомним, что к услугам тех, кому страшно или просто не хочется обновлять способы отображения картинок, есть множество приложений для их компрессии.

Последние исследования рынка, проведенные NetMarketShare и Statcounter в марте этого года, еще раз подтвердили беспрекословное лидерство Google среди браузеров для настольных ПК и мобильных устройств. Ему отдают предпочтение 6 из 10 активных пользователей Сети. Это значит, что вебмастерам остается только скрипеть зубами и подстраиваться под требования лидера отрасли, чтобы сайт остался в верхних строчках выдачи или туда попал. С другой стороны, Google заботится о комфорте рядовых пользователях, пускай они об этом и не знают, а вложение в оптимизацию и уменьшение скорости загрузки повышает не только рейтинг, но и продажи!