Critical CSS

Генерация CSS для видимой области экрана с помощью реального браузера и доставка через Managed CDN.

7 мин чтения

Critical CSS — это подмножество CSS, необходимое для быстрого рендеринга видимой без прокрутки области. Cache Rocket генерирует его в облаке с помощью прохода покрытия реального headless-браузера, загружает компактный critical.css на Managed CDN, а плагин WordPress внедряет его для посетителей.

Требование тарифа

Critical CSS доступен на тарифах Pro и Business с месячной квотой страниц. Проверьте право в разделе Аккаунт → Подписка.

Включение функции

  1. 1

    Подключите API-ключи

    Вставьте публичный и секретный ключи на экране Account плагина. См. API-ключи.

  2. 2

    Проверьте свой тариф

    Critical CSS должен быть включён в тариф, с остатком месячной квоты страниц.

  3. 3

    Включите Generate Critical CSS

    В разделе Media включите генерацию Critical CSS.

  4. 4

    Сгенерируйте для важных страниц

    Запустите генерацию для ключевых шаблонов или URL в рамках месячного лимита.

Право Unused CSS

На более высоких тарифах может отображаться право Unused CSS. Этот флаг резервирует возможность в биллинге; генерация Critical CSS — это действующий облачный CSS-процесс, описанный здесь. Не ожидайте отдельного обработчика Unused CSS, пока он не появится как отдельный элемент управления Media.

Частые вопросы

Почему используется реальный браузер?
Покрытие с живой загрузки страницы отслеживает, какой CSS реально используется в верхней области для этого URL, что остаётся точным при изменении тем.
Откуда посетители загружают critical.css?
С Managed CDN (assets.cacherocket.com), внедряется плагином.
Что происходит при исчерпании квоты?
Новые задачи генерации страниц Critical CSS приостанавливаются до сброса месячной квоты или повышения тарифа.