Что нового в DevTools (Chrome 95)

Jecelyn Yeen

Примечание: Хотите помочь улучшить DevTools? Зарегистрируйтесь для участия в исследовании пользовательского опыта Google здесь .

Новые инструменты для создания CSS-стилей с указанием длины

В инструментах разработчика появился более простой и гибкий способ изменения длины в CSS!

В панели «Стили» найдите любое свойство CSS, содержащее значение длины (например, height , padding ).

Наведите курсор на тип единицы измерения, и вы увидите, что он подчеркнут. Щелкните по нему, чтобы выбрать тип единицы измерения из выпадающего списка.

Наведите курсор мыши на значение единицы измерения, и указатель изменится на горизонтальный. Перетаскивайте курсор по горизонтали, чтобы увеличить или уменьшить значение. Чтобы изменить значение на 10, удерживайте клавишу Shift во время перетаскивания.

Вы по-прежнему можете редактировать значение единицы измерения как текст — просто щелкните по значению и начните редактирование.

Проблемы Chromium: 1126178 , 1172993

Скрыть проблемы на вкладке «Проблемы»

Теперь вы можете скрывать определенные задачи на вкладке «Задачи», чтобы сосредоточиться только на тех задачах, которые важны для вас.

На вкладке «Проблемы» наведите курсор на проблему, которую хотите скрыть. Нажмите «Дополнительные параметры». > Скрыть подобные проблемы .

Все скрытые задачи будут добавлены в панель «Скрытые задачи» . Разверните панель. Вы можете отобразить все скрытые задачи или только одну выбранную.

Проблема с Chromium: 1175722

Улучшено отображение свойств.

Инструменты разработчика улучшают отображение свойств за счет:

• В консоли , на панели «Источники» и в панели «Свойства» всегда выделяйте жирным шрифтом и располагайте свои свойства первыми.
• Сгладьте отображение свойств на панели «Свойства» .

Например, приведенный ниже фрагмент кода создает объект URL link с двумя собственными свойствами: user и access , и обновляет значение унаследованного свойства search .

/* example.js */

const link = new URL('https://goo.gle/devtools-blog');

link.user = { id: 1, name: 'Jane Doe' };
link.access = 'admin';
link.search = `?access=${link.access}`;

Попробуйте ввести link в консоли . Собственные свойства теперь выделены жирным шрифтом и отсортированы первыми. Эти изменения упрощают обнаружение пользовательских свойств, особенно для веб-API (например, URL ) с большим количеством унаследованных свойств.

Помимо этих изменений, свойства на панели «Свойства» теперь также сглажены для более удобной отладки свойств DOM, особенно для веб-компонентов .

Проблемы Chromium: 1076820 , 1119900

Маяк 8.4 на панели «Маяк»

В панели Lighthouse теперь используется Lighthouse 8.4. Lighthouse теперь будет определять, является ли элемент Largest Containful Paint (LCP) изображением с отложенной загрузкой, и рекомендовать удалить из него атрибут loading .

Подробную информацию об обновлениях вы найдете в разделе « Что нового в Lighthouse 8.4» .

Номер выпуска Chromium: 772558

Сортируйте фрагменты текста на панели «Источники».

Фрагменты кода в панели «Фрагменты» в разделе «Источники» теперь отсортированы по алфавиту. Ранее сортировка отсутствовала.

Используйте функцию фрагментов кода для более быстрого выполнения команд. Посмотрите это видео, чтобы получить полезный совет !

Номер выпуска Chromium: 1243976

Новые ссылки на переведённые примечания к выпуску и форму сообщения об ошибке перевода.

Теперь вы можете прочитать примечания к выпуску DevTools на 6 других языках — русском , китайском , испанском , японском , португальском и корейском — на вкладке «Что нового».

Начиная с Chrome 94, вы можете установить предпочитаемый язык в Инструментах разработчика. Если вы обнаружили какие-либо проблемы с переводом, помогите нам улучшить его, сообщив о проблеме с переводом через Дополнительные параметры > Справка > Сообщить об ошибке перевода .

Проблемы Chromium: 1246245 , 1245481

Улучшен пользовательский интерфейс меню командных инструментов разработчика.

Вам было сложно найти файл в командном меню ? Хорошие новости! Пользовательский интерфейс командного меню теперь улучшен!

Для поиска файла откройте меню Command , используя сочетание клавиш Control + P в Windows и Linux или Command + P в MacOS.

Работа над улучшением пользовательского интерфейса командного меню продолжается, следите за обновлениями!

Выпуск Chromium: 1201997

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

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

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

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

• Отправляйте нам свои отзывы и предложения по улучшению функционала на сайте crbug.com .
• Сообщить о проблеме в инструментах разработчика можно с помощью параметра more_vert. Дополнительные параметры > Справка > Сообщить о проблеме в инструментах разработчика .
• Напишите в Твиттере @ChromeDevTools .
• Оставляйте комментарии к видеороликам на YouTube «Что нового в инструментах разработчика» или «Советы по инструментам разработчика» на YouTube .

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

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

Хром 143

• Обновления сервера DevTools MCP
• Улучшенное совместное использование трассировки
• Поддержка @starting-style
• Виджет редактора для отображения: кладка
• Маяк 13

Хром 142

• Предложения по коду от Gemini
• Улучшения для сервера DevTools MCP.
• Более быстрый доступ к помощи ИИ.
• Отладка полной трассировки производительности с помощью Gemini.
• Изменить ориентацию выдвижного ящика
• Программа для разработчиков Google
• Различные важные моменты

Хром 141

• Инструменты разработчика Chrome (MCP) для вашего ИИ-агента
• Отладка дерева сетевых зависимостей с помощью Gemini.
• Экспортируйте свои чаты с помощью Gemini
• Сохраненная конфигурация трека на панели «Производительность».
• Фильтрация сетевых запросов, защищенных IP-адресом.
• Вкладка «Элементы > Макет» добавляет поддержку макета «кирпичная кладка».
• Маяк 12.8.2
• Различные важные моменты

Хром 140

• Получите больше аналитической информации с помощью Gemini.
• В разделе «Сетевые условия» эмулируйте заголовок «Save-Data».
• Отображение базового состояния во всплывающей подсказке свойства CSS.
• Переопределение форм-факторов в подсказках клиентского пользовательского агента
• Маяк 12.8.0
• Различные важные моменты

Хром 139

• Более надежные и эффективные инструменты разработчика Chrome
• Загрузите изображения в систему помощи ИИ для создания стиля.
• Добавьте заголовки запроса в таблицу в разделе «Сеть».
• Ознакомьтесь с основными моментами конференции Google I/O 2025.
• Различные важные моменты

