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

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

Получите больше информации с помощью Gemini

В разделе «Производительность» > «Аналитика» теперь можно нажать «Отладка с помощью ИИ» (ранее «Спросить ИИ» ), чтобы пообщаться и выполнить отладку с помощью Gemini на панели помощи ИИ. Дополнительные аналитические данные о производительности:

  • Улучшить доставку изображений
  • Устаревший JavaScript
  • Дублированный JavaScript
  • Современный HTTP

До и после добавления кнопки «Отладка с помощью ИИ» для получения более подробной информации о производительности.

Эмулировать заголовок «Save-Data» в «Состояниях сети»

На панели «Сетевые условия» теперь можно эмулировать поведение заголовка запроса Save-Data . Этот заголовок представляет собой подсказку для сетевого клиента, указывающую на его желание сократить потребление данных. Он также доступен через API navigator.connection.saveData .

До и после добавления эмуляции заголовка запроса «Save-Data» в «Сетевые условия».

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

Смотрите базовый статус в подсказке по свойству CSS

В разделе Элементы > Стили при наведении курсора на любое свойство CSS теперь под определением свойства отображается его доступность в основных браузерах в соответствии с его базовым статусом.

До и после добавления базового статуса в подсказки свойств CSS.

Проблема с хромом: 417749762 .

Переопределение форм-факторов в клиентских подсказках пользовательского агента

В раскрывающемся списке Сетевые условия > Подсказки клиента пользовательского агента теперь есть возможность переопределить форм-факторы, в частности значения заголовка запроса Sec-CH-UA-Form-Factors .

До и после добавления опций переопределения форм-фактора в клиентские подсказки пользовательского агента.

Проблема с хромом: 422218341 .

Маяк 12.8.0

Панель Lighthouse теперь работает под управлением Lighthouse 12.8.0.

В этой версии Lighthouse в частности добавляет новый отчет: устранение XSS-атак на основе DOM с помощью доверенных типов.

См. также полный список изменений .

Чтобы изучить основы использования панели Lighthouse в DevTools, ознакомьтесь с разделом Lighthouse: Оптимизация скорости сайта .

Проблема с хромом: 40543651 .

Разные моменты

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

  • Помощь ИИ :
    • История чата теперь очищается при отключении соответствующей функции ИИ в Настройках .
    • Доступность : программы чтения с экрана теперь заранее озвучивают заголовки контекста: «Загрузка ответа», когда начинается потоковая передача ответа, и «Ответ готов», когда ответ завершен.
  • Элементы :
    • Вкладка «Стили» теперь может оценивать CSS-функции sibling-index() , sibling-count() и env() ( crbug.com/417128001 , crbug.com/40196710 ).
    • Добавлена ​​поддержка псевдоэлемента ::view-transition-group-children ( crbug.com/425901164 ).
    • Добавлена ​​поддержка проблем доступности интерактивного контента в элементе <summary> ( crbug.com/427172874 ).
    • Из вкладки «Вычисляемые » теперь можно перейти к полным свойствам в стилях ( crbug.com/41486012 ).
    • Изменение цвета, редакторы цвета : теперь вы можете взаимодействовать с образцами Безье для анимационных переходов и образцами цветов с помощью клавиатуры ( crbug.com/401213421 ).
  • Сеть : импорт файлов HAR теперь также включает файлы cookie запросов и ответов ( crbug.com/432995868 ).
  • Режим устройства : обновлены пользовательские агенты для устройств Apple до последней версии Safari 18.5.

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

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

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

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

Что нового в DevTools

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