Более надежный и производительный Chrome DevTools
В этой версии Chrome DevTools сделал ставку на безупречное качество продукта. Это включало в себя решение широкого спектра известных проблем: от давних визуальных сбоев, проблем с удобством использования и несоответствий в дизайне до проблем с производительностью и функциональностью. В целом, мы сократили количество открытых проблем на 27%.
Мы наконец-то решили некоторые старые проблемы, а также улучшили новые функции, например, панель «Производительность» и функцию помощи ИИ . В результате значительно улучшился общий опыт разработчиков.
В то же время мы проделали огромную работу по улучшению тестового покрытия, исследовали сложные сбои в тестах, перенесли тесты на более надёжную основу и исправили ошибки, обнаруженные в процессе. Нам удалось сократить количество проблем, связанных с тестированием, на 54%.
Мы надеемся, что вы оцените эти многочисленные незначительные исправления и улучшения на различных панелях, которые сделают ваши ежедневные процессы отладки и разработки более плавными, надежными и продуктивными.
Загрузите изображения в систему ИИ для стилизации
Чтобы обеспечить дополнительный визуальный контекст для ваших подсказок, теперь вы можете не только делать автоматические снимки экрана , но и загружать произвольные изображения в ваши чаты с Gemini на панели помощи ИИ .
Начните разговор с панели «Элементы» , выбрав элемент DOM и нажав Спросите AI , чтобы элемент был указан как контекст беседы . Затем нажмите чтобы добавить изображение в поле ввода.
Добавить заголовки запроса в таблицу в сети
На панели «Сеть» теперь можно щелкнуть правой кнопкой мыши имя столбца в таблице запросов и выбрать несколько заголовков запросов, чтобы добавить их в качестве столбцов.
Проблема с хромом: 397481040 .
Ознакомьтесь с основными моментами Google I/O 2025
Если вы еще этого не сделали, попробуйте новые основные функции Chrome DevTools, представленные на Google I/O 2025 , включая, помимо прочего:
- Источники : подключите папку рабочего пространства и сохраните изменения в исходных файлах .
- На базе Gemini :
Кроме того, ознакомьтесь с новыми сведениями о производительности : дублированный 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.
- Отправляйте отзывы и предложения по функциям нам на crbug.com .
- Сообщить о проблеме с DevTools можно с помощью функции Дополнительные параметры > Справка > Сообщить о проблеме с DevTools в DevTools.
- Напишите твит в @ChromeDevTools .
- Оставляйте комментарии в видеороликах YouTube «Что нового в DevTools» или YouTube «Советы по DevTools» .
Что нового в DevTools
Список всего, что было рассмотрено в серии «Что нового в DevTools» .
- Обновления сервера DevTools MCP
- Улучшенный обмен трассировками
- Поддержка @starting-style
- Виджет редактора для отображения: кладка
- Маяк 13
- Предложения по коду от Gemini
- Улучшения для сервера DevTools MCP
- Более быстрый доступ к помощи ИИ
- Отладка полной трассировки производительности с помощью Gemini
- Изменить ориентацию ящика
- Программа разработчиков Google
- Разные моменты
- Chrome DevTools (MCP) для вашего ИИ-агента
- Отладка дерева сетевых зависимостей с помощью Gemini
- Экспортируйте свои чаты с Gemini
- Сохраненная конфигурация трека на панели «Производительность»
- Фильтрация сетевых запросов с защищенным IP-адресом
- Вкладка «Элементы» > «Макет» добавляет поддержку макета кладки
- Маяк 12.8.2
- Разные моменты
- Получите больше информации с помощью Gemini
- Эмулировать заголовок «Save-Data» в «Состояниях сети»
- Смотрите базовый статус в подсказке по свойству CSS
- Переопределение форм-факторов в клиентских подсказках пользовательского агента
- Маяк 12.8.0
- Разные моменты
- Более надежный и производительный Chrome DevTools
- Загрузите изображения в систему ИИ для стилизации
- Добавить заголовки запроса в таблицу в сети
- Ознакомьтесь с основными моментами Google I/O 2025
- Разные моменты
- Улучшения панели производительности
- Предварительно подключенные источники в представлении «Дерева сетевых зависимостей»
- Время ответа сервера и время перенаправления в отчете «Задержка запроса документа»
- Перенаправления в сводке сетевых запросов
- Уменьшение шума в характеристиках производительности
- Устаревшее «Отключить примеры JavaScript»
- Параметр точности геолокации в датчиках
- Улучшения панели элементов
- Упрощенная отладка сложных значений CSS
- Поддержка @function в Элементах > Стили
- Улучшения сетевой панели
- фильтр has-request-header
- Прямые сокеты в изолированных веб-приложениях
- Разные моменты
- Доступность
- Google I/O 2025
- Измените и сохраните изменения CSS в вашем рабочем пространстве с помощью Gemini
- Подключите папку рабочего пространства и сохраните изменения в исходных файлах.
- Спросите Gemini о показателях эффективности
- Аннотируйте результаты производительности с помощью Gemini
- Добавляйте скриншоты в свои чаты с Gemini
- Новые данные на панели «Производительность»
- Дублированный JavaScript
- Устаревший JavaScript
- Спекуляции теперь поддерживают теги правил
- Маяк 12.6.0
- Разные моменты
- Доступность
- Улучшения панели производительности
- Новые данные о производительности
- Нажмите, чтобы выделить
- Тайминги сервера в сводке сетевых запросов
- Фильтрация файлов cookie в разделе «Конфиденциальность и безопасность»
- Размеры в килобайтах в таблицах на панелях
- Автозаполнение поддерживает corner-shape и corner-*-shape в Элементах > Стили
- Экспериментальная часть: выявление проблем с элементами и атрибутами в DOM
- Маяк 12.5.0
- Разные моменты
- Улучшения панели производительности
- Ссылки на источники и скрипты для вызовов профилей и функций в Performance
- Поддержка данных LCP по фазовому полю
- Анализ дерева сетевых зависимостей
- Длительность вместо общего и собственного времени в сводке
- Самая тяжелая подсветка стека
- Улучшены пустые состояния для различных панелей.
- Древовидная структура доступности в Elements
- Маяк 12.4.0
- Разные моменты
- Панель конфиденциальности и безопасности
- Улучшения панели производительности
- Откалиброванные предустановки регулирования производительности ЦП
- Выбирайте различные события в одном чате ИИ
- Подсветка первой и третьей стороны в Performance
- Полевые данные в подсказках и аналитике маркеров
- Понимание принудительной перекомпоновки
- Советы по оптимизации размера DOM
- Расширьте трассировку производительности с помощью console.timeStamp
- Улучшения панели элементов
- Значения анимированных стилей в реальном времени
- Поддержка псевдокласса :open и различных псевдоэлементов
- Копировать все сообщения консоли
- Байтовые единицы на панели «Память»
- Разные моменты
- Постоянная история чата ИИ
- Улучшения панели производительности
- Понимание доставки изображений
- Классическая и современная навигация с помощью клавиатуры
- Игнорировать нерелевантные скрипты в диаграмме пламени
- Маркер временной шкалы и выделение диапазона при наведении курсора
- Рекомендуемые настройки регулирования
- Маркеры времени в наложении
- Стек-трейсы вызовов JS в Сводке
- Настройки значка перенесены в меню «Элементы»
- Новая панель «Что нового»
- Маяк 12.3.0
- Разные моменты
- Отладка сетевых запросов, исходных файлов и трассировка производительности с помощью Gemini
- Просмотреть историю чата ИИ
- Управление хранилищем расширений в разделе «Приложение» > «Хранилище».
- Улучшения производительности
- Фазы взаимодействия в живых метриках
- Отображать информацию о блокировках на вкладке «Сводка»
- Поддержка событий scheduler.postTask и их стрелок-инициаторов

