Что нового в DevTools, Chrome 139

София Емельянова
Sofia Emelianova
GitHub

Более надежные и эффективные инструменты разработчика Chrome

В этой версии Chrome DevTools уделили первостепенное внимание совершенствованию продукта. Это включало в себя решение широкого спектра известных проблем, от давних визуальных сбоев, проблем с удобством использования и несоответствий в дизайне до проблем с производительностью и функциональностью. В целом, мы сократили количество открытых проблем на 27%.

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

За кулисами мы проделали огромную работу по улучшению тестового покрытия, исследовали сложные ошибки в тестах, перенесли тесты на более надежную основу и устранили обнаруженные в процессе ошибки. Нам удалось сократить количество проблем, связанных с тестированием, на 54%.

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

Загрузите изображения в систему помощи ИИ для создания стиля.

Чтобы добавить дополнительный визуальный контекст к вашим подсказкам, теперь вы можете не только автоматически делать скриншоты , но и загружать произвольные изображения в свои чаты с Gemini через панель помощи ИИ .

Начните диалог с панели «Элементы» , выбрав элемент DOM и щелкнув по нему. Обратитесь к ИИ , чтобы элемент был указан как контекст разговора . Затем нажмите и добавьте изображение в поле ввода.

До и после — поддержка произвольной загрузки изображений.

Добавьте заголовки запроса в таблицу в разделе «Сеть».

В панели «Сеть» теперь можно щелкнуть правой кнопкой мыши по имени столбца в таблице запросов и выбрать несколько заголовков запросов, чтобы добавить их в качестве столбцов.

Фотографии до и после добавления опции «заголовки запроса» в меню.

Проблема с Chromium: 397481040 .

Ознакомьтесь с основными моментами конференции Google I/O 2025.

Если вы еще этого не сделали, попробуйте новые важные функции Chrome DevTools, представленные на конференции Google I/O 2025 , включая, помимо прочего:

Кроме того, ознакомьтесь с новыми аналитическими данными о производительности : дублированный JavaScript и устаревший JavaScript .

Различные важные моменты

Вот лишь некоторые из многочисленных существенных исправлений и улучшений в этом релизе:

  • Приложение : Теперь появляется диалоговое окно подтверждения для очистки хранилищ объектов IndexedDB, поскольку это необратимое действие ( crbug.com/326987147 ).
  • Источники : Теперь значки точек логирования и условных точек останова рядом со строками кода отображают всплывающую подсказку при наведении курсора с соответствующим сообщением в логе или условием ( crbug.com/40266230 ).

  • Производительность :

    • В разделе «Информация о причинах смещения макета» теперь отображаются ссылки на изображения без указания размера ( crbug.com/416449602 ).
    • В функции обнаружения запросов LCP теперь отображается задержка загрузки изображения после самой ранней начальной точки.
    • Регулирование скорости : Исправлен устаревший формат настроек регулирования скорости, которые некоторые пользователи сохраняли локально.
    • Журнал событий : Скорость фильтрации повысилась ( crbug.com/40783421 ).

  • Анимации : Предварительный просмотр скриншотов устарел, поскольку предварительный просмотр группы анимаций по щелчку мыши обеспечивает аналогичный и даже лучший пользовательский опыт ( crbug.com/330179643 ).

  • Доступность :

    • Добавлены атрибуты aria-labels в боковую панель «Источники > Точки останова DOM» , если они присутствуют.
    • Исправлена ​​навигация с помощью сочетания клавиш Shift + Tab в текстовом поле «Выражение в реальном времени» в консоли ( crbug.com/408398435 , crbug.com/420344137 ).
    • В настройках теперь поддерживаются сочетания клавиш для увеличения/уменьшения масштаба/сброса: Cmd/Ctrl + +/-/0 ( crbug.com/41484555 ).
    • Элементы > Стили : значки подсказок и предупреждений CSS ( crbug.com/40706851 ) и часы Angle теперь доступны для фокусировки с клавиатуры ( crbug.com/401212624 , crbug.com/401213524 ).

Загрузите предварительные каналы

Рекомендуем использовать Chrome Canary , Dev или Beta в качестве браузера по умолчанию для разработки. Эти предварительные версии предоставляют доступ к новейшим функциям DevTools, позволяют тестировать передовые API веб-платформ и помогают выявлять проблемы на вашем сайте до того, как их обнаружат пользователи!

Свяжитесь с командой Chrome DevTools

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

Что нового в инструментах разработчика

Список всего, что было рассмотрено в серии статей «Что нового в инструментах разработчика» .