Хром 138

• Улучшения производительности панели
• Предварительно связанные истоки в анализе «дерева сетевых зависимостей»
• Время ответа сервера и время перенаправления в разделе «Задержка запроса документа»
• Перенаправления в сводке сетевых запросов
• Снижение уровня шума в графике производительности.
• Устаревшая функция «Отключить примеры JavaScript»
• Параметр точности геолокации в датчиках
• Улучшения панели элементов
• Упрощенная отладка сложных значений CSS.
• Поддержка @function в Элементах > Стили
• Улучшения сетевой панели
• has-request-header filter
• Прямые сокеты в изолированных веб-приложениях
• Различные важные моменты
• Доступность

Хром 137

• Google I/O 2025
• Изменяйте и сохраняйте изменения CSS в своем рабочем пространстве с помощью Gemini.
• Подключите папку рабочей области и сохраните изменения в исходных файлах.
• Обратитесь в Gemini за информацией об эффективности работы.
• Аннотируйте результаты анализа производительности с помощью Gemini.
• Добавляйте скриншоты в свои чаты с помощью Gemini.
• Новые данные в панели «Производительность»
• Дублированный JavaScript
• Устаревший JavaScript
• Теперь появились предположения, подтверждающие наличие тегов правил.
• Маяк 12.6.0
• Различные важные моменты
• Доступность

Хром 136

• Улучшения производительности панели
• Новые данные об эффективности
• Нажмите, чтобы выделить
• Время выполнения серверных запросов указано в сводке сетевых запросов.
• Фильтрация файлов cookie в разделе «Конфиденциальность и безопасность»
• Размеры указаны в единицах КБ в таблицах на разных панелях.
• Автозаполнение поддерживает corner-shape и corner-*-shape в разделе «Элементы > Стили».
• Экспериментальная функция: выявление проблем с элементами и атрибутами в DOM.
• Маяк 12.5.0
• Различные важные моменты

Хром 135

• Улучшения производительности панели
• Ссылки на источники и скрипты для вызовов профилей и функций в разделе «Производительность»
• LCP с поддержкой данных фазового поля
• Анализ дерева сетевых зависимостей
• В сводке вместо общего и личного времени указывается продолжительность.
• Подсветка наиболее тяжелого стека
• Улучшены состояния пустого пространства для различных панелей.
• Древовидное представление доступности в Elements
• Маяк 12.4.0
• Различные важные моменты

Хром 134

• Панель конфиденциальности и безопасности
• Улучшения производительности панели
• Откалиброванные предустановки регулирования производительности процессора
• Выберите различные события, связанные с производительностью, в одном и том же чате с использованием ИИ.
• Выделение результатов поиска по ключевым словам и сторонним сервисам в разделе «Производительность».
• Полевые данные во всплывающих подсказках и аналитических отчетах по маркерам.
• Информация о принудительном переформатировании
• Информация по оптимизации размера DOM
• Расширьте трассировку производительности с помощью console.timeStamp.
• Улучшения панели элементов
• Значения анимированных стилей в реальном времени
• Поддержка псевдокласса `:open` и различных псевдоэлементов.
• Скопировать все сообщения консоли
• Байтовые единицы на панели «Память»
• Различные важные моменты

Хром 133

• Постоянная история чата с использованием ИИ
• Улучшения производительности панели
• Анализ доставки изображений
• Классическая и современная навигация с помощью клавиатуры
• Игнорируйте нерелевантные скрипты на диаграмме пламени.
• Маркеры временной шкалы и подсветка диапазона при наведении курсора
• Рекомендуемые настройки регулирования скорости
• Временные метки наложены
• Трассировка стека вызовов JavaScript в сводке
• Настройки значка перемещены в меню Elements.
• Новая панель «Что нового»
• Маяк 12.3.0
• Различные важные моменты

Хром 132

• Отладка сетевых запросов, исходных файлов и трассировок производительности с помощью Gemini.
• Просмотреть историю чата с использованием ИИ.
• Управление хранилищем расширений осуществляется в разделе «Приложения» > «Хранилище».
• Улучшения производительности
• Фазы взаимодействия в метриках реального времени
• Информация о блокировке рендеринга находится на вкладке «Сводка».
• Поддержка событий scheduler.postTask и стрелок-инициаторов для них.
• Улучшения в панели «Анимация» и вкладке «Элементы > Стили».
• Перейти из раздела «Элементы» > «Стили» в раздел «Анимация».
• Обновления в режиме реального времени на вкладке «Вычисления».
• Вычисление эмуляции давления в датчиках
• Объекты JavaScript с одинаковым именем сгруппированы по источнику на панели «Память».
• Новый дизайн настроек
• Панель анализа производительности устарела и удалена из инструментов разработчика.
• Различные важные моменты

Хром 131

• Отладка CSS с помощью Gemini
• Управляйте функциями ИИ на специальной вкладке настроек.
• Улучшения производительности панели
• Аннотируйте и делитесь результатами анализа производительности.
• Получайте аналитические данные о производительности прямо на панели «Производительность».
• Обнаружить чрезмерные изменения в компоновке проще.
• Найдите некомпозитные анимации.
• Аппаратная параллельность переносится на датчики.
• Игнорируйте анонимные скрипты и сосредоточьтесь на своем коде в трассировках стека.
• Элементы > Стили: Поддержка режимов написания с боковым * для наложений сетки и ключевых слов, используемых во всем CSS.
• Аудит Lighthouse для страниц, не использующих протокол HTTP, в режимах временного интервала и снимка.
• Улучшения доступности
• Различные важные моменты

Хром 130

• Улучшения сетевой панели
• Переосмысление сетевых фильтров
• Теперь при экспорте HAR по умолчанию исключаются конфиденциальные данные.
• Улучшения панели элементов
• Значения автозаполнения для свойств text-embassis-*
• Переполнение при прокрутке отмечено значком
• Улучшения производительности панели
• Рекомендации в режиме реального времени на основе метрик
• Перемещайтесь по хлебным крошкам
• Улучшения панели памяти
• Новый профиль «Отдельно стоящие элементы».
• Улучшено именование простых объектов JavaScript.
• Отключите динамическое оформление.
• Эксперимент Chrome: совместное использование процессов
• Маяк 12.2.1
• Различные важные моменты

Хром 129

