Speed advisor: що ввімкнути для швидшого сайту

Радник зі швидкості читає вашу головну сторінку (і останній імпортований звіт Lighthouse) і перелічує, що ввімкнути в Baza Helper, а що може виправити лише тема. Це картка вгорі діагностики продуктивності в Baza Helper > Кеш та оптимізація.

Запуск

1. Відкрийте Baza Helper > Кеш та оптимізація і знайдіть картку Радник зі швидкості.
2. Натисніть Проаналізувати сайт. Плагін запитує вашу головну сторінку з того самого сайту, а також використовує останній звіт Lighthouse, якщо ви його імпортували.
3. Прочитайте поради. Кожен пункт має коротке пояснення. Порада, яку вже ввімкнено, не пропонується знову.
4. Позначте, що хочете, і натисніть Увімкнути вибране. Перемикачі вмикаються разом, кеш сторінок очищається й починається прогрів.
5. Відкрийте сайт і перевірте його, особливо форми, меню та слайдери.

Пораду, яку плагін може застосувати, має перемикач, а кнопка застосовує обрані одразу. Порада, яку плагін застосувати не може, це простий текст із міткою Зробіть самі і без перемикача.

Якщо все рекомендоване вже ввімкнено, картка пише «Нічого вмикати: рекомендовані перемикачі вже ввімкнено». Якщо головна сторінка не відповідає кодом HTTP 200, порадник повідомляє про це й не дає порад.

Що він може порадити

• Кеш сторінок зі статичною віддачею: сторінка будується заново для кожного відвідувача, і це час до першого байта. Збережена копія відповідає одразу.
• Довший час життя кешу (6 годин): копія, що живе п’ять хвилин, часто зникає до приходу відвідувача чи тесту швидкості. Кеш і так очищається, коли змінюється вміст.
• Об’єднати локальні стилі в один файл, коли сторінку блокують понад шість таблиць стилів: один файл це один запит замість багатьох.
• Шрифти: показувати текст одразу (font-display swap) і завантажувати основні шрифти заздалегідь (автоматичне попереднє завантаження).
• Відкласти скрипти Elementor та його додатків.
• Відкласти всі скрипти, включно з jQuery і темою: плагін відкладає їх у безпечному порядку й тримає jQuery першим, коли сторінка виконує вбудований код, якому він потрібен.
• Захистити та передзавантажити найбільшу картинку: найбільше зображення першого екрана знаходиться й завантажується першим і ніколи не відкладається.
• Відкласти завантаження картинок нижче першого екрана, коли на сторінці понад вісім зображень.
• Прибрати стилі, які головна сторінка не використовує: коли звіт Lighthouse показує таблицю стилів, що понад 90 відсотків не використовується на головній, порадник пропонує вилучити її лише з головної сторінки (він додає дескриптор із @front до правил у «Скрипти та стилі»). Об’єднані копії, захищені дескриптори й jQuery ніколи не пропонуються. Після цього перевірте сторінку.
• Залишити власні скрипти теми поза відкладанням: показується, коли ввімкнено відкладання всіх скриптів, а перший екран малюється пізніше ніж за секунду після надходження сторінки.
• Завантажувати об’єднані таблиці стилів після першого екрана: для цього потрібен Critical CSS.
• Зробіть самі: зробіть зменшені копії для телефона з великих картинок (вкладка «Зображення», «Створити» з «Перестворити всі»), згенеруйте Critical CSS кнопкою «Згенерувати автоматично» в панелі Critical CSS і згенеруйте його знову, коли він більший за 30 КБ (він робиться для одного розміру екрана, телефона). Потім перевірте сторінку.

Для розробника теми

Деякі проблеми неможливо виправити перемикачем плагіна. Другий список, Для розробника теми, збирає їх зі сторінки та звіту: скрипти в head без defer і плагін чи тему, що їх виводить, примусовий reflow, кольори тексту з надто малим контрастом, атрибути ARIA, не дозволені на елементі, зображення більші, ніж показуються, стилі, яких сторінка не використовує, і надто багато роботи в головному потоці. Натисніть Скопіювати список, щоб надіслати його тому, хто створює вашу тему.

Якщо jQuery має залишатися першим, бо сторінка виводить вбудований код, що сам його викликає, порадник повідомляє про це й називає скрипти. Огорніть цей код обробником DOMContentLoaded або виведіть його через wp_add_inline_script.

Варто знати

• Порадник змінює лише власні перемикачі плагіна в Кеш та оптимізація. Він ніколи не редагує вашу тему чи інші плагіни.
• Він читає лише головну сторінку. Запустіть його знову після зміни теми чи додавання плагіна.
• Імпортуйте свіжий звіт Lighthouse у картці діагностики, щоб отримати факти про невикористаний CSS, контраст і великі зображення.