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

Маттиас Ромер

Предложения по коду от Gemini

Теперь вы можете получать подсказки опережающего ввода, созданные искусственным интеллектом, на панелях «Консоль» и «Источники» .

Функция предложения кода на панелях «Консоль» и «Источники»

Чтобы включить эту функцию, перейдите в раздел «Настройки» > «Инновации ИИ» и включите функцию «Предложения кода» .

Улучшения для сервера DevTools MCP

С момента запуска публичной предварительной версии сервера DevTools MCP версии 0.2.1 мы добились различных улучшений при участии сообщества и выпустили версию 0.9.0.

  • Поддержка Node.js расширена до Node.js 20.
  • Сетевые запросы и сообщения консоли можно разбивать на страницы для сохранения токенов и фильтровать по типу запроса (например, скрипты, таблицы стилей, изображения) и типу сообщения (журнал, предупреждение, ошибка).
  • Скриншоты можно выводить по определенному пути и в различных форматах.
  • Настраиваемые категории инструментов позволяют вам организовать предоставляемые возможности, устраняя ненужный шум.
  • Теперь вы можете передавать аргументы запуска экземпляру Chrome, используемому сервером MCP.

Полный список изменений и исправлений ошибок смотрите в публичном журнале изменений на GitHub , а дополнительную информацию о сервере DevTools MCP можно узнать в сообщении в блоге с анонсом .

Более быстрый доступ к помощи ИИ

В DevTools теперь больше ссылок для вызова помощи с ИИ . Пункт контекстного меню «Спросить ИИ» переименован в «Отладка с ИИ» и дополнен непосредственными действиями, которые ИИ может выполнить в зависимости от контекста.

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

Новые точки входа для поддержки ИИ в DevTools

Отладка полной трассировки производительности с помощью Gemini

После записи трассировки на панели «Производительность» вы можете обсудить полную трассировку, связанную с ней аналитику производительности и полевые данные с Gemini, не выбирая заранее конкретный контекст, — всё в рамках одного разговора. Это позволяет вам более комплексно рассматривать проблемы производительности, прежде чем углубляться в их изучение.

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

Аналогично, все аналитические данные в разделе «Производительность» > «Аналитика» теперь доступны для обсуждения с Gemini.

Изменить ориентацию ящика

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

Добавьте дополнительные панели в ящик из ⋮ > Дополнительные инструменты.

Новый переключатель в панели для изменения ориентации

Программа разработчиков Google

Программа разработчиков Google теперь интегрирована в DevTools с прямыми ссылками для управления профилями и новыми значками для получения.

Элементы управления профилем разработчика Google в настройках DevTools

Значки — это функция, которую можно включить по желанию. Чтобы включить значки, перейдите в раздел «Настройки» > «Настройки» > «Учётная запись» и включите опцию «Зарабатывать значки».

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

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

  • Панель приложений теперь поддерживает проверку хранилища для всех типов работников, включая работников служб, общих работников и выделенных работников.
  • :target-current теперь отображается на панели «Стили» .
  • Панель «Сеть» теперь может фильтровать запросы на основе нового логического значения Is ad-related .

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

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

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

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

Что нового в DevTools

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