Як збільшити швидкість завантаження сторінок на сайті

Однією з базових SEO-рекомендацій щодо покращення поведінкових факторів на сайті вважається необхідність збільшення швидкості завантаження сторінок. І справді: чим швидше працює сайт, тим приємніше ним користуватися, і в цьому сходяться і відвідувачі, і оптимізатори.

Чому сайт може повільно працювати?

Що відбувається, коли сторінка відкривається? У цей момент контент передається клієнту, пошуковику, парсер або браузеру. На швидкість завантаження впливають чотири фактори:

• як далеко (географічно) розташований сервер від клієнта;
• який контент передається – коди чи зображення;
• як саме відбувається передача даних;
• як згенеровано контент.

На що можна вплинути? Звичайно, в першу чергу, на Front-end та Back-end сайту, тобто безпосередньо на тип контенту та спосіб його генерування. А ось віддаленість сервера від клієнта не завжди підвладна власникам ресурсу. Втім і тут є технології прискорення.

Географічна віддаленість

Чим більша відстань між сервером та клієнтом, тим вище буде ping – той самий час, за який передається певний пакет інформації. Але впливає не лише час. Важливим є і маршрут, і загальна завантаженість каналу. Потрібно враховувати, що DNS-запити з кожної сторінки надсилаються по кожному з доменів, що згадуються на сторінці. Але при виборі хорошого сервера ви не помітите жодних проблем: загальний час підключення до серверів не перевищує 2% від сумарного часу завантаження.

Тип контенту чи Front-end

Контент має бути оптимальний за розміром та правильно розподілений по сторінці. Ось головні проблеми в цій категорії, що заважають сайту працювати швидко:

Зображення: можуть бути великого об'єму і дуже великого розміру, неправильно вибраного формату (JPEG завантажується набагато швидше, ніж PNG-24), надто високої роздільної здатності (наприклад, макет для друку замість звичайного фото). Потрібно використовувати спеціальні плагіни для обробки зображень, а також контролювати "технічні характеристики" всіх фото та картинок, які ви збираєтеся розмістити на сайті. Для оцінки обсягу зображень можна використати статистику сайту. Також важливо мінімізувати кількість зображень, залишивши дійсно значущі, щоб скоротити частоту звернення до сервера.

Програмний код. Для CSS та JavaScript базова складність все та ж: кількість файлів + їх обсяг. Якщо сайт займаються професійні розробники, то вони можуть мінімізувати всі ці дані ще на етапі розробки. На практиці часто буває по-іншому: на оптимізацію потрапляє вже діючий сайт зі складнощами в завантаженні. Обсяг файлів JavaScript змінюють шляхом видалення коментарів та перенесення рядків, а також заміною імен змінних на короткі. Зменшити кількість файлів і уникнути конфлікту складніше. Але можна використовувати технологію мініфікації: є спеціальні автоматизовані сервіси, що стискають та об'єднують js- та css-файли. Тим самим було забезпечується збільшення продуктивності ресурсу.

Швидкість передачі: способи оптимізації

Якщо неможливо переробити контент, можна збільшити швидкість передачі. І тому існує 6 технологій. Їх можна протестувати незалежно один від одного і підібрати відповідний варіант:

1. Компресія текстів . Цей спосіб прискорення завантаження рекомендується HTTP1.1. Для стиснення у більшості випадків використовується Gzip, популярний у Unix-системах алгоритм. Метод стиснення нагадує той, що використовується у ЗІП-архівах. Таким чином можна скорочувати обсяг, який займає текстова інформація (включаючи програмний код і хтмл, але не картинки). Перевірити стиск можна, запустивши «перевірку відповіді сервера» у Вебмайстрі. Також для компресії можна використовувати файл .htaccess з доданими до нього інструкціями.
2. Кешування у браузері . Під час кешування браузер зберігає копію та відкриває вже скопійовану та збережену копію сторінки. Сервер надсилає браузеру інформацію про зміни сторінки. Є кілька типів заголовків, що надсилаються сервером - наприклад, Expires, за часом, до якого контент вважається актуальним, або Last-Modified, за часом останньої зміни. Перед тим, як показати сторінку користувачеві, браузер перевіряє всі дозволені заголовки. Тож відвідувач завжди бачить актуальну інформацію. Краще, якщо контент із самого початку згенерований сервісною мовою програмування php. Це допоможе забезпечити кращу керованість.
3. HTML-кеш динамічних сторінок на жорсткому диску. Кеш може зберігатися на жорсткому диску або в оперативній пам'яті сервера, тому сторінки відкриватимуться максимально оперативно. Але дуже важливим є професійне впровадження технологій кешування, інакше можна перевантажити оперативну пам'ять. Є кілька популярних кешуючих плагінів.
4. Асинхронне завантаження У цьому випадку плагіни підвантажуються паралельно базовому контенту. Щоб увімкнути такий спосіб завантаження, достатньо прописати атрибут async до тега script.
5. CDN-технологія для паралельного завантаження. Можна перенести частину контенту на інший домен або створити піддомен для зберігання найважчих частин сайту. Технологія CDN дозволяє розміщувати статичний контент у мережі розподілених серверів, мінімізуючи вплив географічного фактора. Для запуску такої технології звертаються до CDN-провайдерів.
6. Протокол HTTP/2 дозволяє завантажувати всі файли паралельно, як один потік. Однак для запуску нового протоколу може знадобитися оновлення сервера.

Способи створення контенту

На продуктивність сайту сильно впливає робота сервера, тобто час його відповіді при завантаженні сторінки. Якщо відповідь сервера не досягається протягом 10 секунд, Яндекс.Метрика може вважати сайт непрацездатним.

На швидкість сервера впливають встановлені установки. Найчастіше використовується зв'язка Nginx + Apache для якісного сортування запитів та швидкої їх передачі.

Також потрібно правильно підібрати режим роботи PHP. За замовчуванням він працює в режимі CGI, не надто продуктивному. Режим mod_php забезпечує більшу продуктивність, але потребує багато ресурсів. Для навантажених сайтів знадобиться режим FastCGI (або FPM).

Сервер може довго відповідати і через тривалу обробку запитів до баз даних. Під час роботи з БД важливо перевірити всі налаштування, зокрема: обсяг і ефективність КЭШа запитів, кількість дозволених одночасних підключень, обсяг займаної фізичної пам'яті на сервері. Можна налаштувати лонгування запитів, а потім визначити, які з них навантажують базу даних на тривалий час.

Все це ефективні способи оптимізації швидкості завантаження сайту. Більш конкретні рекомендації можна лише після аналізу конкретного ресурсу.