Ускорение сайта

110: Lighthouse 6.3 — что важно знать про новую версию

27 августа в 6 утра было выпущено обновление Lighthouse, который уже входит в состав PageSpeed Insights.

Наша команда во главе с Антоном Белогородцевым оперативно обновила версию Лайтхауса на lh.loading.express.

Мы изучили новые аудиты и обсудили их для вас

Очень быстрый и содержательный эфир про lighthouse

Временные метки для видео:

0:00 – Начало

2:05 – Срочные новости! Команда Google Chrome обновила Lighthouse до версии 6.3, изменения в: СLS (Cumulative Layout Shift), Axe version, Image size и другие

4:26 – Испытайте наш УЖЕ обновленный сервис Lighthouse 6.3 с новым функционалом для замера скорости загрузки сайта https://lh.loading.express, показываем на примере – 10:44

5:13 – В корне разбираем, что такое Lighthouse 6.3 и как его использовать правильно

9:30 – Как работает системная часть Lighthouse 6.3

10:44 – Замер сайта на новом движке и разбор обновленных показателей:

13:13 – Как визуально распознать время отрисовки контента и время наступления интерактива, подробнее о загрузке сайта с хорошим TTI и долгой FCP – 14:20

15:04 – Сайты на конструкторе Tilda загружаются быстро? При условии оптимизации CSS/JS. О том, как оптимизировать код CSS для сайтов на Tilda

16:54 – Обновился PWA (Progressive Web App – сайт работающий в автономном режиме) до версии 6.3, где можно проверить соответствие вашего сайта под стандарты PWA

18:47 – В новом Lighthouse 6.3 обновили: CLS, версию Axe (измерение специальных возможностей) – 19:11, неявно заданные размеры изображения – 19:55, LCP – 21:08, CLS (смещение основного контента) – 31:03. Подробности о не изменившихся параметрах с версии Lighthouse 6.1 – 6.2 доступно тут https://www.youtube.com/watch?v=Kx8ZE7Tet9U

23:15 – это же Google PageSpeed Insights улучшили в новой версии: подключение к доменам, предварительная загрузка ключевых запросов — Preload, HTTP/2 — 24:30, цепочка критических запросов – 29:28

25:40 – Как выявить повторяющиеся модули из пакетов JavaScript. Выявить устаревший код – 27:00

29:45 – Время выполнения кода JavaScript с новым триггером «Показать сторонние ресурсы». Увеличилась детализация использования стороннего кода – 30:36

31:56 – Новый аудит. Что говорит нам Lighthouse 6.3 о не композиционной анимации (avoid non-composited animations)

32:26 – Как заменить объемные библиотеки JavaScript менее весомыми

33:08 – Лайфхак: как найти человека для внедрения рекомендаций от Lighthouse 6.3 по JavaScript коду

36:04 – Что нового в разделе «Рекомендации»: использование source map, атрибут autocomplete (автозаполнения) — 37:37, параметр unload – 39:34, application cache — 40:11

40:26 – Что нового показывают в параметрах «Обнаруженные библиотеки JavaScript» и «Устаревшие API», «Уязвимость в клиентских библиотеках JavaScript» — 41:16

42:19 – В раздел SEO (поисковая оптимизация) добавили: оптимизация шрифтов. Как шрифты влияют на восприятие контента и на что ориентироваться при дизайне текста

44:41 – Маскирующий значок – обновление в PWA раздел

46:16 – Вопрос из зала: «Для того чтобы скрипты не тормозили загрузку, есть async или defer. Почему это не решает проблему и приходится откладывать выполнение и т.д.?»

49:13 – Комментарий зрителя: «​Сейчас к сожалению, во многих нишах топ занимают сайты где еле 15 баллы набирают, а вылизанные и экспертные в конце»

50:43 – Скорость загрузки сайта – это единица в комплексе по оптимизации SEO. Как улучшить конверсию сайта подскажем тут

52:50 – Вопрос из зала: «Почему PageSpeed не обновил версию Lighthouse до 6.3?». Зато замер скорости сайта с обновленной версией доступен у нас https://lh.loading.express

54:16 – Вопрос зрителя: «Пассивные прослушиватели событий Jquery 3.5.1 ошибка, как ее решить?»

55:44 – Замечания из зала: «​Видел некоторые сайты, которые без ссылок с хорошей скоростью, были в топе». Ввиду каких факторов старые медленные сайты могут занимать первые места в результатах поиска, подробнее 1:00:26

58:34 – Внимание, SEO-специалисты! Мы открыты к коллаборации! Ищем партнеров для кейсов

59:18 – Вопрос из зала: «Eсли сайт попадает под YMYL, то рано или поздно сайту капец. Ни скорость, ни ссылки, ни поведенческие не спасут». Какие типы сайтов чаще попадают под YMYL, подробнее 1:02:04

1:01:15https://live.loading.express/ по последнему эфиру предоставляет удобный интерфейс для получения полезных ссылок и наработок от LOADING.express.

1:03:40 – Тестируем работу Lighthouse 6.3 на примере медленного сайта. Разбираем результаты замера по новым параметрам в обновленной версии – 1:06:06

1:09:47 – Замена не столь важных библиотек JavaScript, отрисовка крупного контента – 1:10:07, смещение контента – 1:10:20, уязвимости JavaScript библиотек – 1:11:11, ошибки консоли – 1:12:35

1:14:11 – Делаем выводы и завершаем эфир о новой версии Lighthouse 6.3

1:16:20 – Немного о предстоящем выпуске

1:18:50 – Проверяйте и ускоряйте вместе с LOADING.express. До следующих встреч!

Аудиты очень классные и полезные. Касаются JavaScript’а и более точных проверок отдельных показателей, в том числе CLS.

Проверяйте скорость сайта из Москвы:

Еще про Lighthouse 6.3

Новую версию Lighthouse планируют внедрить с 87 версии Google Chrome c 18 сентября в тестах, а в ноябре в стабильной версии. С 1 декабря в Chrome OS.

Новые аудиты в Lighthouse 6.3:

Остальное можно перевести, но лучше читать по-английски:

Core

Report

Deps

I18n

Docs

Tests

Misc

Exit mobile version