Зустрічайте, оновлений 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 піклується про комфорт рядових користувачів, нехай вони про це і не знають, а вкладення в оптимізацію і зменшення швидкості завантаження підвищує не лише рейтинг, але і продажі!
