Консоль-помощник

Chrome 68 поставляется с новыми функциями Консоли, связанными с автозавершением кода и предпросмотром результата его выполнения.

Упреждающее исполнение

Когда вы пишете определённое выражение в Консоли, с данного момента она может показать вам результат выполнения этого выражения под вашим курсором:

Изображение 1. Консоль отображает результат операции sort() перед тем как она будет явно выполнена.

Для того чтобы активировать упреждающее исполнение:

1. Откройте Консоль
2. Откройте её настройки (Console Settings)
3. Поставьте галочку на параметре Eager evaluation

Инструменты разработчика не выполняют те выражения, которые могут привести к побочным эффектам.

Подсказки аргументов

Как только вы написали функцию, Консоль покажет вам аргументы, которые она ожидает получить.

Изображение 2. Различные примеры подсказок аргументов в Консоли.

Примечания:

• Значок вопроса перед аргументом, такой как ?options, указывает на опциональный аргумент.
• Многоточие перед аргументом, такое как ...items, указывает на оператор расширения.
• Некоторые функции, такие как CSS.supports(), принимают множество сигнатур аргументов.

Автозавершение после выполнения функции

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

После активации Упреждающего Исполнения, Консоль также станет показывать вам, какие свойства и функции доступны после того как вы напишете функцию.

Изображение 3. Первый скриншот показывает старое поведение, а второй демонстрирует новое, которое поддерживает автозавершение.

Ключевые слова из ES2017 в Консоли

Такие ключевые слова как await отныне доступни в Консоли в интерфейсе автодополнения.

Изображение 4. Консоль отныне предлагает await в своём интерфейсе автодополнения.

Быстрые, более надёжные аудиты, новый интерфейс и новые типы аудитов

Chrome 68 поставляется с Lighthouse 3.0. Следующие секции разъясняют некоторые из самых больших изменений. Смотрите также отдельную статью, анонсирующую Lighthouse 3.0 для полной истории.

Быстрые и более надёжные аудиты

Lighthouse 3.0 имеет новый внутренний движок аудита, который называется Lantern, который завершает ваши аудиты быстрее и с меньшими погрешностями между запусками.

Новый интерфейс

Lighthouse 3.0 также приносит новый пользовательский интерфейс, спасибо совместной работе между командами Lighthouse и Chrome UX (Разработка и Дизайн).

Изображение 5. Новый интерфейс отчёта в Lighthouse 3.0.

Новые типы аудитов

Lighthouse 3.0 также предоставляет вам 4 новых типа аудитов:

• Первая отрисовка контента
• robots.txt невалиден
• Используйте видео форматы для анимированного контента
• Избегайте многократных и дорогостоящих запросов к веб-ресурсам

Поддержка BigInt

Примечание: это не совсем новая возможность Инструментов Разработчика, это новая возможность языка JavaScript, которую вы можете опробовать в Консоли.

Chrome 68 поддерживает новый целочисленный примитив, называемый BigInt. BigInt позволяет вам представлять числа произвольной точности. Опробуйте эту возможность в Консоли:

Изображение 6. пример использования BigInt в Консоли.

Добавляем пути к свойству в панели наблюдения

Когда мы остановили выполнение кода на точке остановки, нажмите правой кнопкой мыши на свойстве в панели целей и выберите пункт Add property path to watch, чтобы добавить свойство на панель наблюдения.

Изображение 7. Пример добавления пути к списку наблюдения.

Опция "Показать метки времени" переместилась в раздел настроек

Теперь опция Show timestamps, которая ранее находилась в настройках консоли, переместилась в настройки инструментов разработчика.