• Программа записи экрана поддерживает экспорт в Puppeteer для Firefox.
• Улучшения производительности панели
• Наблюдения за показателями в реальном времени
• Поисковые запросы в разделе «Сеть»
• См. трассировку стека вызовов performance.mark и performance.measure.
• Используйте тестовые данные адреса в панели автозаполнения.
• Улучшения панели элементов
• Принудительное добавление состояний для конкретных элементов
• В разделе «Элементы > Стили» теперь автоматически заполняется больше свойств сетки.
• Маяк 12.2.0
• Различные важные моменты

Хром 128

• Аналитические функции консоли от Gemini становятся доступны в большинстве европейских стран.
• Обновления панели производительности
• Расширенная сетевая дорожка
• Настраивайте данные о производительности с помощью API расширяемости.
• Подробности в разделе «Время проведения».
• Скопируйте все перечисленные запросы в панели «Сеть».
• Более быстрые снимки состояния кучи с использованием именованных HTML-тегов и меньшим количеством лишнего контента.
• Откройте панель «Анимация», чтобы захватывать анимации и редактировать ключевые кадры в режиме реального времени.
• Маяк 12.1.0
• Улучшения доступности
• Различные важные моменты

Хром 127

• Проверьте позиционирование ссылок CSS в панели «Элементы».
• Улучшения панели источников
• Улучшенная версия "Никогда не делайте здесь паузу"
• Новые обработчики событий привязки прокрутки
• Улучшения сетевой панели
• Обновлены настройки регулирования сети.
• Информация о сотруднике службы поддержки в пользовательских полях формата HAR
• Отправляйте и получайте события WebSocket на панели «Производительность».
• Различные важные моменты

Хром 126

• Улучшения производительности панели
• Перемещайте и скрывайте рельсы с помощью обновленного режима настройки рельсов.
• Игнорировать скрипты на диаграмме пламени
• Снизить производительность процессора в 20 раз.
• Панель анализа производительности будет упразднена.
• Обнаружение чрезмерного использования памяти с помощью новых фильтров в снимках кучи.
• Проверьте разделы хранилища в разделе «Приложение» > «Хранилище».
• Отключите предупреждения о самоуязвимости XSS с помощью флага командной строки.
• Маяк 12.0.0
• Различные важные моменты

Хром 125

• С Gemini вы сможете лучше понимать ошибки и предупреждения в консоли.
• Поддержка правил @position-try в разделе «Элементы > Стили».
• Улучшения панели источников
• Настройте автоматическую форматированную печать и закрытие скобок.
• Обработанные отклоненные обещания помечаются как перехваченные.
• Причины ошибок в консоли
• Улучшения сетевой панели
• Проверьте заголовки Early Hints.
• Скрыть колонку «Водопад»
• Улучшения производительности панели
• Сбор статистики по CSS-селекторам
• Изменить порядок и скрыть следы
• Игнорировать элементы управления в панели «Память»
• Маяк 11.7.1
• Различные важные моменты

Хром 124

• Новая панель автозаполнения
• Улучшенное регулирование скорости сети для WebRTC.
• Поддержка анимаций, управляемых прокруткой, в панели «Анимации».
• Улучшена поддержка вложенности CSS в разделе «Элементы > Стили».
• Панель повышения производительности
• Скрыть функции и их дочерние элементы на диаграмме пламени.
• Стрелки от выбранных инициаторов к событиям, которые они инициировали.
• Маяк 11.6.0
• Всплывающие подсказки для специальных категорий в разделе Память > Снимки кучи
• Приложение > Обновления хранилища
• Байты, используемые для общего хранилища
• Web SQL полностью устарел.
• Улучшения в работе панели покрытия.
• Панель «Слои» может быть устаревшей.
• Прекращение поддержки JavaScript Profiler: четвертый этап, заключительный
• Различные важные моменты

Хром 123

• Найдите пасхальное яйцо
• Обновления панели элементов
• Имитация активной страницы в разделе «Элементы > Стили»
• Палитра цветов, часы углов и редактор сглаживания доступны в качестве резервных вариантов в функции var()
• Инструмент CSS length устарел.
• Всплывающее окно для выбранного результата поиска в разделе «Производительность > Основной трек»
• Обновления сетевой панели
• Кнопка «Очистить» и фильтр поиска на вкладке «Сеть» > «Поток событий»
• Всплывающие подсказки с указанием причин исключения сторонних файлов cookie в разделе «Сеть > Файлы cookie».
• Включать и отключать все точки останова в исходном коде.
• Просмотр загруженных скриптов в инструментах разработчика для Node.js
• Маяк 11.5.0
• Улучшения доступности
• Различные важные моменты

Хром 122

• Официальная коллекция расширений для Recorder уже доступна.
• Улучшения сети
• Причина сбоя указана в столбце «Статус».
• Улучшенное подменю «Копировать»
• Улучшения производительности
• Хлебные крошки на временной шкале
• Инициаторы мероприятий в основной сетке
• Меню выбора экземпляра виртуальной машины JavaScript для инструментов разработчика Node.js
• В разделе «Источники» появилась новая комбинация клавиш и команда.
• Улучшения элементов
• Псевдоэлемент ::view-transition теперь можно редактировать в стилях.
• Поддержка свойства align-content для блочных контейнеров
• Поддержка осанки для эмулируемых складных устройств
• Динамическое оформление тем
• Предупреждения о прекращении использования сторонних файлов cookie в панелях «Сеть» и «Приложения».
• Маяк 11.4.0
• Улучшения доступности
• Различные важные моменты

Хром 121

• Улучшения элементов
• Упрощенная панель фильтров в панели «Сеть».
• @font-palette-values ​​поддержка
• Поддерживаемый случай: Использование пользовательского свойства в качестве резервного варианта для другого пользовательского свойства.
• Улучшена поддержка карт исходного кода.
• Улучшения производительности панели
• Расширенные возможности взаимодействия (трек)
• Расширенная фильтрация на вкладках «Снизу вверх», «Дерево вызовов» и «Журнал событий».
• Маркеры отступов на панели «Источники».
• Полезные всплывающие подсказки для переопределенных заголовков и содержимого на панели «Сеть».
• Новые параметры командного меню для добавления и удаления шаблонов блокировки запросов.
• Эксперимент с нарушениями CSP отменен.
• Маяк 11.3.0
• Улучшения доступности
• Различные важные моменты

Хром 120

