Ні для кого не секрет, що WordPress - досить масивний і ненажерливий движок. Уже після десятка встановлених плагінів / віждетов він стає ресурсоємних і тяжким для завантаження, а якщо додати до цього сучасну перевантажену скриптами і графікою тему, то ситуація і зовсім стає плачевною. У даній статті я опишу свій досвід по оптимізації ресурсу, який ви зараз і переглядаєте, і опишу основні тонкощі оптимізації движка на серверній стороні.
Попередня оптимізація. DNS.
«Чарівний» DNS - CloudFlare
Основні (і безкоштовні) функції даного сервісу:
- DNS-кешування ресурсу;
- Демонстрація кешованої версії за умови відмови сервера / хостингу (інакше кажучи, система «Завжди On-Line);
- DDoS-захист на рівні DNS (за допомогою низкоуровневого фаервволла);
- Мініфікація даних, що відправляються користувачеві сайту, «на льоту»
передзавантажувальне кешування
Після того, як процес делегування завершиться, і сайт запрацює вже через сервера CloudFlare, можна переходити до налаштування мініфікаціі і кешування ресурсу.
Далі, перейдемо у вкладку «Caching«, і відзначимо там такі параметри:
Більше на цій сторінці, та й в опціях ресурсу в цілому, в налаштуванні нічого не потребує. Окремо варто сказати про налаштування «Development Mode» в секції «Caching»: якщо Ви налаштовуєте елементи зовнішнього вигляду, такі як теми / віждети / скрипти, що модифікують DOM, то Вам слід відключити кешування за допомогою цієї опції (тобто перевівши її в стан On). В іншому випадку, може вийти так, що вносяться Вам зміни не будуть відображатися на сайті, хоч і будуть застосовуватися.
На цьому робота з даним сервісом закінчена. Переходимо до налаштування сервера і самого WordPress.
Основна оптимізація
Відразу варто обмовитися, що якщо Ви - власник хостингу. а не VPS / VDS, то дії в пункті «Налаштування кешування (Apache2 + PHP)» будуть для Вас досить проблематичні для виконання, тому що в них мається на увазі пряме втручання в конфігурацію сервера, тому раджу Вам заздалегідь дізнатися у свого хостинг-провайдера про можливості цих моделей.
Більш того, описані дії можна застосувати тільки до веб-сервера Apache версії 2. Якщо Ви - користувач nGinx, то Вам навряд чи підійде все описане (можливо, пізніше я додам інструкцію з налаштування nGinx, але зараз подібною інформацією я не володію).
Отже, як вже стало зрозуміло, основна оптимізація цілком складається з правильного налаштування кешування як в самому двигуні (за допомогою плагінів), так і на стороні сервера (за допомогою модулів сервера і інтерпретатора PHP). Почнемо з настройки сервера, як з найскладнішою і трудомісткою завдання, поступово рухаючись до завершальної стадії.
Налаштування кешування (Apache2 + PHP)
Для настройки кешування на стороні сервера знадобиться root-доступ, або користувач, що входить до групи sudo.
Спершу, необхідно встановити пакети програм, які здійснюють кешування, і пакети інтерфейсів кешування для сервера і інтерпретатора. Для цього виконуємо наступні команди:
sudo apt-get install php5-memcache memcached php-pear build-essential php5-tidy php5-curl apache2-dev php-apc php5-memcached
Після установки даних пакетів, переходимо до редагування конфігураційного файлу php:
sudo nano /etc/php5/apache2/php.ini
Знаходимо в даному файлі секцію «Dynamic Extensions» (пошук в nano здійснюється через комбінацію клавіш Ctrl-W), і відразу після рядка початку секції вписуємо наступний код:
Тепер справа залишилася за малим - активувати необхідні серверні модулі. Для цього, виконуємо наступні команди:
sudo a2enmod rewrite
sudo a2enmod expires
sudo a2enmod headers
sudo service apache2 restart
Готово! Тепер переходимо до налаштування WordPress.
Налаштування кешування (WordPress)
Для використання всього того набору інструментів, що був встановлений в попередньому кроці, необхідно встановити один-єдиний плагін кешування - W3 Total Cache.
Після установки, відразу ж переходимо до налаштування. Для цього, в що з'явилася в бічній навігаційній панелі вкладці «Performance» відкриваємо сторінку «General Settings»,
і у вікні, активуємо все опції, крім опцій «CDN» і «Monitoring» (тобто відзначаємо галочкою поле «Enable«). Так само, всюди, де це можливо, вказуємо тип кешування «Opcode: Alternative PHP Cache (APC)«:
Після всіх скоєних маніпуляцій наживаємо кнопку «Save all changes«, і очищаємо кеш через вкладку «Performance»> «Empty all Caches» в верхній навігаційній панелі.
Мініфікація даних
Останнє, що залишилося налаштувати в W3 Total Cache - мініфікація даних. Для настройки, переходимо в вкладку «Performance»> «Minify«, і активуємо наступні опції:
Готово! Кешування на Вашому ресурсі повністю настроєний.
Додаткова оптимізація
Крім кешування, є ще ряд інструментів і правил, дотримання яких дозволить Вашому ресурсу зберігати швидку швидкість завантаження довгий час. Почнемо з самого очевидного - компресії зображень.
стиснення зображень
Для того, щоб Ваш ресурс завантажувався ще швидше, недостатньо одного лише кешування статичних об'єктів - особливо, якщо самі об'єкти при цьому важать тонну кілобайт. Хоч як це прикро, найчастіше такими «об'ємними» файлами є саме графічні зображення, які адміністратор сайту викладає абсолютно не замислюючись про їх вазі.
У даній ситуації, на допомогу приходить плагін WP Smush. Даний плагін може як оптимізувати вже завантажені до його установки зображення, так і знову завантажуються нові.
Плагін має простий інтерфейс з мінімальною кількістю опцій, стандартні значення яких не вимагають змін, тому що відповідають поставленому завданню. Єдиний мінус - у безкоштовній версії плагіна вже існуючі зображення можна стискати тільки пачками по 50 штук, після чого доводиться знову натискати кнопку «стиснення» для відновлення процесу.
Поради зі стиснення медіафайлів
Додаткові поради щодо оптимізації медіафайлів:
- Для архівів використовуйте формати, що гарантують максимальне стиснення на даний момент (tar, tar.xz, в гіршому випадку - zip);
- Викладаючи файли коду, подбайте про їх стисненні в архів і / або мініфікаціі через спеціальні сервіси;
- Уникайте графіки великих розмірів. Хоч вона і буде стискатися через WP Smush, її вага не зменшиться навіть наполовину реального;
- Використовуйте формати зберігання графіки з максимальним стисненням (JPEG, GIF)
Інші поради
Поділитися в соц.сетях: