Швидкість сайту має величезне значення і впливає на багато аспектів. Насправді, не багато що може зрівнятися з нею за значимістю. Швидкість впливає на позиції сайту в пошуковій видачі, на рівень конверсії, на лояльність користувачів, на стійкість до атак, кількість необхідних серверних ресурсів і безліч інших менш значущих аспектів.
Технології та методики прискорення сайтів постійно розвиваються. З кожним роком все більше з'являється сайтів, які швидко працюють навіть на смартфонах. Користувачі очікують, що ваш сайт теж працюватиме швидко і з кожним роком вони стають все менш терпимими до повільних сайтів.
Тому швидкість роботи сайту стає одним з найважливіших параметрів, який може привести ваш проект до успіху або провалу. Якщо ваш сайт зіткнувся з проблемами продуктивності, саме час замовити прискорення сайту.
Основні напрямки прискорення завантаження сайту
Найпоширеніші причини уповільнення роботи сайту
Сайти, зроблені на базі готового шаблону, зазвичай мають велику кількість файлів, що підключаються до кожної сторінки сайту. Ці файли забезпечують роботу двигуна шаблону і плагінів, необхідних для його роботи. Особливо часто це зустрічається на сайтах, що використовують CMS WordPress. У WordPress дуже мало вбудованого функціоналу, і тому, щоб зробити пристойний сайт, розробникам доводиться буквально обвішувати його плагінами. Кожен такий плагін зазвичай підключає кілька великих файлів для пари рядків коду в них.
У більшості випадків, прискорювати такий сайт – нерентабельно, оскільки дешевше його переробити на іншому двигуні і, при необхідності, вручну дописати необхідний функціонал.
«Коробочні» CMS зазвичай нормально справляються з 10-15 тисячами товарів без наслідків для швидкості. Хоча це дуже індивідуально і залежить не лише від кількості товарів, а й від якості програмного коду. З цієї причини, в інтернет-магазинах насамперед страждають від уповільнення сторінки категорій товарів. Це відбувається через непристосовану до таких умов логіку програмного коду на сторінках категорії.
Робота над прискоренням такого сайту йде шляхом оптимізації бази даних та переписування програмного коду виведення товарів на сторінці.
При зростанні відвідуваності сайту зростає навантаження на сервер. Процесор на сервері здатний обробити певну кількість одночасних звернень до нього за одиницю часу. Якщо кількість одночасних звернень зростає, то сервер ставить звернення користувачів у чергу, що призводить до уповільнення роботи сайту.
У цьому випадку для прискорення сайту потрібно докупити ресурси або налаштувати сервер, або змінити провайдера.
Інколи сайти починають працювати повільно через неправильно написаний або взагалі недописаний код, або через повільні запити до бази даних.
У таких випадках потрібно знайти та виправити ці помилки.
Як не дивно, ще досить часто зустрічаються сайти, в коді яких йде підключення сервісів Яндекса, VK та інших систем, що знаходяться під блокуванням. Сайт досить довго намагається підключитись до них, що збільшує підсумковий час завантаження сторінки.
У цьому випадку потрібно просто вимкнути заблоковані ресурси.
Скільки коштує прискорення сайту?
Вартість прискорення сайту завжди є індивідуальною та унікальною. Навіть при роботі з однією системою управління контентом (CMS) кожен сайт має свої особливості. Фактори, такі як версія CMS, набір та версії плагінів, наявність індивідуально написаного функціонала та підходу розробника, а також стан сервера роблять кожну ситуацію унікальною.
У нашому досвіді вартість прискорення текстових сайтів (наприклад, сайти-візитки, корпоративні чи блоги) варіювалася в діапазоні від 100 до 400 доларів США. Для сайтів-каталогів (наприклад, інтернет-магазини, дошки оголошень, портали) вартість прискорення була в діапазоні від 100 до 1500 доларів США.
В результаті діагностики ми часто бачимо типову картину: є 1-2 проблеми, вирішення яких може дати 50-60% можливого прискорення та є 10-20 проблем, вирішення яких у сумі може дати 40-50% можливого прискорення. Часто вартість вирішення цих проблем пропорційна і не залежить від потенціалу прискорення. Тому коридор прискорення частіше обмежується бюджетом, ніж технічними можливостями. Навіть на прискореному сайті завжди можна ще щось прискорити та заощадити кілька мілісекунд.
Переваги прискорення сайту у WEB ROOM
Отзывы о нашей работе
Діагностика швидкості сайту
Первинний аналіз проводиться для визначення проблеми зі швидкістю та виявлення локалізації проблеми (на стороні сервера або на стороні браузера).
Наступна діагностика може не знадобитися, якщо первинний аналіз виявить причину уповільнення в кількості та розмірі файлів сайту, що завантажуються. Якщо проблема буде локалізована на стороні сервера, то знадобиться провести тест швидкості сайту.
Під час тестування на кожному типі сторінок вимірюються показники швидкості, а саме: повний час завантаження сторінки, час відповіді сервера, кількість та розмір зображень, css та js файлів. За результатами тестування формується звіт.
Тестування швидкості сайту необхідно проводити на окремому сервері, щоб унеможливити вплив сервера та відвідуваності на показники швидкості. Тож ми зможемо отримати максимально чисті базові показники швидкості системи.
Наступна діагностика може не знадобитися, якщо причиною повільної роботи сайту був сервер. В іншому випадку знадобиться аналіз програмного коду та бази даних.
Під час цього аналізу перевіряється код та база даних проблемних типів сторінок для виявлення повільних функцій.
В результаті аналізу пропонуються роботи з оптимізації або переписування повільного функціоналу.
Які сайти ми не прискорюємо?
Ми не прискорюємо сайти, які створені на базі конструкторів або на базі готових шаблонів з маркетплейсів, оскільки у 98% випадків причиною повільної роботи є те, як сайт у принципі зроблено і для прискорення його необхідно переробляти. Особливо це стосується сайтів на CMS WordPress, які майже завжди так зроблено.
Ми працюємо лише з сайтами, написаними мовою PHP. Але не працюємо з фреймворками Drupal та Symfony.
Також ми не працюємо з системами російського виробництва.
Чи має Ваш сайт проблеми зі швидкістю?
Іноді нам надходять запити на прискорення сайтів, які не мають проблем зі швидкістю.
Часто причиною звернення до нас є незадовільні оцінки ресурсів PageSpeed Insights, GTmetrix, Pingdom Tools та інших аналогів. Але такі ресурси не можуть дати вам об'єктивну інформацію про швидкість сайту.
Для того щоб мати можливість спиратися на дані подібних ресурсів про швидкість завантаження сайту, необхідно знати як інтерпретувати їх показники. А для цього потрібно знати, як ці ресурси працюють.
Деякі з цих ресурсів дають показники у балах, інші в секундах. PageSpeed Insights та інші ресурси, які працюють на двигуні Lighthouse, такі як GTmetrix, взагалі не вимірюють час завантаження вашого сайту. Lighthouse завантажує файли вашого сайту та проводить симуляцію завантаження із сильно заниженою швидкістю мережі. При цьому він симулює роботу сервера, виключаючи цілий пласт оптимізації на стороні вашого сервера. А ще він вважає всі файли зовнішніх ресурсів (скрипти аналітики, відео YouTube, карти, онлайн чати та багато іншого), які завантажуються асинхронно (не заважаючи завантаженню сайту), файлами вашого сайту, які блокують завантаження самого сайту.
Це лише мала частина прикладів особливостей роботи таких ресурсів. Більш детально можете почитати в нашій статті «PageSpeed Insights - як читати дані і можна Чи їм вірити?”, де ми на прикладі PageSpeed розбираємо особливості роботи та рекомендації, які дає цей ресурс.
Якщо вам хтось пропонує використовувати такі ресурси як метрику сайту, це означає, що людина не розуміє, як працюють сайти і що впливає на швидкість завантаження.
Якщо вам цікаве питання швидкості вашого сайту, то ви можете ознайомитися з нашими статтями “Швидкість сайту. Від чого залежить швидкість завантаження сайту та як не допускати уповільнення” та “Оптимізація часу відповіді сервера (TTFB)” . Або просто замовте аналіз швидкості завантаження вашого сайту. Ми зробимо об'єктивні виміри та дамо рекомендації щодо реального прискорення завантаження сайту.
Як виміряти швидкість завантаження сайту
Почнемо з того, що такого параметра, як швидкість завантаження сайту, немає. Ми використовуємо цей вираз для простоти. Але ми не можемо визначити завантаження сайту в одиницях швидкості. При завантаженні сайту відбувається безліч різних процесів, частину яких ми можемо визначити в одиницях швидкості. При завантаженні сайту ми говоримо про час, за який відбуваються всі ці процеси.
На час завантаження впливає багато факторів:
- Потужність сервера, його програмне забезпечення та налаштування
- Якість програмного коду та бази даних сайту
- Кількість та розмір файлів сторінки сайту, а також якість та обсяг скриптів JavaScript
- Відстань від сервера до клієнта
- Швидкість та пропускна спроможність інтернет-каналу по всьому шляху від сервера до клієнта
- Швидкість інтернету клієнта та кількість вільних ресурсів на його пристрої
- Поточна відвідуваність сайту
Дивлячись на цей список ми можемо зробити два очевидні висновки:
- Далеко не на всі фактори ми можемо вплинути
- У нас завжди будуть нестабільні фактори, які не дозволять виразити чіткий час завантаження. На будь-якому сайті завжди будуть коливання швидкості
Найбільш надійний спосіб вимірювання швидкості сайту - це вимірювання інструментами браузера. Браузер точно знає весь процес завантаження, знає, скільки часу у нього пішло на кожен файл і це не якась імітація, а реальне завантаження сайту.
Цей спосіб не ідеальний, але ми можемо його наблизити до ідеалу. Для цього ми маємо виключити можливі “вузькі” місця на стороні клієнта. Іншими словами, на комп'ютері, що проводить тест, повинна бути хороша швидкість інтернету і запас вільних ресурсів, особливо оперативної пам'яті. В ідеалі, тестуючий пристрій має бути в регіоні цільової аудиторії, щоб час проходження сигналу від сервера до клієнта був таким, як буде у реальних користувачів.
Бажано мінімізувати вплив навантаження на сервер сайту, Для цього можна зробити копію сайту на іншому сервері та провести виміри там.
Такий спосіб виміру дає можливість отримати максимально об'єктивну інформацію з чіткою інтерпретацією даних.
Базова оптимізація швидкості завантаження сайту
Існують методики, які відносять до практик оптимізації швидкості сайту, хоча ми віднесли б їх до загальноприйнятих практик розробки сайту. Тобто. це прості речі, які будуть корисні для всіх сайтів і вони не повинні бути опціональними в рамках окремої послуги, все це має впроваджуватись при розробці сайту. Але оскільки це далеко не завжди так, опишемо абсолютно обов'язковий базис кожного сайту щодо швидкості завантаження.
Gzip стиснення
Gzip-стиснення застосовується для стиснення на льоту текстових файлів. Текстові файли на сайті – це файли html, css, js, xml, csv та інші. Компресія відбувається практично миттєво на стороні сервера, а декомпресія також швидко на стороні браузера клієнта. Gzip стискає текстові файли на 50-80%. Однак, це стиснення не є ефективним для зображень та інших вже стиснутих файлів, наприклад архівів.
HTTP/2
Протокол HTTP/2 має багато переваг перед першою версією. Але ми виділимо одне з найбільш значущих.
У першій версії протоколу, браузер міг одночасно завантажувати з одного домену не більше двох файлів, що створювало велику проблему для сайтів із великою кількістю файлів. У HTTP/2 це обмеження знято, що може дати відчутне скорочення часу завантаження сайту.
Кешування на стороні браузера
Коли ви вперше заходите на сайт, браузер завантажує всі необхідні файли для перегляду сторінки. Ці файли він може зберегти у своїй пам'яті (кеші) і при наступних відвідуваннях сайту не завантажувати їх повторно, а брати з кеша, що прискорить завантаження сайту.
Прискорення завантаження сайту
Прискорення завантаження сайту - це складний і різноманітний процес оптимізації бази даних і коду, зменшення обсягу даних, що передаються, поліпшення серверної інфраструктури, використання сучасних технологій і протоколів.
Прискоренням сайту можна займатися практично нескінченно. Не буває максимально прискорених сайтів, завжди можна прискорити ще щось. Але чим більше зроблено роботи з прискорення, тим складніше досягти додаткової оптимізації. Згодом оптимізація стає дедалі дорожчою, а сам ефект оптимізації дедалі менше. Тому у питанні сайтів, як і у всіх інших питаннях, швидкість безпосередньо зав'язана на бюджет.
Для того, щоб ефективно займатися прискоренням, важливо провести якісну діагностику. Якщо сайт має яскраво виражені проблеми зі швидкістю, це не означає, що йому допоможе все, що теоретично може вплинути на швидкість. Наприклад, якщо сайт повільно працює на стороні сервера, оптимізація зображень йому не допоможе.
Прискорення завантаження інтернет-магазину з великою кількістю товарів
Як правило, в інтернет-магазину найповільнішим типом сторінок є сторінка категорії товарів. І чим більше товарів у категорії, тим повільніше вона працює.
Це пов'язано з тим, що на таких сторінках найскладніша програмна логіка. Потрібно відібрати товари конкретної категорії, застосувати до них логіку фільтру товарів, сортування, пейджинації, можливо, ще додаткові умови.
Чим більше товарів, тим більше проявляються проблеми з базою даних та малоефективним програмним кодом.
Ми можемо порівняти це з роботою бібліотеки. Поки у вашій бібліотеці десять книг, ви зможете швидко знайти потрібну, навіть якщо у вас немає жодної сепарації та структури. Але якщо у вас тисячі книг, то вам знадобляться алфавітні, хронологічні та національні покажчики та багато іншого, як, наприклад, журнали видачі та заявок на нові поставки.
Зі зростанням кількості товарів, в інтернет-магазині будуть виявлятися різні проблеми зі швидкістю. Вирішити ці проблеми до їхнього прояву не вийде. Але ви можете виявити їх раніше, ніж зіткнетеся з ними у реальній практиці, за допомогою генерації товарів у ході спеціального тестування. Ми називаємо це краш-тестом. За допомогою нього ми можемо згенерувати контент та імітувати відвідуваність, щоб завчасно підготувати сайт до зростаючих навантажень.
Прискорення завантаження сайту при нестачі серверних ресурсів
Вся програмна логіка сайту потребує обчислювальних потужностей сервера. Якщо сайту не вистачає ресурсів, він починає працювати повільніше.
Найціннішим ресурсом сервера є процесор. Частота процесора відповідає за швидкість обчислень, а кількість ядер відповідає за кількість паралельних обчислень.
У разі нестачі серверних ресурсів, найбільш логічним рішенням буде збільшення їх кількості. Але це рішення має свої обмеження та недоліки.
Вашому сайту може не вистачати ресурсів, які надаються хостерами в рамках стандартних пропозицій. Ви можете запросити індивідуальні пропозиції та вам їх нададуть, аж до надання кількох серверних шаф. Але за такі пропозиції вам доведеться платити дуже дорого.
При нестачі серверних ресурсів, питання не завжди стоїть у кількості ресурсів. Іноді проблема може бути в тому, як ці ресурси використовуються.
У більшості випадків, коли до нас звертаються щодо повільної роботи сайту, розміщеного на VPS, ми бачимо, що сервер ніхто не налаштовував. Налаштування сервера – це великий пласт оптимізації, що дозволяє значно збільшити продуктивність сервера.
Також часто бувають застарілі операційні системи або навіть обмежені проміжні видання. Операційну систему сервера потрібно періодично встановлювати заново.
Робота з налаштуваннями сервера та оптимізацією програмного коду сайту можуть значно скоротити ваші витрати на сервери.
Оптимізація зображень
Зображення - як і інші медіа-файли є найбільш об'ємними файлами на сайті. Тому дуже важливо ретельно підходити до оптимізації зображень, щоб вони не стали причиною повільної роботи сайту.
Із зображеннями бувають три види проблем:
- Зображення занадто великі
- Непідходящий формат зображень
- Відсутнє зображення для мобільної версії сайту
Оптимізація розміру зображень
Всі способи оптимізації зображень так чи інакше ведуть до того, щоб зменшити обсяг файлів, що передаються. Але перш за все, потрібно переконатися, що ваші зображення відповідного розміру за шириною та висотою.
Іноді зображення на сайт завантажують прямо з камери або після базової конвертації із raw-формату у формати для web. І на сайті можна побачити зображення завширшки 10 тисяч пікселів, при тому що на сайті воно відображається у розмірі 400 пікселів. Це забезпечує кілька зайвих мегабайт на кожному файлі.
Буває і зворотна ситуація, коли знаходять в інтернеті зображення шириною 400 пікселів і використовують його як банер шириною 1920 пікселів. Внаслідок такого розтягування зображення, воно сильно втрачає якість.
Ширина та висота ваших зображень мають бути такого розміру, в якому вони відображаються на сайті.
Оптимізація формату зображень
Є багато форматів зображень, які підходять для сайту. Не можна сказати, що один із них ідеальний. Кожен формат має свої особливості і кожен з них доречно використовувати, якщо вам потрібні ці особливості.
SVG - це векторний формат, що підтримується браузерами. По суті, це текстовий формат і файли містять координати фігур і їх колір. Формат підходить для простих іконок та логотипів.
GIF - найменш поширений формат зображень для сайту. Цей формат підтримує анімацію і його варто використовувати лише тоді, коли ця анімація необхідна.
JPG - найпоширеніший формат для сайту. Формат піддається серйозному стиску, але це стиснення відбувається з втратами якості. Іноді ці втрати можуть бути непомітні оку, іноді може статися спотворення кольору, якщо стискати дуже сильно, то зображення втрачає чіткість.
Завдяки ефективному стиску, файли у форматі jpg можуть займати менше місця, ніж переважна більшість інших форматів. JPG не підтримує прозорість.
Формат підходить для відображення більшості зображень на сайті, таких як фотографії та банери.
PNG - це формат, який підтримує стиск без втрат. Тобто, зображення завжди зберігає свої кольори та чіткість, але стиснення без втрат не дуже ефективно. Файли у форматі png займають багато місця завдяки високій якості, а ще цей формат підтримує прозорість.
Використовуйте цей формат, якщо потрібно розмістити зображення на прозорому фоні або якщо для зображення неприпустимо втрати якість (наприклад, портфоліо фотографа, фотографії елітних товарів).
WebP - це відносно новий формат, розроблений у Google. Формат увібрав у собі переваги всіх вищезгаданих форматів. Він підтримує анімацію і при цьому займає менше місця, ніж gif. Формат підтримує стиск із втратами і при цьому може займати менше місця, ніж jpg. Він також підтримує стиск без втрат і прозорість і при цьому займає менше місця, ніж png.
Все виглядає так, начебто цей формат ідеальний. Можливо, він таким стане. Але через погану підтримку не всі переваги формату ще доступні.
Йдеться не про підтримку браузерів, у браузерах формат уже давно підтримується. І не про підтримку на стороні CMS, оскільки в останніх версіях більшість популярних двигунів вже підтримують роботу з ним. Йдеться про підтримку у графічних редакторах.
Google створив формат, але забув створити професійний редактор. Фотошоп не підтримує роботу з цим форматом, хоча для останніх версій вже доступний плагін, що додає цю підтримку. Але якщо у вас більш ранні версії, то працювати з цим форматом ви не зможете. Якщо у вас немає профільного інструменту для роботи з цим форматом, то вам залишається лише використовувати онлайн конвертери.
Суть у тому, що важливий не просто факт наявності зображення в якомусь форматі, важливо мати можливість керувати стисненням. Конвертери не дають можливості керувати стисненням і в результаті розмір файлу у форматі WebP часто виходить більше, ніж у форматі jpg.
Нижче наведено приклади двох файлів, створених з одного вихідного файлу. Один з них конвертований у формат WebP, а інший збережений у фотошопі з налаштуваннями стиснення.
Візуально, зображення не відрізняються, але файл у jpg займає втричі менше місця, ніж WebP.
Google хоче розкрутити свій формат і скрізь пише рекомендації щодо його використання, але не варто поспішати використовувати його, якщо у вас немає професійного інструменту для роботи з ним, інакше ви уповільните швидкість завантаження сайту.
Оптимізація зображень для мобільної версії сайту
Переважна більшість сайтів мають невиправдано великий розмір зображень на мобільних пристроях.
Особливо великою проблемою це стає у разі великих фонових зображень або банерів, які передбачають великий розмір зображень.
Така ситуація не дивна, оскільки CMS не дають можливості керувати файлами для різних пристроїв з адмінки.
У разі фонових зображень все набагато простіше, оскільки ними можна керувати через css. Але з банерами все складніше. Банери рідко реалізують як фонові зображення, а тому керувати ними через css не вийде. І навіть якщо було б можна, у адміністраторів сайту, рідко є навички для цього, а банери змінюються набагато частіше за фонові зображення сайту і адміністратору потрібна можливість ними керувати. Більш того, у випадку з банерами, для мобільних пристроїв часто потрібно не просто менше зображення, часто потрібно зображення з іншим співвідношенням сторін, щоб доступно розмістити контент банера. Тому дуже важливо доопрацювати можливість керування банерами для різних типів пристроїв.
Жертви оптимізації швидкості завантаження сайту
Питання швидкості завантаження сайту з кожним роком стає все більш актуальним. Але фахівців, які детально розуміють цю проблематику, не багато. Це призводить до застосування марних чи навіть шкідливих рішень для оптимізації.
Дуже важливо розуміти, що впливає на швидкість і в чому конкретно проблема сайту, але не менш важливо розуміти, як працює те рішення, яке ви застосовуєте.
Ми опишемо найпоширеніші рішення, які застосовують для сайтів і при цьому створюють проблеми, часом у несподіваних місцях.
Кешування сторінок на стороні сервера
Коли сервер отримує від браузера команду відкрити якусь сторінку, сервер обробляє програмний код цієї сторінки, збирає інформацію з бази даних, формує html-документ та відправляє його браузеру. Час за який відбуваються ці процеси називають часом відповіді сервера.
Для того, щоб сильно мінімізувати час відповіді сервера, іноді застосовують кешування сторінки. Тобто сформований html-документ зберігається в пам'яті сервера (кеші) і при наступних запитах цієї сторінки сервер просто віддає готовий документ не обробляючи знову весь процес.
На перший погляд, це може здатися добрим рішенням. Дуже багато хто рекомендує застосовувати цей вид кешування, але не все так просто.
Ми не вважаємо кешування сторінок прискоренням роботи сайту, оскільки ми не оптимізували процес, а змінили його. Це можна порівняти з перевезенням автомобіля на евакуаторі. Чи скажете ви, що прискорили автомобіль, якщо евакуатор може їхати швидше за нього?
У такого кешування є побічні ефекти.
Якщо на сайті багато сторінок, то в якийсь момент на пошук потрібної сторінки в кеші може почати витрачатися більше часу, ніж на генерацію сторінки.
Якщо використовується кешування, то не запитується актуальна інформація про сторінку і вона може видаватися з некоректними даними. Наприклад, у товару змінилася ціна або товар закінчився, а на сайті продовжує стояти статус “в наявності”.
Ці побічні ефекти можна мінімізувати та оминути, але на це може знадобитися більше зусиль, ніж на реальне прискорення роботи сайту.
Модулі конвертації зображень у формат WebP
Google активно просуває свій формат WebP і скрізь, де може рекомендує його використовувати.
Про проблеми, пов'язані з використанням цього формату, вже писали вище у розділі про формати зображень.
Звісно, надивившись на ці рекомендації, більшість власників сайтів хочуть використати цей формат. І в мережі є безліч різних модулів та плагінів, які дають можливість використовувати цей формат практично на будь-якій CMS. Але мало хто вникає у те, як це працює. В результаті, у сайтів з'являється проблем більше, ніж було.
Почнемо з того, що такі конвертери для сайтів неефективно стискають зображення, внаслідок чого зображення починають займати більше місця, ніж раніше.
Багато сторонніх рішень для конвертації, не забезпечують заміну вже існуючих на сервері файлів jpg на WebP. Вони зберігають і класичний формат і WebP. А це в свою чергу призводить до того, що зображення починають займати більш ніж подвійний об'єм на сервері.
У файлових систем на диску є індексні вузли (inod). Кожен файл або папка має inod, який є унікальним ідентифікатором. Кількість inod на диску обмежена, навіть якщо на сервері будуть лише порожні папки та файли з нульовим розміром, при досягненні ліміту по inod, ви не зможете більше нічого записати на диск.
Якщо ваш модуль підтримки формату WebP подвоює кількість зображень, то вам варто контролювати не лише обсяг файлів, а й кількість inod.
На одному проекті ми зустріли модуль, який не лише створював файли WebP, а й організовував каталог зберігання. В результаті такої організації він створив лише папок понад 90 тисяч. При тому що на сайті було близько 10 тисяч товарів.
Внаслідок такої оптимізації, у сайту з'явилися важчі файли у форматі WebP, було зайнято багато зайвого місця на диску і сайт досяг лімітів сервера по inod.
Мінімізація текстових файлів
Всі файли сайту, окрім медіафайлів, є текстовими.
Дуже часто ми зустрічаємо рекомендації щодо мінімізації таких файлів. Йдеться про видалення відступів та переносів рядків.
Чи багато можна заощадити таким чином?
Насправді, не мало. Для прикладу наведу одну з найпоширеніших бібліотек для сайтів Bootstrap. У звичайному стані цей файл займає 281 kB, а в мінімізованому - 233 kB. Різниця складає 48 kB, що не так і мало.
Але ми повинні розглядати всі наші оптимізації у комплексі, а не у вакуумі.
Стандартною практикою є використання Gzip-стиснення, про яке ми писали вище. Так ось, після стиснення файл нашої бібліотеки у звичайному стані займає 33,5 kB, а мінімізованому - 30,9 kB. Різниця – 2,6 kB.
Так, математично різниця є, але в реальності, в контексті прискорення завантаження сайту, це нам нічого не дасть. І потрібно врахувати, що приклад ми навели з великим файлом бібліотеки, більшість файлів сайту будуть разів в 10 менше. І якщо це файли, з якими працюють розробники, то мінімізований варіант дуже ускладнить роботу, що позначиться на вартості послуг.
Оптимізація PageSpeed Insights
Незважаючи на всю свою абсурдність, про яку писали вище, PageSpeed залишається найпопулярнішим ресурсом, за допомогою якого люди намагаються оцінити швидкість сайту. Звісно, всі прагнуть отримати найкращий результат.
У PageSpeed є утиліта для автоматичної оптимізації. Її можна встановити на сервер, вона також часто буває вбудована у функціонал хостингу. Варто її увімкнути, як ваш сайт покаже найкращі результати.
Якщо вам пропонують швидко і дешево прискорити сайт, то, швидше за все, йдеться саме про цей метод.
Але для того, щоб зрозуміти чи хороша ідея використовувати подібні оптимізатори, потрібно зрозуміти, як вони працюють.
Ця оптимізація відбувається в момент завантаження сторінки, що досить сповільнює процес. При цьому, файли на сервері не перезаписуються. Тобто, сайт залишається без змін. Оптимізовані файли зберігаються в кеші, що призводить до проблеми, яку ми описували вище в розділі про кешування сторінок.
Але при кожному очищенні кеша або якщо кеш переповнений, сторінка завантажуватиметься значно повільніше через процес “оптимізації”.
CDN
Використання CDN - одна з найпоширеніших рекомендацій щодо прискорення сайту. На жаль, ми дуже рідко зустрічаємо тих, хто це використовує і при цьому розуміє, що це і чи потрібно йому це.
Давайте спробуємо розібратися в цьому.
CDN (Content Delivery Network) — це розподілена мережа серверів, призначена для доставки контенту користувачам з мінімальною затримкою та максимальною швидкістю за рахунок скорочення відстані від користувача до сервера. CDN використовується тільки для статичних файлів, таких як зображення, відео, css, js, xml та ін.
Іншими словами, якщо ваш сервер розташований в Україні, а цільова аудиторія у Сполучених Штатах, то використання CDN у штатах прибере необхідність передавати велику кількість файлів через половину планети.
При цьому варто розуміти, що незважаючи на те, що завантаження файлів прискориться, сам сайт (динамічний контент) почне працювати трохи повільніше, оскільки до формування сторінки додаються додаткові умови.
Якщо ваш сайт розміщений в Україні як і цільова аудиторія, то вам навряд чи потрібен CDN, але якщо ви все ж таки хочете його використовувати, то вам потрібна мережа CDN саме в Україні, а не в Китаї.
Але в більшості випадків, CDN - це необхідність для міжнародних проектів.
Які методики прискорення сайту ми застосовуємо?
Запорукою швидкого сайту є добре спроектована та оптимізована база даних сайту, якісний та швидкий програмний код, потужний та добре налаштований сервер, а також мінімальний розмір файлів, що передаються між сервером та браузером клієнта.
Залежно від того, в чому саме причина повільної роботи сайту, підбираються методики прискорення. Ми маємо повний спектр актуальних методик прискорення сайту як на стороні сервера, так і на стороні браузера. А також у нас є свої авторські інструменти та методики.
Наприклад, ми розробили методику прискорення сайту шляхом створення гібридної системи. Суть цієї методики полягає в тому, що ми підключаємо до сайту додатковий швидкий двигун і передаємо йому функцію відображення фронтенда. В результаті, ви продовжуєте керувати сайтом через адмінку базового двигуна, але публічна частина працює на іншому швидкому двигуні. У разі потреби таким чином можна оптимізувати не весь сайт, а лише окремі повільні типи сторінок.
Ця методика дозволяє значно скоротити час відповіді сервера сайту, працюючого майже на будь-якому двигуні.
Замовити прискорення сайту в студії WEB ROOM
Ми маємо експертизу та багаторічний досвід у прискоренні сайтів. Наша команда розробників має глибокі знання з оптимізації продуктивності і знає, які стратегії та інструменти застосовувати для досягнення найкращих результатів.
Ми цінуємо індивідуальність кожного сайту. Ми проведемо ретельний аналіз вашого сайту з огляду на його особливості, структуру, використовувані технології та інші фактори, щоб розробити найефективніші стратегії оптимізації, які підійдуть саме вашому проекту.
Наш арсенал включає власні інструменти та напрацювання для аналізу швидкості та оптимізації сайтів, що дозволяє нам проводити глибокий та точний аналіз продуктивності вашого сайту та застосовувати передові методи для його покращення.
Після проведення робіт з прискорення ми надамо вам детальний звіт про виконану роботу. Ми зосереджені на наданні конкретних порад та рекомендацій, які допоможуть вам підтримувати високу продуктивність вашого сайту у довгостроковій перспективі.
Вибираючи команду WEB ROOM для прискорення вашого сайту, ви можете розраховувати на високий рівень якості, професіоналізму та результативності. Ми прагнемо забезпечити швидку та ефективну роботу вашого сайту, щоб ви могли досягти своїх цілей та задовольнити очікування ваших користувачів.
FAQ
Чому швидкість завантаження сайту така важлива?
Швидкість сайту впливає на позиції сайту в пошуковій видачі, на конверсію та лояльність користувачів, на стійкість сайту до атак та на витрати на сервери.
Як дізнатись швидкість сайту?
Для того, щоб дізнатися про швидкість роботи вашого сайту, достатньо замовити у нас тестування і ми надамо розгорнутий звіт щодо швидкості сайту.
Чи можете ви покращити оцінку PageSpeed Insights?
Поліпшення оцінки та прискорення сайту – це різні процеси. Ми не беремося за покращення оцінки, оскільки не зрозумілий алгоритм формування оцінки. Але ми можемо виконувати його рекомендації, але це далеко не завжди призводить до покращення оцінки.
Чи можете ви зменшити час відповіді сервера?
Так, ми сеціаліруемся на цьому і можемо значно зменшити час відповіді сервера будь-якого сайту.
Залишилися питання?
Якщо ви хочете отримати консультацію або дізнатися трохи більше про наші послуги, будь ласка, напишіть нам, і хтось із нашої команди зв'яжеться з вами найближчим часом.