• Поэтапное прекращение использования сторонних файлов cookie
• Проанализируйте файлы cookie вашего веб-сайта с помощью инструмента анализа конфиденциальности Privacy Sandbox.
• Расширенный список игнорируемых объектов
• Шаблон исключения по умолчанию для node_modules
• Теперь перехваченные исключения останавливают выполнение, если они перехвачены или проходят через неигнорируемый код.
• В исходных картах x_google_ignoreList переименована в ignoreList
• Новая функция переключения режима ввода во время удаленной отладки.
• На панели «Элементы» теперь отображаются URL-адреса для узлов #document.
• Эффективная политика безопасности контента в панели приложения
• Улучшена отладка анимации.
• Диалоговое окно «Вы доверяете этому коду?» в исходном коде и предупреждение о самоуязвимости XSS в консоли.
• Точки останова обработчиков событий в веб-воркерах и воллетах
• Новый значок для медиаконтента ( <audio> и <video> .
• Предварительная загрузка переименована в Спекулятивную загрузку.
• Маяк 11.2.0
• Улучшения доступности
• Различные важные моменты

Хром 119

• Улучшен раздел @property в Elements > Styles.
• Редактируемое правило @свойства
• Сообщается о проблемах, связанных с некорректными правилами @property.
• Обновленный список устройств для эмуляции.
• Красивое форматирование JSON непосредственно в тегах <script> в исходном коде
• Автозаполнение закрытых полей в консоли
• Маяк 11.1.0
• Улучшения доступности
• Прекращение поддержки Web SQL
• Проверка соотношения сторон скриншота в разделе «Приложение > Манифест».
• Различные важные моменты

Хром 118

• Новый раздел для пользовательских свойств в Elements > Styles.
• Дополнительные улучшения в области локальных переопределений.
• Расширенный поиск
• Улучшенная панель «Источники»
• Упрощенное рабочее пространство на панели «Источники».
• Изменить порядок панелей в разделе «Источники»
• Подсветка синтаксиса и форматированный вывод для большего количества типов скриптов.
• Имитация функции воспроизведения медиаконтента с пониженной прозрачностью
• Маяк 11
• Улучшения доступности
• Различные важные моменты

Хром 117

• Улучшения сетевой панели
• Еще быстрее перезаписывайте веб-контент локально.
• Переопределяйте содержимое XHR-запросов и запросов на получение данных.
• Скрыть запросы на расширение Chrome
• Удобочитаемые коды состояния HTTP

• Отформатированные ответы для подтипов JSON

• Производительность: см. изменения в приоритете получения сетевых событий.

• В настройках источников по умолчанию включены: сворачивание кода и автоматическое отображение файлов.
• Улучшена отладка проблем, связанных с файлами cookie сторонних разработчиков.
• Новые цвета
• Маяк 10.4.0
• Предварительная загрузка отладки в панели приложения.
• Расширение для отладки C/C++ WebAssembly в DevTools теперь имеет открытый исходный код.
• Различные важные моменты
• (Экспериментальная) Новая эмуляция рендеринга: prefers-reduced-transparency
• (Экспериментальный) Усовершенствованный монитор протокола

Хром 116

• Улучшена отладка отсутствующих таблиц стилей.
• Поддержка линейного тайминга в разделе Элементы > Стили > Редактор сглаживания
• Поддержка сегментов хранилища и просмотр метаданных
• Маяк 10.3.0
• Доступность: сочетания клавиш и улучшенная функция чтения с экрана.
• Различные важные моменты

Хром 115

• Улучшения элементов
• Новый значок CSS-подсетки
• Специфичность селектора во всплывающих подсказках
• Значения пользовательских свойств CSS во всплывающих подсказках
• Улучшения источников
• Подсветка синтаксиса CSS
• Быстрый способ установки условных точек останова
• Приложение > Меры по предотвращению отказов при отслеживании посещений
• Маяк 10.2.0
• По умолчанию игнорировать скрипты содержимого.
• Сеть > Улучшения скорости отклика
• Различные важные моменты

Хром 114

• Поддержка отладки WebAssembly
• Улучшено пошаговое выполнение кода в приложениях Wasm.
• Отладка автозаполнения с помощью панели «Элементы» и вкладки «Проблемы».
• Утверждения в регистраторе
• Маяк 10.1.1
• Улучшения производительности
• Функция performance.mark() отображает время выполнения при наведении курсора в разделе «Производительность > Время выполнения».
• Команда profile() заполняет раздел «Производительность > Главная».
• Предупреждение о медленной реакции пользователя
• Обновления Web Vitals
• Прекращение поддержки JavaScript Profiler: третий этап
• Различные важные моменты

Хром 113

• Переопределение заголовков сетевого ответа
• Улучшения в отладке Nuxt, Vite и Rollup.
• Улучшения CSS в разделе «Элементы > Стили».
• Недопустимые свойства и значения CSS.
• Ссылки на ключевые кадры в сокращенном описании анимации
• Новая настройка консоли: автозаполнение при нажатии клавиши Enter.
• Меню команд акцентирует внимание на созданных файлах.
• Прекращение поддержки JavaScript Profiler: второй этап
• Различные важные моменты

Хром 112

• Обновления регистратора
• Расширения для воспроизведения записи
• Запись с использованием селекторов прокола
• Экспорт записей в виде скриптов Puppeteer с анализом в Lighthouse.
• Получите расширения для Recorder
• Элементы > Обновления стилей
• Документация по CSS находится в панели «Стили».
• Поддержка вложенности CSS
• Отметка точек логирования и условных точек останова в консоли.
• Во время отладки игнорируйте нерелевантные скрипты.
• Началось прекращение поддержки JavaScript Profiler.
• Имитация пониженного контраста
• Маяк 10
• Различные важные моменты

Хром 111

• Отладка цветопередачи в HD-качестве с помощью панели «Стили».
• Улучшен пользовательский интерфейс точек останова
• Настраиваемые ярлыки для записи экрана
• Улучшена подсветка синтаксиса для Angular.
• Настройте порядок кэша в панели приложений.
• Различные важные моменты

Хром 110

• Очистка панели производительности при перезагрузке
• Обновления регистратора
• Просмотрите и выделите код вашего пользовательского сценария в окне записи.
• Настройка типов селекторов записи
• Редактируйте сценарий взаимодействия пользователя во время записи.
• Автоматическая печать красивых изображений на месте
• Улучшенная подсветка синтаксиса и встроенный предварительный просмотр для Vue, SCSS и других сервисов.
• Эргономичная и надежная функция автозаполнения в консоли.
• Различные важные моменты

Хром 109

• Запись: Копировать как параметры для шагов, воспроизведение на странице, контекстное меню шага.
• Отображение фактических названий функций в записях исполнения.
• Новые сочетания клавиш на панели «Консоль и источники».
• Улучшена отладка JavaScript.
• Различные важные моменты
• [Экспериментальная версия] Улучшен пользовательский интерфейс при управлении точками останова
• [Экспериментальная] Автоматическая печать изображений на месте

Хром 108

• Подсказки для неактивных свойств CSS
• Автоматическое определение XPath и текстовых селекторов на панели записи.
• Пошагово просматривайте выражения, разделённые запятыми.
• Улучшена настройка списка игнорирования.
• Различные важные моменты

Хром 107

• Настройка сочетаний клавиш в инструментах разработчика
• Переключайте светлую и темную темы с помощью сочетания клавиш.
• Выделение объектов C/C++ в инспекторе памяти.
• Поддержка полной информации об инициаторе для импорта HAR.
• Начать поиск в DOM после нажатия клавиши Enter
• Отображение start и end значков для свойства CSS flexbox align-content
• Различные важные моменты

Хром 106

• В панели «Источники» сгруппируйте файлы по дате создания/развертывания.
• Связанные трассировки стека для асинхронных операций
• Автоматически игнорировать известные сторонние скрипты
• Улучшен стек вызовов во время отладки.
• Скрытие источников, помеченных как игнорируемые, на панели «Источники».
• Скрытие файлов, внесенных в список игнорируемых, в командном меню.
• Новая ветка «Взаимодействия» на панели «Производительность».
• Анализ временных характеристик LCP на панели «Аналитика производительности»
• Автоматическое создание имени по умолчанию для записей на панели «Запись».
• Различные важные моменты

Хром 105

• Пошаговое воспроизведение в программе записи
• Поддержка события наведения мыши на панель записи экрана.
• Крупнейший объект Contentful Paint (LCP) на панели анализа производительности.
• Выявите кратковременные всплески текста (FOIT, FOUT) как потенциальные причины изменений в макете.
• Обработчики протоколов в панели «Манифест»
• Значок верхнего слоя на панели «Элементы».
• Подключайте отладочную информацию Wasm во время выполнения.
• Поддержка редактирования в режиме реального времени во время отладки.
• Просматривайте и редактируйте правила @scope в панели «Стили».
• Улучшения карты исходного кода
• Различные важные моменты

Хром 104

• Перезапуск кадра во время отладки
• Параметры замедленного воспроизведения на панели «Запись».
• Создайте расширение для панели записи экрана.
• В панели «Источники» сгруппируйте файлы по дате создания/развертывания.
• Отслеживание времени работы новых пользователей отображается на панели «Аналитика производительности».
• Отобразить назначенный слот элемента
• Имитация аппаратной параллельности для записи производительности
• Предварительный просмотр значений, не относящихся к цвету, при автозаполнении переменных CSS.
• Найдите блокирующие кадры в панели кэша "Назад/Вперед".
• Улучшены подсказки автозаполнения для объектов JavaScript.
• Улучшения карт исходного кода
• Различные важные моменты

Хром 103

• Записывайте события двойного щелчка и щелчка правой кнопкой мыши на панели «Рекордер».
• В панели Lighthouse появились новый временной интервал и режим моментального снимка.
• Улучшено управление масштабированием на панели «Аналитика производительности».
• Подтвердите удаление записи выступления.
• Изменяйте порядок панелей на панели «Элементы».
• Выбор цвета вне браузера
• Улучшен предварительный просмотр значений в режиме отладки.
• Поддержка больших блоков данных для виртуальных аутентификаторов
• Новые сочетания клавиш на панели «Источники».
• Улучшения карт исходного кода

Хром 102

• Функция предварительного просмотра: новая панель анализа производительности.
• Новые сочетания клавиш для имитации светлой и темной тем оформления.
• Улучшена безопасность на вкладке «Предварительный просмотр сети».
• Улучшена перезарядка в точке перелома.
• Обновления консоли
• Отменить запись пользовательского сценария в начале.
• Отображение унаследованных псевдоэлементов подсветки на панели «Стили».
• Различные важные моменты
• [Экспериментальная версия] Копирование изменений CSS
• [Экспериментальная версия] Выбор цвета вне браузера

Хром 101

• Импорт и экспорт записанных пользовательских сценариев в виде JSON-файла.
• Отображение каскадных слоев в панели «Стили».
• Поддержка цветовой функции hwb()
• Улучшена демонстрация частной собственности.
• Различные важные моменты
• [Экспериментальная версия] Новый временной интервал и режим моментального снимка в панели «Маяк».

Хром 100

• Просматривайте и редактируйте правила @supports в панели «Стили».
• Поддержка распространенных селекторов по умолчанию.
• Настройте селектор записи
• Переименовать запись
• Предварительный просмотр свойств класса/функции при наведении курсора
• Частично отображаемые кадры на панели «Производительность»
• Различные важные моменты

Хром 99

• Ограничение количества запросов WebSocket
• Новая панель API для создания отчетов в панели приложений.
• Поддержка: дождитесь, пока элемент станет видимым/кликабельным на панели записи.
• Улучшенное оформление, форматирование и фильтрация консоли.
• Расширение для отладки Chrome с файлами карты исходного кода
• Улучшена структура папок с исходными файлами на панели «Источники».
• Отображение исходных файлов рабочих процессов на панели «Источники».
• Обновления автоматической темной темы Chrome
• Удобная сенсорная панель выбора цвета и разделенное окно
• Различные важные моменты

Хром 98

• Функция предварительного просмотра: Полностраничное дерево доступности
• Более точные изменения доступны на вкладке «Изменения».
• Установите более длительный тайм-аут для записи пользовательского потока.
• Убедитесь, что ваши страницы кэшируются, используя вкладку «Кэширование» (Назад/Вперед)
• Новый фильтр панели свойств
• Имитация функции принудительного выбора цветов в CSS для работы с медиафайлами.
• Отображать линейки при наведении курсора
• Поддерживается row-reverse и column-reverse в редакторе Flexbox.
• Новые сочетания клавиш для воспроизведения XHR-запросов и развертывания всех результатов поиска.
• Маяк № 9 на панели «Маяк»
• Улучшенная панель «Источники»
• Различные важные моменты
• [Экспериментальные] Конечные точки на панели API отчетов

Хром 97

• Предварительный просмотр функции: Новая панель записи
• Обновите список устройств в режиме устройства.
• Автозаполнение с возможностью редактирования в формате HTML
• Улучшена отладка кода.
• Синхронизация настроек инструментов разработчика между устройствами.

Хром 96

• Функция предварительного просмотра: новая панель обзора CSS.
• Восстановлен и улучшен интерфейс редактирования длины CSS и копирования текста.
• Имитация функции CSS prefers-contrast для работы с медиафайлами
• Имитация функции автоматической темной темы Chrome
• Скопируйте объявления как JavaScript в панели «Стили».
• В панели «Сеть» появилась новая вкладка «Полезная нагрузка».
• Улучшено отображение свойств в панели «Свойства».
• Возможность скрыть ошибки CORS в консоли.
• Предварительный просмотр и оценка Intl объектов в консоли.
• Согласованные трассировки стека асинхронных операций
• Сохраните боковую панель «Консоль».
• Устаревшая панель кэширования приложений в панели приложений.
• [Экспериментальная версия] Новая панель API для создания отчетов в панели приложения.

Хром 95

• Новые инструменты для создания CSS-стилей с указанием длины
• Скрыть проблемы на вкладке «Проблемы»
• Улучшено отображение свойств.
• Маяк 8.4 на панели «Маяк»
• Сортируйте фрагменты текста на панели «Источники».
• Новые ссылки на переведённые примечания к выпуску и форму сообщения об ошибке перевода.
• Улучшен пользовательский интерфейс меню командных инструментов разработчика.

Хром 94

• Используйте инструменты разработчика на предпочитаемом вами языке.
• Новые устройства Nest Hub в списке устройств
• Исходные испытания отображаются в подробном представлении Frame.
• Новый значок запроса контейнера CSS
• Новый флажок для инвертирования сетевых фильтров.
• В ближайшее время боковая панель консоли будет упразднена.
• Отображение необработанных заголовков Set-Cookies на вкладке «Проблемы» и панели «Сеть».
• Последовательное отображение собственных методов доступа в качестве отдельных свойств в консоли.
• Корректные трассировки стека ошибок для встроенных скриптов с использованием #sourceURL
• Измените формат цвета в панели «Вычисления».
• Замените пользовательские всплывающие подсказки на стандартные HTML-подсказки.
• [Экспериментальная функция] Скрытие проблем на вкладке «Проблемы»

Хром 93

• Редактируемые CSS-контейнерные запросы в панели «Стили».
• Предварительный просмотр веб-пакета на панели «Сеть».
• Отладка API для составления отчетов об атрибуции
• Улучшена обработка строк в консоли.
• Улучшена отладка CORS.
• Маяк 8.1
• Новый URL-адрес заметки в панели «Манифест».
• Исправлены селекторы соответствия CSS.
• Форматирование JSON-ответов на панели «Сеть»

Хром 92

• редактор CSS-сеток
• Поддержка повторного объявления const в консоли
• Просмотрщик порядка источников
• Новый ярлык для просмотра подробностей кадра.
• Расширенная поддержка отладки CORS
• Переименуйте метку XHR в Fetch/XHR.
• Отфильтруйте типы ресурсов Wasm на панели «Сеть».
• Подсказки клиента User-Agent для устройств на вкладке «Состояние сети»
• Сообщайте о проблемах в режиме "Особенности" на вкладке "Проблемы".
• Включите вычислительные пересечения на панели «Производительность».
• Маяк 7.5 на панели «Маяк»
• Устаревшее контекстное меню «Перезапуск кадра» в стеке вызовов.
• [Экспериментальный] Монитор протокола
• [Экспериментальный] диктофон для кукловодов

Хром 91

• Всплывающая информация Web Vitals
• Новый инспектор памяти
• Визуализация CSS-эффекта привязки к прокрутке
• Новая панель настроек значка
• Улучшенный предварительный просмотр изображения с информацией о соотношении сторон.
• Новая кнопка «Состояние сети» с параметрами для настройки Content-Encoding .
• ярлык для просмотра вычисленного значения
• ключевое слово accent-color
• Классифицируйте типы проблем с помощью цветов и значков.
• Удалить токены доверия
• Заблокированные функции в окне сведений о фрейме
• Фильтрация экспериментов в настройках «Эксперименты»
• В панели «Хранилище кэша» появился новый столбец Vary Header
• Поддержка проверки частной торговой марки на JavaScript
• Расширенная поддержка отладки с использованием точек останова.
• Поддержка предварительного просмотра при наведении курсора с использованием квадратных скобок []
• Улучшена структура HTML-файлов.
• Корректные трассировки стека ошибок для отладки Wasm.

Хром 90

• Новые инструменты отладки CSS flexbox
• Новое наложение основных веб-функций
• Переместил счетчик проблем в строку состояния консоли.
• Сообщить о проблемах с доступом к доверенным веб-ресурсам
• Форматирование строк как (допустимых) строковых литералов JavaScript в консоли.
• В панели приложений появилась новая панель «Доверенные токены».
• Имитация функции CSS color-gamut media
• Улучшенные инструменты для прогрессивных веб-приложений
• В панели «Сеть» появился новый столбец Remote Address Space .
• Улучшения производительности
• Отображение разрешенных/запрещенных функций в окне сведений о раме.
• В панели «Cookies» появился новый столбец SameParty .
• Устаревшая нестандартная поддержка fn.displayName
• Отключена функция « Don't show Chrome Data Saver warning в меню настроек.
• [Экспериментальная функция] Автоматическое создание отчетов о проблемах с низким контрастом на вкладке «Проблемы».
• [Экспериментальная версия] Полное отображение дерева доступности на панели «Элементы»

Хром 89

• Поддержка отладки нарушений, связанных с доверенными типами.
• Сделать снимок экрана узла за пределами области просмотра.
• Новая вкладка «Доверенные токены» для сетевых запросов.
• Маяк №7 на панели «Маяк»
• Поддержка принудительного использования состояния CSS :target
• Новый ярлык для дублирования элемента
• Палитры цветов для пользовательских свойств CSS
• Новые сочетания клавиш для копирования свойств CSS.
• Новая опция для отображения файлов cookie, декодированных из URL-адреса.
• Удалять только видимые файлы cookie
• В разделе «Хранилище» появилась новая опция для удаления сторонних файлов cookie.
• Редактировать подсказки клиента User-Agent для пользовательских устройств
• Сохранить настройку "записывать сетевой журнал".
• Просмотр подключений WebTransport осуществляется на панели «Сеть».
• Терминал «Онлайн» переименован в «Без ограничения скорости».
• Новые параметры копирования в консоли, панели «Источники» и панели «Стили».
• Информация о новых работниках сферы услуг в подробном представлении структуры.
• Информация об объеме памяти отображается в окне сведений о кадре.
• Оставьте свой отзыв во вкладке "Проблемы".
• В панели «Производительность» наблюдается выпадение кадров.
• Эмуляция складных устройств и двухэкранных режимов в режиме устройства.
• [Экспериментальная версия] Автоматизация тестирования браузера с помощью Puppeteer Recorder
• [Экспериментальная] Редактор шрифтов в панели «Стили»
• [Экспериментальные] Инструменты отладки CSS flexbox
• [Экспериментальная] Новая вкладка «Нарушения CSP»
• [Экспериментальная версия] Новый алгоритм расчета цветового контраста — Усовершенствованный алгоритм перцептивного контраста (APCA)

Хром 88

• Быстрый старт с использованием DevTools
• Новые инструменты визуализации углов CSS
• Эмуляция неподдерживаемых типов изображений
• Имитируйте размер квоты хранения на панели «Хранилище».
• В панели «Производительность» появилась новая полоса «Web Vitals».
• Сообщайте об ошибках CORS в панели «Сеть».
• Информация о междоменной изоляции в представлении сведений о кадре.
• Информация о новых веб-воркерах отображается в подробном представлении фрейма.
• Отображение сведений о рамке открывающегося окна.
• Откройте панель «Сеть» из панели «Сервисные работники».
• Скопировать значение свойства
• Скопировать трассировку стека для сетевого инициатора
• Предварительный просмотр значения переменной Wasm при наведении курсора мыши
• Оцените переменную Wasm в консоли.
• Единые единицы измерения для размеров файлов/памяти
• Выделите псевдоэлементы на панели «Элементы».
• [Экспериментальные] инструменты отладки CSS Flexbox
• [Экспериментальная версия] Настройка сочетаний клавиш для аккордов

Хром 87

• Новые инструменты отладки CSS Grid
• Новая вкладка WebAuthn
• Перемещайте инструменты между верхней и нижней панелями.
• В панели «Стили» появилась новая боковая панель «Вычисляемые элементы».
• Группировка свойств CSS на панели «Вычисляемые»
• Маяк 6.3 на панели «Маяк»
• События performance.mark() в разделе Timings
• В панели «Сеть» появились новые фильтры resource-type и url .
• Обновления отображения подробной информации о кадре
• Прекращение поддержки Settings в меню «Дополнительные инструменты».
• [Экспериментальная функция] Просмотр и исправление проблем с цветовым контрастом на панели «Обзор CSS».
• [Экспериментальная функция] Настройка сочетаний клавиш в инструментах разработчика

Хром 86

• Панельная дискуссия по новым медиа
• Создавайте снимки экрана узлов с помощью контекстного меню панели «Элементы».
• Обновления вкладки «Проблемы»
• Имитация отсутствующих локальных шрифтов
• Имитация неактивных пользователей
• Emulate prefers-reduced-data
• Поддержка новых функций JavaScript
• Маяк 6.2 на панели «Маяк»
• Удалена возможность отображения раздела «другие источники происхождения» в панели «Работники сферы услуг».
• Показать сводку покрытия для отфильтрованных элементов
• Новый режим просмотра сведений о фрейме в панели приложений.
• Доступные варианты цветовых решений в панели «Стили».
• Восстановить свойства (панель «Элементы»)
• Удобочитаемые значения заголовка X-Client-Data на панели «Сеть».
• Автозаполнение пользовательских шрифтов в панели «Стили».
• Единообразное отображение типа ресурса на панели «Сеть»
• Кнопки очистки на панелях «Элементы» и «Сеть»

Хром 85

• Редактирование стилей для CSS-in-JS фреймворков
• Маяк №6 на панели «Маяк»
• Первая значимая амортизация краски (FMP)
• Поддержка новых функций JavaScript
• В панели «Манифест» появились предупреждения о новых ярлыках приложений.
• События Service Worker respondWith отображаются на вкладке «Время».
• Единообразное отображение панели «Вычисления»
• Смещения байт-кода для файлов WebAssembly
• Построчное копирование и вырезание в панели «Источники».
• Обновления настроек консоли
• Обновления панели производительности
• Новые значки для точек останова, условных точек останова и точек логирования.

Хром 84

• Исправляйте ошибки на сайте с помощью новой вкладки «Проблемы».
• Информация о доступности отображается во всплывающей подсказке в режиме «Проверить элемент».
• Обновления панели производительности
• Более точная терминология обещаний в консоли.
• Обновления панели стилей
• Прекращение поддержки панели «Свойства» в панели «Элементы».
• Поддержка ярлыков приложений в панели «Манифест».

Хром 83

• Имитация нарушений зрения
• Имитация локаций
• Отладка политики встраивания из разных источников (COEP)
• Новые значки для точек останова, условных точек останова и точек логирования.
• Просмотрите сетевые запросы, которые устанавливают определенный cookie-файл.
• Прикрепите панель слева из командного меню.
• Пункт «Настройки» в главном меню перемещен.
• Комитет по аудиту теперь называется «Комитет маяка».
• Удалите все локальные переопределения в папке.
• Обновлен пользовательский интерфейс для длительных задач.
• Поддержка маскируемых значков в панели «Манифест».

Хром 82

Выпуск Chrome 82 был отменен .

Хром 81

• Поддержка Moto G4 в режиме устройства
• Обновления, касающиеся файлов cookie.
• Более точные значки манифеста веб-приложения
• Наведите курсор на свойства content CSS, чтобы увидеть значения без экранирования.
• Ошибки карты исходного кода в консоли
• Настройка для отключения прокрутки за конец файла.

Хром 80

• Поддержка повторного объявления операторов let и class в консоли.
• Улучшена отладка WebAssembly.
• Запросите цепочки инициаторов на вкладке «Инициатор».
• Выделите выбранный сетевой запрос в разделе «Обзор».
• Столбцы URL и пути на панели «Сеть»
• Обновлены строки User-Agent.
• Новый пользовательский интерфейс настройки панели аудита.
• Режимы покрытия кода для каждой функции или для каждого блока
• Теперь анализ покрытия кода должен запускаться при перезагрузке страницы.

Хром 79

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

Хром 78

• Поддержка нескольких клиентов в панели аудита.
• Отладка обработчика платежей
• Lighthouse 5.2 в панели «Аудиты»
• Самый большой и информативный элемент оформления в панели «Производительность».
• Сообщайте о проблемах в инструментах разработчика из главного меню.

Хром 77

• Скопировать стили элемента
• Визуализация изменений компоновки
• Lighthouse 5.1 в панели «Аудиты»
• синхронизация тем ОС
• Сочетание клавиш для открытия редактора точек останова
• Предварительная загрузка кэша в панели «Сеть»
• Частная собственность при осмотре объектов
• Уведомления и push-уведомления в панели приложения.

Хром 76

• Автозаполнение с использованием значений CSS
• Новый пользовательский интерфейс для сетевых настроек.
• Сообщения WebSocket в экспорте HAR
• Кнопки импорта и экспорта HAR
• Использование памяти в реальном времени
• номера портов регистрации работников сферы услуг
• Просмотрите события фоновой выборки и фоновой синхронизации.
• Puppeteer для Firefox

Хром 75

• Полезные предустановки при автозаполнении функций CSS
• Очистка данных сайта через меню команд.
• Просмотреть все базы данных IndexedDB
• При наведении курсора мыши отображается несжатый размер ресурса.
• Встроенные точки останова в панели «Точки останова»
• Количество ресурсов IndexedDB и Cache
• Настройка для отключения подробной всплывающей подсказки «Проверить».
• Настройка для переключения отступов табуляции в редакторе

Хром 74

• Выделите все узлы, затронутые свойством CSS.
• Lighthouse v4 в панели «Аудиты»
• средство просмотра двоичных сообщений WebSocket
• Снимок области захвата экрана в меню команд.
• Фильтры Service Worker на панели «Сеть».
• Обновления панели производительности
• Длительные задания в записи панельных дискуссий о производительности
• Первая покраска в разделе «Время»
• Дополнительный совет: Быстрый способ просмотра цветовых кодов RGB и HSL (видео)

Хром 73

• Точки логарифма
• Подробные всплывающие подсказки в режиме просмотра.
• Экспорт данных о покрытии кода
• Управляйте консолью с помощью клавиатуры.
• Линия коэффициента контрастности AAA в палитре цветов
• Сохранение пользовательских настроек геолокации
• сворачивание кода
• Вкладка «Фреймы» переименована во вкладку «Сообщения».
• Дополнительный совет: Фильтрация по объектам недвижимости в сетевой панели (видео)

Хром 72

• Визуализируйте показатели производительности на панели «Производительность».
• Выделение текстовых узлов в DOM-дереве
• Скопируйте путь к файлу JavaScript в узел DOM.
• Обновления панели аудита , включая новый аудит, который обнаруживает библиотеки JavaScript, и новые ключевые слова для доступа к панели аудита из командного меню.
• Дополнительный совет: используйте режим устройства для проверки медиазапросов (видео).

Хром 71

• Наведите курсор на результат выполнения выражения в реальном времени , чтобы выделить узел DOM.
• Сохраняйте узлы DOM в качестве глобальных переменных.
• Информация об инициаторе и приоритете теперь доступна в импорте и экспорте HAR.
• Доступ к меню команд осуществляется из главного меню.
• Точки переключения «Картинка в картинке»
• Дополнительный совет: используйте monitorEvents() для записи событий, срабатывающих на узле, в консоль (видео).

Хром 70

• Выражения в реальном времени в консоли
• Выделение узлов DOM во время предварительной оценки
• Оптимизация производительности панели
• Более надежная отладка
• Включите ограничение скорости сети через командное меню.
• Условные точки останова автозаполнения
• Прерывание обработки событий AudioContext
• Отладка приложений Node.js с помощью ndb
• Дополнительный совет: измеряйте реальное взаимодействие пользователей с помощью API User Timing.

Хром 68

• Нетерпеливая оценка
• Подсказки для аргументации
• Автозавершение функций
• ключевые слова ES2017
• Lighthouse 3.0 в панели «Аудиты»
• Поддержка BigInt
• Добавление путей к свойствам в панель «Отслеживание».
• Функция «Показывать временные метки» перемещена в «Настройки».
• Дополнительный совет: Малоизвестные методы работы с консолью (видео)

Хром 67

• Поиск по всем заголовкам сети
• Предварительный просмотр значений переменных CSS
• Скопировать как получить
• Новые функции аудита, параметры конфигурации рабочего стола и просмотр трассировок.
• Остановить бесконечные циклы
• Время, затраченное пользователем, отображается на вкладке «Производительность».
• Экземпляры виртуальных машин JavaScript четко отображаются на панели «Память».
• Вкладка «Сеть» переименована во вкладку «Страница».
• Обновления темной темы
• Информация о прозрачности сертификатов в панели «Безопасность».
• Функции изоляции сайта на панели «Производительность»
• Дополнительный совет: Панель слоев + Инспектор анимации (видео)

Хром 66

• «Черный ящик» в панели «Сеть»
• Автоматическая настройка масштабирования в режиме устройства.
• Красивое форматирование текста на вкладках «Предварительный просмотр» и «Ответ».
• Предварительный просмотр HTML-контента на вкладке «Предварительный просмотр».
• Поддержка локальных переопределений стилей внутри HTML.
• Дополнительный совет: скрипты фреймворка Blackbox для повышения эффективности точек останова в обработчиках событий.

Хром 65

• Локальные переопределения
• Новые инструменты обеспечения доступности
• Вкладка «Изменения»
• Новые SEO-аудиты и аудиты производительности.
• Несколько записей на панели «Исполнение».
• Надежное пошаговое выполнение кода с помощью воркеров в асинхронном коде
• Дополнительный совет: Автоматизируйте действия в инструментах разработчика с помощью Puppeteer (видео)

Chrome 64

• Монитор производительности
• Боковая панель консоли
• Сгруппировать похожие сообщения в консоли
• Дополнительный совет: используйте псевдокласс при наведении курсора (видео)

Хром 63

• Поддержка удаленной отладки для нескольких клиентов
• Рабочие пространства 2.0
• 4 новых аудита
• Имитация push-уведомлений с использованием пользовательских данных
• Запускайте фоновые события синхронизации с помощью пользовательских тегов.
• Дополнительный совет: Точки останова обработчика событий (видео)

Хром 62

• В консоли вас ждут первоклассные возможности.
• Новые рабочие процессы создания скриншотов
• Подсветка CSS Grid
• Новый консольный API для запроса объектов.
• Новые консольные фильтры
• Импорт HAR в панели «Сеть»
• Предварительный просмотр ресурсов кэша
• Более предсказуемая отладка кэша
• Покрытие кода на уровне блоков

Хром 61

• имитация регулирования скорости мобильного устройства
• Просмотр использования хранилища
• Просмотр времени кэширования ответов сервис-воркером.
• Включите индикатор FPS в командном меню.
• Настройте поведение колесика мыши на масштабирование или прокрутку.
• Поддержка отладки модулей ES6

Хром 60

• Новая аудиторская комиссия
• Значки сторонних производителей
• Новый жест для функции «Продолжить»
• Переходите на асинхронный режим.
• Более информативный предварительный просмотр объектов в консоли.
• Более информативный выбор контекста в консоли
• Обновления в режиме реального времени на вкладке «Покрытие».
• Более простые варианты регулирования скорости сети
• Асинхронные стеки включены по умолчанию

Хром 59

• Анализ покрытия кода CSS и JS
• Скриншоты на всю страницу
• Блокировка запросов
• Перейдите через asyncwait
• Единое командное меню