Чому сайт повільно завантажується

Це найчастіша причина з усіх. Фотографію з телефону чи стокового сайту часто вставляють на сторінку без жодної обробки. Такий файл може важити кілька мегабайт, хоча на екрані займає всього кілька сотень пікселів. Браузер усе одно завантажує повний файл цілком, а вже потім стискає його візуально під розмір блока на сторінці, витрачаючи і час, і трафік відвідувача, особливо на мобільному інтернеті. Це стосується як фото в галереї, так і великих банерів на першому екрані, які відвідувач бачить ще до того, як сторінка встигла довантажитись.

Рішення тут не складне. Зображення потрібно стискати перед завантаженням на сайт, використовувати сучасний формат на кшталт WebP замість JPEG чи PNG, і завантажувати файл у розмірі, який реально показується на сторінці, а не в оригінальному розмірі камери. Для сайту з десятком фотографій це різниця в кілька секунд завантаження.

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

Якщо сайт написаний з нуля під конкретні задачі, такого баласту просто немає. Завантажується тільки те, що реально потрібно для цієї сторінки. Різниця особливо помітна на слабших мобільних процесорах: важкий JavaScript там виконується в кілька разів довше, ніж на новому ноутбуці, на якому його, найімовірніше, тестували. Чим простіший технічний фундамент, тим менше зайвого коду доводиться вантажити кожному відвідувачу.

Швидкість сайту починається з того, наскільки швидко сервер відповідає на перший запит браузера. Дешевий спільний хостинг, де на одному фізичному сервері живуть сотні чужих сайтів, може відповідати секунду і довше ще до того, як браузер отримає хоч байт вашої сторінки.

Тут не рятують жодні оптимізації фронтенду. Якщо сервер повільний, сайт повільний, скільки б зображень ви не стиснули. Іноді проблема ще й у географії: сервер у США для аудиторії в Україні додає затримку просто на фізичну відстань. Вибір хостингу чи платформи під реальне навантаження і аудиторію вирішує цю проблему одразу і назавжди.

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

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

Сервер може віддавати файли сайту в стиснутому вигляді, наприклад через gzip чи brotli, і дозволяти браузеру зберігати їх у себе в кеші між візитами. Якщо це не налаштовано, кожен відвідувач щоразу заново завантажує повний, нестиснутий набір файлів, навіть якщо був на сайті годину тому.

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