Инструменты повышения производительности в 2024 году и в дальнейшем

Панель «Производительность» в Chrome DevTools помогает разработчикам измерять и оптимизировать производительность во время выполнения в той или иной форме на протяжении большей части 15 лет. Начиная с панели под названием «Временная шкала» , она превратилась в панель «Производительность», которую вы знаете сегодня.

За это время Chrome выпустил другие мощные продукты и функции, повышающие производительность. Примечательно, что Lighthouse был запущен в 2016 году, чтобы облегчить поиск возможностей оптимизации. Экспериментальная панель Performance Insights была выпущена в 2022 году для тестирования новых способов предоставления информации о производительности.

Панель «Производительность» содержит данные и функции, которые помогут разработчикам глубже изучить проблемы с загрузкой страниц и производительностью во время выполнения. Но давайте на минутку будем реалистами и признаем, что его может быть сложно использовать и сложно определить самые большие возможности для улучшения производительности страницы. Кроме того, возможности других инструментов, помогающих разобраться в шуме и быстро изолировать возможности, например Lighthouse, отключены от панели «Производительность».

Стремясь облегчить разработчикам выявление и воспроизведение проблем с производительностью, мы собираемся использовать функции и знания Lighthouse и панели Performance Insights и интегрировать их в существующую панель Performance. Мы также уделяем особое внимание пользовательскому интерфейсу и удобству использования, чтобы повысить эффективность панели «Производительность» как инструмента оптимизации веб-производительности.

Каков результат? Единая панель — более простая и мощная, чем когда-либо — для всех данных о производительности и аналитики.

Принимать меры по повышению веб-производительности стало проще

Ваш отзыв подтверждает, что высокая плотность информации усугубляет проблемы с удобством использования. Мы активно разрабатываем исправления и функции, которые могут помочь. Ключевые направления оптимизации, такие как улучшение основных веб-показателей, получают первоклассное обслуживание. Мы планируем ввести такие функции, как аннотации, которые позволят вам отмечать результаты и делиться ими с коллегами. Выявление корреляций в данных поможет улучшить понимание сложной системы, предоставляя вам больше способов выявить, как связаны данные, например, сетевые запросы к активности основного потока.

Мы будем добавлять новые функции по мере их разработки и каждые несколько месяцев публиковать обновленную информацию о новых возможностях, предлагаемых панелью. Держать крепко! Скоро вы начнете видеть новые функции!

Мощь Lighthouse на панели «Производительность»

Мы видели, как разработчики используют панели Lighthouse и Performance, и переключение контекста между ними является непростой задачей. Кроме того, для принятия мер на основании выводов Lighthouse может потребоваться перейти на панель «Производительность», чтобы получить дополнительный контекст. Это вызывает разногласия, поскольку предписывающий обзор производительности страницы не связан с подробными данными о производительности.

Мы собираемся глубоко интегрировать анализ производительности Lighthouse через панель «Производительность». Благодаря этой интеграции Lighthouse прольет свет на основные возможности улучшения производительности страниц на самой панели «Производительность», сопровождая ее всеми подробностями, необходимыми для принятия мер по этой возможности.

После перемещения всех функций производительности на панель «Производительность» независимая панель Lighthouse в DevTools станет ненужной и исчезнет. Этот закат панели произойдет не раньше второй половины 2025 года. Важно решительно заявить, что Маяк не исчезнет .

Скриншот панели «Производительность» с логотипом Lighthouse

Маяк здесь, чтобы остаться

Модуль Lighthouse npm и отчет Lighthouse в PageSpeed ​​Insights (включая API PSI ) не будут прекращены. Мы по-прежнему стремимся к доступности и качеству Lighthouse как инструмента с открытым исходным кодом, который можно использовать в предпочитаемой разработчиком среде для оценки производительности страниц.

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

Экспериментальная панель Performance Insights станет устаревшей.

Панель Performance Insights была выпущена в качестве эксперимента, чтобы увидеть, как мы можем лучше решить три ключевые проблемы : уменьшить информационную плотность панели «Производительность», поддержать анализ на основе сценариев использования и сократить время обучения, связанное с использованием панели «Производительность».

Мы многому научились в ходе эксперимента благодаря отзывам разработчиков. Мы подтвердили, что использование анализа на основе конкретных случаев — например, «Я хочу оптимизировать LCP» или «Я хочу оптимизировать страницы, чтобы они были более отзывчивыми» — чрезвычайно ценно, и что такие функции, как Layout Shifts Track, позволяют диагностировать и улучшать показатели. гораздо более прямолинейно.

Разработчики также обнаружили, что панель Performance Insights более доступна, чем панель Performance, подтверждая привлекательность уменьшенной плотности информации. Однако во многих случаях за такое снижение плотности приходилось платить, поскольку разработчикам приходилось переходить на панель «Производительность», чтобы получить подробные данные, необходимые для принятия мер.

Наши знания и многие функции экспериментальной панели Performance Insights будут интегрированы в панель Performance. Такие функции, как анализ на основе случаев использования и повышение плотности информации, а также интеграция Lighthouse, помогут нам сделать анализ производительности страниц более действенным, чем когда-либо прежде.

Эксперимент Performance Insights будет удален позже в 2024 году.

Где оставить отзыв

По мере того, как мы выпускаем новые функции, мы приветствуем обратную связь. Если у вас есть идеи о том, как улучшить добавленные функции — или если ваш существующий поток через панель неоправданно нарушается — мы хотим услышать ваше мнение . Мы хотим услышать, что работает, а что нет и что, по вашему мнению, можно сделать лучше. Спасибо!