Коли мова заходить про конкуренцію сайтів, то не останню роль відіграє завантаження сторінок та швидкість, з якою відкриваються сайти у користувачів. Повільний сайт відлякує користувачів та знижує позиції проекту у спільній видачі. У цьому практичному посібнику ми розглянемо, як за кілька кроків прискорити роботу вашого сайту та зробити завантаження сторінок швидше.
Дивіться також:
1. Використовуйте Pingdom для перевірки поточної швидкості
Для початку треба виміряти розмір сторінки та швидкість, з якою вона завантажується. Відмінною підмогою у вирішенні цього завдання стане інструментарій сайту Pingdom.com. Рекомендуємо вам інструмент Тест швидкості веб-сайту Pingdom щоб перевірити, з якою швидкістю завантажуються конкретні сторінки вашого сайту.
Перевіряти різні сторінки треба для того самого дата-центру.
2. Включаємо стиск gZip
Почати слід з максимального стиснення файлів, які можна стиснути за допомогою інструментів архівації. Так сторінки та елементи сайту завантажуватимуться набагато швидше. Методи включення архівації відрізняються в залежності від того, які налаштування движка і сервера використовуються сайтом в даний момент. Для Apache, наприклад, можна використовувати mod_deflate. Якщо ви використовуєте Litespeed, то для включення компресії потрібно активувати відповідну опцію панелі керування сайтом. Також доступне безпосереднє включення HTTP-стиску в серверах Windows.
3. Включаємо кешування для статичного контенту
У момент завантаження вашого WordPress-сайту відбувається безліч прихованих процесів. Зокрема, виконуються PHP-функції та запити до MySQL-бази. І залежно від роботи цих функцій та запитів відбувається виконання конкретних завдань.
Використання плагіна для кешування не тільки зробить завантаження сайту швидше, а й зменшить навантаження на сервер, пам'ять та процесор. Є кілька класних плагінів для кешування, але окремо хотілося б порадити W3 Total Cache. Після його встановлення ви можете увімкнути кешування у вкладці Performance → General Settings.
4. Зменшуємо та консолідуємо файли CSS та JavaScript
Чистка від сміттєвого коду CSS і JavaScript зробить їх менше за розміром і дозволить їм завантажуватися і спрацьовувати набагато швидше. Найменший розмір і кількість файлів знижують у свою чергу кількість запитів до сторінки. Ці фактори важливі для прискорення завантаження сторінок сайту в цілому.
Можна зменшити розмір таблиці стилів вручну, використовуючи онлайн-мінімізатор для CSS и JavaScript, а також можна доручити це завдання спеціальному плагіну. Є така опція у плагіна, згаданого вище: W3 Total Cache. Але не забувайте провести перевірку працездатності сайту після такої мінімізації. Головне – нічого не поламати за такої оптимізації скриптів та файлів.
5. Використовуємо систему доставки контенту CDN
Використання CDN може значно прискорити роботу вашого веб-ресурсу, навіть якщо ви самі не відразу це помітите. При використанні звичайного хостингу всі файли зберігаються на 1 сервері і до цього сервера йдуть всі запити, так що для зарубіжних користувачів час між створенням запиту, його виконанням і скачуванням контенту на локальний ПК може суттєво розтягуватися. Щоб уникнути тривалих затримок, рекомендується використовувати систему розподіленої доставки контенту.
CDN розподіляє файли між різними дата-центрами по всьому світу. А потім контент береться для завантаження на комп'ютер користувача з сервера, який найближче до нього на даний момент. Існують різні сервіси та системи розподіленої доставки контенту, наприклад MaxCDN.
Висновок
І ось результат: приріст продуктивності 160%
Проробивши лише кілька невеликих змін у роботі нашого тестового сайту, ми знову "проганяємо" його через інструменти тестування Pingdom - і отримуємо зменшення розміру сторінок на 222 КБ, зниження запитів до сторінки до 16 замість 44 та прискорення завантаження до 386 мс.
Коментарі до запису: 17
Для перевірки швидкості завантаження ідеально підходить інструмент від компанії добра http://developers.google.com/speed/pagespeed/insights/
Гугломер далекий від ідеалу, як я помітив. Точніше, вимірює дуже дивно. Просто може виставити низьку оцінку сайту, який вантажиться швидко і навпаки - показувати високий результат при тривалому завантаженні.
З аналогічних сервісів є також gtmetrix.com
Google дав результат по головній сторінці сайту: forexstandard.ru як 60 з 100
після встановлення та налаштування плагіна WP Super Cache результат 94 з 100
тому вважаю, що кешування є найкращим і найефективнішим способом прискорення роботи сайту
Насправді стаття загалом і нема про що.
1. Використовую gtmetrix.com
2. Можна додати ще список mod_expires для контролю кешування.
3.З плагінами, такими як W3 Total Cache треба бути дуже акуратним, тому що можливі конфлікти з memcached, varnish або ще якимось невідомим звірятком.
4. Якщо хтось знає підкажіть, але я не уявляю як можна консолідувати файли з того безлічі плагінів які встановлені зазвичай у більш-менш серйозному сайті на WordPress.
5. ПЗ CDN теж спірно, тому що треба точно знати де цей CDN знаходиться, наскільки він доступний. До того ж, на скільки я знаю, якщо ви хочете використовувати для контенту сайту (зображення), то вам доведеться розщедритися.
Підкажіть, як можна реалізувати Progressive JPEG у WordPress за допомогою плагіна? Не можу знайти інформації ні в наших джерелах, ні в зарубіжних країнах.
А що потрібно реалізувати?
Щоб зображення JPEG відкривалися як progressive (з поганої якості в хороше), а не як baseine (рядкове навантаження зображення). Ось про це на Хабрі: http://habrahabr.ru/post/165645/
Якщо гнати джпег із фотошопу за допомогою Save for web - просто поставити галочку progressive
Це дуже корисна інформація shared here. I am
реально thankful for this. 99th.co.in
Корисно по темі: чек-лист із прискорення сайту
Не знаю ... По мені так ставимо плагін якийсь плагін кешування (бажано щоб він умів генерувати статичні сторінки і зберігати їх) типу W3TC, віддаємо їх через nginx, включаємо HTTP/2, і блог літатиме. А все перераховане тут — насправді напівзаходи.
Можна до речі ще в сам код залізти, мені дуже ідея сподобалася https://intsystem.org/etc/uskoryaem-wordpress/ в частині кешувати розібрані MO файли в Memcache.
Поставила плагіни DB Cache Reloaded Fix, Hyper Cache Extended та EWWW Image Optimizer, але все одно сайт katina-dacha .ru довго вантажиться та запитів до бази багато. Може тема містить дуже багато всяких прикрас, які й гальмують? Як перевірити тему на наявність зайвих функцій?
Хлопці, а порадьте, будь ласка, хостинг, для невеликого інтернет-магазину в UA регіоні (dnipro-m.ua).
Особливість сайту в тому, що мені потрібні обов'язково фотографії у високій якості, на скільки було можливо — урізав фотки, більше не можу стиснути, не дозволяють.
pagespeed показує для мобільних телефонів 73, для комп'ютерів 89.
Вже включав усілякі стиски, плагіни і т.д., сайт на WP, думаю потрібен просто добротний хостинг у ЮА регіоні (Київ).
Цей сервіс оцінює сайти набагато жорсткіше, ніж гугл. Але, наприклад, у блогу wpcafe за гуглою результат 59/80, а по gtmetrix - друга перевірка 7,5-8,5 секунди.
Ну, очевидно, що статті покупні. Автор не застосував на своєму сайті свої ж інструкції.
Для порівняння у мене сайт інтернет-журнал зі слайдером у 100 фоток вгорі, практично в самій шапці плюс на головній до фіга статей. І ось зараз я зайнялася оптимізацією. По гугл швидкість 57/75. Google лається на довгу відповідь сервера в 0,74 сек. Але сайт не працює, а через проксі Клауда (Америка), який віддає кеш сторінок. Підключила його після твердих брутфорс-атак на сайт. Можливо, скоро зніму. Сам мій сервер у Нідерландах. Якщо на Клауді немає кешу, запит на мій сервер. Якщо я зараз зніму, то сайт значно додасть у швидкості. А за gtmetrix мій сайт набирає 84/87 відповідь 3,5 сек. Ну, власне кажучи, мій сайт вантажиться 2-3,5 секунди для мобіл. Дорого, звичайно, але починаю оптимізувати. Мені здається блоги без слайдерів та великої кількості записів на головній. Легко повинні завантажуватися за 1 сек. Максимум 2
А ось результат wpcafe.org не знаю скрін вклався чи ні.
Всі ці плагіни кешування – повний нуль. Важливим є перше відвідування сторінки, а не десяте. Хостинг відразу потрібно хороший купувати і менше всяких свистулок ставити на блог.