Статистика вызовов времени выполнения
Панель производительности DevTools предоставляет информацию о производительности выполнения вашего веб-приложения, визуализируя различные внутренние метрики Chrome. Однако некоторые низкоуровневые метрики V8 в настоящее время не отображаются в DevTools. Эта статья объясняет наиболее надежный способ получения подробных внутренних метрик V8, известных как Статистика вызовов времени выполнения или RCS, через chrome://tracing
.
Трассировка записывает поведение всего браузера, включая другие вкладки, окна и расширения, поэтому она работает лучше всего при выполнении в чистом профиле пользователя, с отключенными расширениями и без открытых вкладок браузера:
# Запустите новую сессию браузера Chrome с чистым профилем пользователя и отключенными расширениями
google-chrome --user-data-dir="$(mktemp -d)" --disable-extensions
Введите URL страницы, которую вы хотите измерить, в первую вкладку, но пока не загружайте страницу.
Добавьте вторую вкладку и откройте chrome://tracing
. Совет: можно просто ввести chrome:tracing
без слэшей.
Нажмите кнопку «Записать», чтобы подготовиться к записи трассировки. Сначала выберите «Веб-разработчик», затем выберите «Редактировать категории».
Выберите v8.runtime_stats
из списка. В зависимости от того, насколько детализировано ваше исследование, вы можете выбрать и другие категории.
Нажмите «Записать» и переключитесь обратно на первую вкладку, затем загрузите страницу. Самый быстрый способ — использовать Ctrl/⌘+1, чтобы напрямую перейти к первой вкладке, а затем нажать Enter, чтобы подтвердить введенный URL.
Дождитесь завершения загрузки страницы или заполнения буфера, затем «Остановите» запись.
Найдите раздел «Рендерер», который содержит название веб-страницы из записанной вкладки. Самый простой способ сделать это — нажать «Процессы», затем нажать «Нет», чтобы снять отметку со всех записей, и затем выбрать только интересующий вас рендерер.
Выберите события трассировки/срезы, нажав Shift и перетащив. Убедитесь, что вы покрыли все разделы, включая CrRendererMain
и любые ThreadPoolForegroundWorker
. Внизу появится таблица с выбранными срезами.
Прокрутите таблицу до верхнего правого угла и нажмите на ссылку рядом с «Таблицей статистики вызовов времени выполнения».
В появившемся представлении прокрутите вниз, чтобы увидеть подробную таблицу, где V8 тратит свое время.
Раскрывая категорию, вы можете углубиться в данные.
Интерфейс командной строки
Запустите d8
с параметром --runtime-call-stats
, чтобы получить метрики RCS из командной строки:
d8 --runtime-call-stats foo.js