Анализируйте производительность во время выполнения

Кейс Баскс
Kayce Basques

Производительность во время выполнения — это то, как ваша страница работает, а не загружается. В этом руководстве вы узнаете, как использовать панель производительности Chrome DevTools для анализа производительности во время выполнения. С точки зрения модели RAIL навыки, которые вы получите в этом руководстве, будут полезны для анализа фаз ответа, анимации и простоя вашей страницы.

Начать

В этом уроке мы будем использовать Performance Panel, чтобы найти узкое место на живой странице. Начать:

  1. Откройте Google Chrome в режиме инкогнито . Режим инкогнито гарантирует, что Chrome работает в чистом состоянии. Например, если у вас установлено много расширений, эти расширения могут создавать помехи в ваших измерениях производительности.
  2. Загрузите следующую страницу в окне Incognito. Это демонстрация, которую вы собираетесь профилировать. На странице показана куча маленьких синих квадратов, движущихся вверх и вниз.

    https://googlechrome.github.io/devtools-samples/jank/

  3. Нажмите команду + опция + I (Mac) или Control + Shift + I (Windows, Linux), чтобы открыть DevTools.