CPU throttling

CPU throttling — это механизм ограничения вычислительной мощности процессора для симуляции работы веб-страниц на устройствах с меньшей производительностью. В контексте Lighthouse он применяется для того, чтобы получить реалистичную оценку производительности сайта, приближенную к пользовательскому опыту на средних или слабых устройствах.

Принцип работы CPU throttling

Lighthouse использует эмуляцию замедления процессора для имитации работы сайта на устройствах с низкой производительностью. На практике это достигается следующим образом:

  1. Установка коэффициента замедления — процессорные задачи задерживаются на определённый процент, обычно это значение по умолчанию равно 4x, что соответствует устройству среднего класса.
  2. Перехват событий выполнения — Lighthouse вставляет промежуточные задержки между выполнением JavaScript-кода, что позволяет наблюдать эффект ограниченной CPU мощности.
  3. Сбор метрик производительности — такие показатели, как First Contentful Paint (FCP), Time to Interactive (TTI), Total Blocking Time (TBT), измеряются в условиях замедленной работы процессора, что обеспечивает более реалистичное представление о времени загрузки страницы на слабых устройствах.

Настройка CPU throttling

В Lighthouse можно управлять параметрами throttling через конфигурацию:

const lighthouseConfig = {
  extends: 'lighthouse:default',
  settings: {
    throttlingMethod: 'simulate', // 'devtools' или 'simulate'
    throttling: {
      rttMs: 150, // задержка сети
      throughputKbps: 1638.4, // скорость сети
      cpuSlowdownMultiplier: 4 // коэффициент замедления CPU
    }
  }
};

Ключевые параметры:

  • throttlingMethod: метод замедления, может быть:

    • simulate — эмуляция через Lighthouse;
    • devtools — замедление через DevTools Protocol.

  • cpuSlowdownMultiplier: множитель замедления CPU. Значение 4x соответствует типичному среднему смартфону, 6x — слабому устройству.

  • rttMs и throughputKbps задают сетевые условия, но CPU throttling работает независимо от них.

Отличие simulate от devtools

  • simulate: Lighthouse рассчитывает метрики на основе замедленной модели выполнения JS, но не изменяет фактический процессор. Позволяет собирать Time to Interactive и Total Blocking Time более точно, так как учитывает виртуальное замедление.
  • devtools: реальное замедление CPU в браузере через Chrome DevTools Protocol. Более точное поведение для узкоспециализированных тестов, но может быть менее воспроизводимо на разных системах.

Влияние CPU throttling на метрики

  1. First Contentful Paint (FCP) Замедление CPU увеличивает время рендеринга первого видимого контента, так как основной поток блокируется JavaScript-операциями. FCP отражает скорость восприятия пользователем первых визуальных элементов страницы.

  2. Time to Interactive (TTI) TTI существенно увеличивается при throttling, особенно если сайт выполняет много JavaScript-вычислений при загрузке. Симулируется ситуация, когда пользовательский ввод задерживается из-за перегруженного основного потока.

  3. Total Blocking Time (TBT) TBT показывает общее время, когда основной поток был занят задачами продолжительностью более 50 мс. CPU throttling увеличивает TBT пропорционально коэффициенту замедления.

Практические рекомендации

  • Для реальных тестов производительности рекомендуется использовать simulate, так как она позволяет получить стабильные и воспроизводимые метрики.
  • Значение cpuSlowdownMultiplier должно соответствовать целевой аудитории: 4x для среднего смартфона, 6x для слабого.
  • Комбинировать CPU throttling с сетевыми условиями (например, 3G или 4G) для имитации реальных пользовательских сценариев.
  • Внимательно следить за TTI и TBT, так как они критически зависят от замедления CPU.

Заключение по использованию

CPU throttling в Lighthouse позволяет оценивать пользовательский опыт на слабых устройствах и выявлять узкие места в JavaScript-коде и рендеринге. Без эмуляции замедленного процессора многие современные сайты могут показывать завышенные показатели скорости, что вводит в заблуждение разработчиков. Правильная настройка throttling обеспечивает точные и полезные данные для оптимизации производительности.

Оглавление