Tabla de contenidos
Якби мені завтра сказали, що на безлюдний острів я можу взяти тільки один плагін, я б, напевно, взяв Perfmatters, і якби у мене був фан-клуб, я б записався і ходив на всі їхні концерти.
Я використовую його з січня 2021 року, і це один з плагінів, який вирішив найбільше проблем, а також той, який найбільше і найкраще сприяє зменшенню швидкості завантаження.
Важливо
Це один з тих інструментів, за допомогою якого ви навіть не ставите під сумнів віддалену можливість не платити, коли настане день щорічного поновлення. Що, до речі, дуже економічно для використання на одній ділянці. Він коштує всього 24,95 доларів і має 15% знижку на наступні поновлення. Отже, починаючи з другого року і далі, це $21.21 за жалюгідні $21.21.
Оскільки я розглянув деякі з його функцій окремо, більш глибокий аналіз та інструкція з налаштування ще чекали свого часу. Це і є метою цієї публікації.
Про конфігурацію
Відмова від відповідальності: Само собою зрозуміло, що додані мною іконки увімкнення та вимкнення взяті з моєї конфігурації, яка є найкращою, яку я зміг дістати для цього блогу. Це не означає, що він ідеально підходить для вашого середовища.
Кожен сценарій відрізняється. Вам доведеться вивчити кожен варіант і зрозуміти його, поекспериментувати з його поведінкою і вирішити, що краще у вашому випадку. Для цього немає нічого кращого, ніж тестувати варіанти один за одним і оцінювати результати.
Ще одна річ, про яку слід пам’ятати, – це те, що дублікати інструментів будуть стикатися. Є й інші плагіни, такі як WP Rocket або плагін кешу сервера з Litespeed, які мають деякі функції, що роблять те саме. Їх спільна активація може призвести до конфліктів. Вам доведеться оцінити, який з них працює найкраще, і дотримуватися лише одного з них.
Вкладка “Загальні
Вкладка ” Загальні ” містить найпоширеніші інструменти. Поруч з кожним з них ви знайдете посилання на відповідну довідку. Не бійтеся їх спробувати. Усе є зворотнім. Натискання перемикача поверне все до початкового стану, і тут нічого не сталося
Вимкнути емодзі
У версії WordPress 4.2 від 2015 року в ядро було додано підтримку емодзі для старих браузерів.
Хоча вони не надто важкі (18 КБ плюс інші JS), ви можете вимкнути їх, оскільки вони завантажують JavaScript wp-emoji-release.min.js на кожну сторінку вашого блогу, а одним запитом менше – це завжди на один запит менше.
Вимкнути тире
Dashicons – це офіційний шрифт іконок адміністратора WordPress, починаючи з версії 3.8. Деякі шаблони використовують його на фронтенді, завантажуючи CSS-файл dashicons.min.css. Однак багато сучасних тем і плагінів вже використовують власні іконки, SVG, або взагалі не мають іконок. Отже, якщо ви не використовуєте тишiкони, ви можете вимкнути їх, тому що таблиця стилів додає зайвий час завантаження, а також блокує рендеринг.
Вимкнення їх з Perfmatters не впливає на адміністративну панель WordPress, яка їх використовує. Коли ви не ввійшли в систему, будуть видалені лише значки на інтерфейсі, коли ви не ввійшли в систему.
Вимкнення вбудовувань
Коли ви додаєте будь-яке посилання з вашого блогу в редакторі, WordPress розпізнає його і відображає як таке (якщо ви не змінили стиль).
Якщо вам не потрібні вбудовування, ви можете вимкнути їх і трохи полегшити навантаження. Я не вимкнув їх, бо помітив, що посилання з прев’ю, як правило, отримують хороші показники переходів, коли використовуються як пов’язані посилання між абзацами.
Вбудовування або вбудовування з’явилися в WordPress версії 4.4. Недоліком є те, що вони поставляються з додатковим кодом, який додається шляхом включення ще одного JavaScript для завантаження: wp-embed.min.js
Вимкнення вбудовувань у вашому блозі також не дозволяє іншим блогам вставляти посилання з вашого сайту за допомогою цього попереднього перегляду, проте видаляє специфічний для oEmbed JavaScript, вимикає фільтрацію результатів oEmbed,
видаляє виявлення посилань oEmbed, а також всі правила перезапису вбудовувань.
Вимкнути XML-RPC
XML-RPC – це протокол, який був доданий в WordPress 3.5, щоб дозволити віддалені з’єднання, і якщо ви не використовуєте додаток WordPress для публікації або редагування блогу з мобільного, важливо вимкнути його, оскільки він створює серйозні ризики для безпеки.
Дуже мало плагінів потребують його, я знаю лише один, який використовує його: JetPack. Багатофункціональний плагін, який не рекомендується використовувати, оскільки він значно знижує продуктивність.
Після деактивації XML-RPC просто перевірте його стан, відвідавши сторінку yourdomain.com/xmlrpc.php, щоб переконатися, що вона повертає лише повідомлення про помилку 403.
Ви також можете перевірити це в цьому чекері. Якщо ви отримуєте таке повідомлення, це означає, що XML-RPC вимкнено.
Видалити jQuery Мігрувати
Він був представлений в WordPress 3.6 і більше не ввімкнений за замовчуванням, починаючи з WP 5.5 і вище.
Хоча більшості шаблонів і плагінів він не потрібен, все ж є кілька, які потребують його для виконання деяких другорядних функцій. У моєму випадку є два плагіни, які використовують його, Ultimate Membership Pro і Rank Math для панелі статистики (яку я не використовую), яка відображається тільки для адміністраторів. Деякі плагіни управління згодою на використання файлів cookie все ще використовували його до недавнього часу.
jQuery Migrate – це ресурс для розробників, який дозволяє коду зі старими залежностями взаємодіяти з новим кодом.
Швидше за все, у вас немає плагінів, яким це потрібно, тому jQuery Migrate додає непотрібні накладні витрати Javascrip jquery-migrate.min.js
Проте, перш ніж вимкнути його, ознайомтеся з документацією до плагінів або зверніться до їхніх розробників (пізніше ми розглянемо, як вимкнути його для конкретних сайтів).
Приховати версію WordPress
У цій опції немає ніякої таємниці, вона просто приховує версію WordPress, яку ви встановили, від сторонніх очей як захід безпеки.
Це може бути зроблено різними способами, але корисно у випадку, якщо ви запізнилися з оновленням чогось, де у вашій версії з’явилися вразливості, які можуть бути використані, або ядро може бути скомпрометоване. Принаймні, приховуючи версію, ви ускладнюєте зловмисникам пошук лазівок.
Хоча видаляється лише один рядок коду, і робиться це в основному з міркувань безпеки, для ентузіастів оптимізації це просто ще одна дрібничка, яка додається до загальної суми, яку потрібно відняти.
Видаліть посилання wlwmanifest
Це тег, який з’являється в кожній інсталяції WordPress і використовувався в Windows Live Writer, який припинив оновлюватися і підтримуватися в січні 2017 року.
Як було сказано вище, це просто непотрібний код, тому на один рядок менше.
Видалити посилання RSD
Ще один залишковий тег, який з’являється в кожній інсталяції WordPress.
Якщо ви редагуєте свій сайт з браузера, він вам взагалі не потрібен. Він також використовується деякими сторонніми програмами, які використовують XML-RPC запити, які ви, ймовірно, вже вимкнули. Отже, це непотрібний код, який потрібно видалити.
Видаліть коротке посилання
Це використовується для створення короткого посилання з номерами для ваших сторінок і публікацій, які додають цей тег:
<link rel='shortlink' href='https://dominio.com?p=123' />
Якщо ви використовуєте “гарні” короткі проміжні посилання, такі як domain.com/%postname%, то немає сенсу зберігати їх без жодної користі, ще більше непотрібного коду, який можна викинути.
Вимкнути RSS-стрічку
За замовчуванням WordPress генерує різні типи RSS-каналів. Хоча RSS-канали все ще корисні для блогу, якщо ваш сайт досить статичний або ви просто не використовуєте його як блог, ви можете відключити їх.
Видалення посилань з RSS-стрічок
Так само, як WordPress генерує RSS-канали, він також генерує посилання на ці RSS-канали для ваших сторінок, дописів, коментарів, категорій, тегів тощо. Ви можете залишити RSS-канали увімкненими, але при цьому видалити посилання на RSS-канали. Мета цього – видалити додатковий і, швидше за все, невикористаний код з вашої сторінки.
Вимкнути автоматичний зворотний зв’язок
Пінгбек – це, по суті, автоматичний коментар з посиланням, який створюється як сповіщення на вашому блозі, коли інший блог посилається на вас. Автопосилання створюється, коли ви посилаєтесь на статтю у власному блозі.
Сьогодні їх майже ніхто не використовує, а зовнішні пінгбеки, які ви можете отримати, зазвичай є спамом, вони лише витрачають ресурси і навіть можуть створювати шкідливі або тимчасові посилання, які потім ламаються, а отже, шкодять SEO.
Як і трекбеки, вони належать до минулого блогів, коли посилання як філософія ведення блогу було традицією, частиною нетикету.
Відключення REST API
WordPress REST API надає кінцеві точки API для типів даних WordPress, які дозволяють розробникам віддалено взаємодіяти з сайтами, надсилаючи та отримуючи об’єкти JSON.
Він дозволяє робити перехресні посилання на дані з інших сайтів і з програмним забезпеченням, написаним на PHP або будь-якою іншою мовою.
Існують різні плагіни, сервіси та додатки, які використовують REST API, на думку Perfmatters, ось деякі з них:
Віджет інформаційної панелі Yoast SEO та Ryte, Jetpack, деякі контактні форми, Wordfence та деякі віджети інформаційної панелі WooCommerce.
Він також використовується редактором блоків Gutenberg для зв’язку під час редагування сторінок та дописів. Якщо вимкнути його повністю, ви отримаєте помилку “Оновлення не вдалося”.
Perfmatters пропонує три варіанти. Увімкнено (за замовчуванням), вимкнено для неадміністраторів і вимкнено при виході з системи.
Видалити прив’язки REST API
За замовчуванням, посилання на REST API включається в заголовок типу:
<link rel='https://api.w.org/' href='https://domain.com/wp-json/' />У кожному запиті також надсилається заголовок, а до кінцевої точки Really Simple Discovery (RSD) додається тег API. Від усього цього коду можна позбутися, увімкнувши опцію видалення його посилань.
Вимкнути Google Maps
Просто вимкніть Google Maps API.
Деякі шаблони та плагіни WordPress мають вбудований API Google Maps і часто не пропонують способу його відключити. Карти Google можуть негативно вплинути на продуктивність вашого блогу, навіть якщо запити завантажуються асинхронно. Зазвичай запит робиться через офіційний API Google Maps.
Лише для того, щоб завантажити карту на свій блог, можна зробити до 20 HTTP-запитів до Google Maps. Залежно від інтеграції ви можете робити менше або навіть більше запитів.
Якщо вони вам не потрібні, вимкніть їх.
Виключити деактивацію Google Maps за ідентифікаційним номером поштового повідомлення
Однак, якщо у вас немає іншого вибору, окрім як вбудовувати карти, ви можете виключити деактивацію тільки для тих постів, де вам потрібно їх додати. Для цього ви повинні додати в наступне поле ідентифікатор кожного допису через кому.
Вимкнення лічильника надійності пароля
Це було впроваджено в останніх версіях WordPress та WooCommerce. Це вбудований лічильник надійності паролів, який змушує користувачів використовувати надійні паролі і завантажує кілька файлів, таких як: /wp-admin/js/password-strength-meter.min.js і /wp-includes/js/zxcvbn.min.js
zxcvbn.min.js може мати більший розмір, ніж 800 КБ
Якщо ви використовуєте WooCommerce, файл також іноді можна знайти за цим шляхом:
/wp-content/plugins/woocommerce/assets/js/frontend/password-strength-meter.min.jsЗалежно від кожного шаблону і від того, як розробник розставив речі в черзі, іноді ці файли завантажуються на весь сайт. З міркувань продуктивності їх слід завантажувати лише на сторінках “рахунок”, “замовлення” та “зміна паролю”.
Якщо після вимкнення цієї функції ви все ще знаходите ці скрипти серед запитів, зверніться до документації вашого шаблону та документації будь-яких плагінів, які, на вашу думку, можуть використовувати цю функцію.
Вимкнення коментарів
Якщо вам не потрібні коментарі або ви вирішили покінчити зі спамом найрадикальнішим способом, ви можете вимкнути можливість коментування для ваших читачів. Форма коментарів зникне.
Це список дій, які Perfmatters намагатиметься виконати, коли увімкнено опцію Вимкнути коментарі:
- Вимкнути вбудований віджет останніх коментарів.
- Видаліть заголовок X-Pingback.
- Видаліть посилання на стрічку коментарів.
- Вимкнути запити до стрічки коментарів.
- Видаліть посилання на коментарі з панелі адміністратора.
- Видалити підтримку коментарів для всіх типів дописів.
- Закрийте фільтри коментарів.
- Видаліть посилання на коментарі з меню адміністрування.
- Вимкнути вбудовану сторінку обговорення.
- Приховати коментарі з панелі керування.
- Приховати опцію налаштувань коментарів зі сторінки профілю.
- Повернути порожній шаблон коментаря за запитом.
- Видаліть скрипт відповіді на коментарі.
Пам’ятайте, що якщо ви обираєте більш м’який варіант, ви можете закрити коментарі лише до певних дописів з редагування кожного допису, знявши позна чку з цього поля.
Або в Налаштуваннях/коментарях ви можете налаштувати їх закриття через певну кількість днів.
Видаліть URL-адреси з коментарів
За замовчуванням, коментарі WordPress містять поле веб-сайту, яке створює посилання nofollow (хоча спамери не заперечують проти цього) в імені автора коментаря.
Якщо ви не хочете мати справу з непрацюючими посиланнями, занадто малою кількістю коментарів або просто хочете позбутися спаму, ви можете видалити всі URL-адреси, додані відвідувачами в коментарях, одним махом.
Увімкнувши цю опцію, ви також видалите поле URL-адреси з форми для майбутніх коментарів.
Додайте порожню іконку
Якщо на вашому сайті вже є іконка, залиште цю опцію вимкненою.
Додавання білої іконки корисно, якщо ви створюєте і тестуєте багато нових інсталяцій WordPress. Додавання порожньої іконки позбавляє вас від необхідності завантажувати іконку для кожного сайту. Крім того, якщо ви забудете його, він може згенерувати помилку 404 в інструментах швидкісного тестування.
Видалення глобальних стилів
Починаючи з WordPress 5.9, було додано додатковий вбудований код для покращення дуотонних стилів (CSS та SVG код). Більшість користувачів, ймовірно, не будуть використовувати цю функцію, і проблема полягає в тому, що вона додає 311 рядків (немінімізованого) коду на кожну сторінку вашого сайту, які розділені таким чином:
196 рядків CSS перед тегом body і 115 рядків SVG коду, який також додається перед тегом /body.
Значна частина коду використовує теги!important;, що також не є ідеальним.
Perfmatters вважає, що це може бути помилкою, тому вони додають цю опцію як простий спосіб видалити весь цей непотрібний код, поки він вирішується.
Відтворення звуку, відгуки та автозбереження
WordPress Heartbeat API використовує /wp-admin/admin-ajax.php для виконання AJAX-викликів з веб-браузера.
Це чудово, тому що зберігає ваші чернетки і запобігає їх втраті через несподіване вимкнення, але це також може призвести до високого навантаження на процесор і божевільної кількості викликів PHP. Наприклад, якщо ви залишите панель керування відкритою, вона продовжить надсилати POST-запити до цього файлу з регулярним інтервалом, кожні 15 секунд. Ви можете збільшити частоту до 60 секунд, щоб пом’якшити цей ефект.
У першому варіанті ви можете вибрати, коли і де він спрацьовує.
Третя опція дозволяє вам обмежити кількість редагувань ваших записів для економії місця, наприклад, якщо ви встановите значення 10, то будуть збережені лише останні 10, а попередні будуть видалені.
Нарешті, ви можете встановити інтервал автоматичного збереження чернеток. За замовчуванням WordPress автоматично зберігає їх кожні 60 секунд. Однак, якщо ви збільшите інтервал, вам доведеться частіше зберігати вручну, це запобігає “зависанню” браузера, коли ви перебуваєте в адміністративній частині, а також зменшує кількість записів до бази даних.
Woocommerce
Про варіанти оптимізації для WooCommerce скажу лише, що вони існують, але утримаюсь від будь-яких коментарів, оскільки в цьому домі прийнято не розглядати те, що мені не дуже зрозуміло, як у цьому випадку. Я видалив WooCommerce у липні 2021 року і майже нічого не пам’ятаю про реакцію на ці оптимізації, тому відсилаю вас до їхньої документації:
- Вимкніть скрипти та стилі WooCommerce
- Вимкнути фрагменти кошика
- Вимкніть поле стану WooCommerce
- Вимкнути віджети WooCommerce
URL-адреса для входу
Ще однією цікавою функцією є можливість змінити URL-адресу для входу в адмінку за замовчуванням, яку WordPress встановлює за адресою yourdomain/wp-admin. Він робить те ж саме, що і такі пагіни, як WPS Приховати логін.
Ви знайдете три поля:
У першому випадку ви можете змінити адресу для входу в систему wp-admin на будь-яку іншу, наприклад, “yourdomain.com/potato“, таким чином уникнувши атак грубої сили та інших, які зазвичай націлені на адресу за замовчуванням. Просто запишіть його та/або намагайтеся не робити дивний URL з великою кількістю символів, щоб не забути його (хоча ви завжди можете відновити його, перейшовши до таблиці wp_options / perfmatters_options )
Друге поле (Disabled Behavior) задає, на яку адресу буде перенаправлено відвідувача, що потрапив на ваш домен/wp-admin, з трьома варіантами:
- Повідомлення (за замовчуванням): Відображає повідомлення для відвідувача. Ви можете налаштувати повідомлення з потрібним вам текстом, додавши його в поле Повідомлення.
- Шаблон 404: Користувач буде перенаправлений на сторінку 404.
- URL-адреса домашньої сторінки: Користувач перенаправляється на домашню сторінку.
Активи
Ось тут стає по-справжньому цікаво.
Сценарний менеджер, вишенька на торті
Менеджер сценаріїв Perfmatters, без сумніву, є найпотужнішим і найкориснішим інструментом. Тільки це варте кожної копійки з тієї невеликої суми, яку ви платите за плагін і його підтримку.
Він дозволяє вимкнути скрипти і CSS, що використовуються кожним плагіном, і запобігти їхньому завантаженню в публікації або на сторінці, в обох місцях або на всьому сайті, фільтрувати за авторизованими або неавторизованими користувачами, за пристроями і додавати винятки, навіть для категорій і тегів.
Це може значно збільшити швидкість завантаження (особливо домашньої сторінки), усуваючи непотрібні запити там, де плагіни не використовуються, наприклад, для форм або чогось іншого.
Режим обов’язкового використання (MU) виводить Менеджер сценаріїв набагато далі. Він дає набагато більше контролю і надає можливість відключати запити і хуки плагінів WordPress, а також вбудовані CSS і JS. Тепер ви можете контролювати всі аспекти плагіна, починаючи з його інтерфейсних скриптів, вбудованого коду і закінчуючи запитами до MySQL, де б ви не знаходилися.
У його глобальному поданні ви знайдете всі застосовані налаштування на випадок, якщо одного дня вам знадобиться реорганізувати, змінити, додати нові або видалити деякі з них.
Він має досить повну документацію. Якщо ви не звикли до такого роду інструментів, це може спочатку налякати, але як тільки ви спробуєте, ви зрозумієте, що користуватися ним дуже легко.
JavaScript
Відкласти та затримати JavaScript.
Обидва ці способи можуть допомогти покращити FCP та LCP
Додавання атрибуту defer до кожного некритичного JavaScript-файлу прискорює перше малювання вмісту (FCP) сторінки. Це означає, що JavaScript завантажується під час синтаксичного аналізу HTML і виконується після завершення завантаження сторінки (коли синтаксичний аналіз завершено). Іншими словами, завантаження javascript відсувається в кінець сторінки, щоб воно було виконано в кінці процесу.
Із затримкою результати ЛКП і ТБТ покращуються. JavaScript затримується відповідно до взаємодії з користувачем, прискорюючи перше відображення сторінки, коли щось не потрібно негайно, наприклад, важкі скрипти від третіх сторін, такі як Google Adsense, Google Analytics, пікселі конверсії Facebook або Google Ads і подібні.
Для обох опцій ви можете додати винятки та увімкнути поведінку Delay Timeout, яка встановлює тайм-аут, після якого скрипти автоматично завантажуватимуться через 10 секунд, якщо не буде виявлено жодної взаємодії з користувачем. Ця опція необов’язкова і за замовчуванням вимкнена.
Тайм-аут затримки
Якщо ви увімкнете цю опцію, у вас буде можливість встановити інше значення таймауту затримки за допомогою одного з цих фільтрів.
У прикладі встановлено 7 секунд.
add_filter('perfmatters_delay_js_timeout', function($timeout) {
return '7';
});Вони радять не встановлювати занадто коротке значення таймауту, інакше функція затримки JS не буде працювати належним чином. Крім того, незалежно від таймауту, у 99% випадків все спрацьовує при першій взаємодії користувача, будь то прокрутка, клацання або перший рух миші.
CSS
Perfmatters каже, що найпростіший спосіб вирішити проблему з попередженням “Зменшити невикористаний CSS” – увімкнути цю функцію, яку я розглядав, коли вона була ще в бета-версії, і яка робить все це автоматично. Розробники стверджують, що протестували його на сотнях URL-адрес (з використанням різних шаблонів і налаштувань), і ось деякі з результатів, які вони отримали:
- Середній показник FCP знизився на 15,20%.
- Середнє зниження LCP на 19,66%.
- Середній показник TTI знизився на 14,95%.
Перш ніж активувати функцію “Видалити невикористовуваний CSS” в Perfmatters, вони рекомендують видалити всі існуючі попередні завантаження CSS, встановлені в Perfmatters (за винятком локальних таблиць стилів Google Fonts).
Не об’єднуйте CSS (те, що часто робиться з WP Rocket, Litespeed, Autoptimize та іншими). Злиття CSS – це застарілий метод оптимізації з часів HTTP/2. У деяких випадках комбінування CSS може погіршити продуктивність(у моєму випадку цього не сталося) і, нарешті, переконайтеся, що ви не намагаєтеся видалити невикористаний CSS за допомогою іншого плагіна.
Існує три методи видалення:
- Затримка (за замовчуванням): Всі оригінальні таблиці стилів CSS (невикористані CSS) затримуються і завантажуються при взаємодії з користувачем. Це рекомендований варіант.
- Асинхронно: Усі оригінальні таблиці стилів CSS (невикористані CSS) завантажуються асинхронно. Цей метод може допомогти уникнути спливаючих вікон, оскільки таблиці стилів виконуються асинхронно під час завантаження сторінки. Цей метод призведе до дещо вищого LCP/FCP, ніж поведінка затримки.
- Видалити: Видаляються всі оригінальні таблиці стилів CSS (невикористані CSS). Це найагресивніший метод, але він також, ймовірно, потребуватиме додавання винятків. Рекомендується лише для досвідчених користувачів.
Тут немає ніякого секрету, окрім як експериментувати в тестовому середовищі та вимірювати результати, як ізольовано, так і у взаємодії з іншими функціями.
Деякі з цих функцій можна вимкнути для будь-якого допису або сторінки в редагуванні WP.
Код
Корисна класика, яку включають багато інших плагінів, те, що можна зробити навіть вручну, але що спрощує і полегшує операцію додавання кастомного коду до заголовка, тіла або нижнього колонтитула вашого блогу.
Наступні поля виводять код безпосередньо у фронтенд, тому він має бути коректним HTML. Це включає вбудований CSS у тегах <style> або вбудований JS у тегах <script>. Ви також можете завантажити файл JS або CSS.
Він не підтримує серверні мови, такі як PHP. Для додавання власного PHP-коду рекомендується використовувати плагін Code Snippets.
Попереднє завантаження
У розділі “Попереднє завантаження” перша опція під назвою“Миттєва сторінка” використовує бібліотеку instant.page і завантажує невеликий JS-файл розміром менше 2 КБ(instantpage.js) локально на вашому сайті, який використовується для попереднього завантаження URL-адрес, коли користувач наводить курсор миші на посилання або зображення в десктопній версії. На мобільних пристроях URL-адреса попередньо завантажується після того, як користувач почне натискати посилання на екрані і до того, як він його відпустить.
Через 65 мілісекунд у фоновому режимі автоматично починається попереднє завантаження URL-адреси.
Цей інструмент є еквівалентом“Instant Click” у Litespeed і“Preload Links” у WP Rocket, тому якщо ви використовуєте цю опцію в будь-якому з цих двох плагінів, вам слід деактивувати її, щоб спробувати Perfmatters.
У моєму випадку це спрацювало трохи краще, ніж еквівалентна опція в Litespeed, хоча слід зазначити, що в деяких випадках це може збільшити навантаження на сервер.
Як і у випадку з опціями Javascript і CSS, використання попереднього завантаження і попереднього з’єднання слід використовувати відповідно до ваших потреб на основі різних тестів.
Попереднє завантаження критичних зображень (тих, що знаходяться над згином) – це опція, яка поки що знаходиться в бета-версії, але може допомогти скоротити час, необхідний для малювання великого контенту (LCP) в Core Web Vitals.
Зазвичай це такі зображення, як логотип, основне зображення в дописі, головне зображення на цільовій сторінці тощо. Коли ви попередньо завантажуєте їх, вони переміщуються на вершину водоспаду і, по суті, повідомляють браузеру, що вони мають пріоритет і повинні бути завантажені негайно.
Ви можете вибрати між нулем, щоб не завантажувати жодного (варіант за замовчуванням) і п’ятьма зображеннями. Permatters рекомендує вибрати два або максимум три, оскільки Chrome має обмеження на два попередньо завантажених зображення, які з’являться на вершині водоспаду.
Ліниве завантаження
Ще одна класика, пов’язана з продуктивністю, яку WordPress включив в себе з версії 5.4 у 2020 році.
У моєму випадку я використовую опцію Litespeed, тому що в тестах я отримав трохи кращі результати, але навіть при цьому Perfmatters працює дуже добре і також застосовує його до CSS фонових зображень.
Шрифти
Ще одна хороша новина. Ця опція, додана до версії 1.7.4 від Perfmatters 1.7.4вийшов 7 червня 2022 року. Він дозволяє розміщувати і завантажувати шрифти Google локально за допомогою пари кліків.
Переваг локального хостингу шрифтів багато: ви отримуєте повний контроль над ними, усуваєте всі ці запити і, відповідно, час завантаження, а також можете вирішувати, як їх обслуговувати.
Функція автоматично знаходить будь-яке посилання на Google Fonts, яке є у вашому блозі, завантажує відповідні шрифти з fonts.google.com і розміщує їх локально на вашому сервері в каталозі: /wp-content/cache/perfmatters/your-domain.com/fonts/
Уцьому дописі більш детально пояснюється його використання.
CDN
Тут немає нічого особливого, і коментувати тут особливо нічого. Інструмент, завжди корисний для додавання CDN, який ви використовуєте. Оскільки я використовую QUIC.CLOUD, він мені ще не знадобився.
Аналітика
Хоча я не використовую його зараз, оскільки почав перехід на Matomo і передав управління скриптом Analytics моєму плагіну управління згодою на використання файлів cookie RGPD/CCPA, який також керує ним коректно, але я знаю, що він дуже добре працює з Perfmatters, тому що я використовував його колись.
Звідси ви можете розмістити скрипт Google Analytics локально. Це допомагає пришвидшити роботу вашого сайту, зменшуючи кількість додаткових DNS-запитів та вирішуючи проблему “використання кешу браузера” їхнього скрипту.
За словами Perfmatters, за іронією долі, власний скрипт Google видає попередження про кешування, але це тому, що у них дуже короткий термін дії заголовка кешу HTTP. Якщо ви розміщуєте його самостійно, заголовки кешу HTTP з вашої власної CDN або сервера будуть застосовані автоматично. Іншими словами, ви отримуєте повний контроль над кешуванням скрипта.
Вони також зазначають, що цей інструмент офіційно не підтримується Google, але використовується роками без жодних проблем.
Локальний хостинг Google Analytics і обслуговування скрипта з власної CDN або сервера також дозволяє вам скористатися перевагами єдиного HTTP/2-з’єднання.
