Чим корисне кешування сайту та як його настроїти

Чим корисне кешування сайту та як його настроїти

Кешування сайту – функція, яка спрощує обробку та видачу даних на сторінці. Замість виконання тисяч запитів та обчислень, сторінка «дістає» дані з кешу. Сторінка завантажується швидко і за менших потужностей.

Для власників сайту кешування призводить до покращення SEO та usability сайту. У статті розглядаємо, які види кешування є та як включити кешування на сайті.

Що таке кешування

Заглибимося в IT-термінологію. Припустимо, що у вас є сайт із картками товарів. Якщо їх не багато, скажімо, в районі 10-15 сторінка завантажиться швидко і користувач розгляне його. Але якщо товарів сотні, то сервер завантажуватиме кожен компонент, що затягнеться при об’ємних файлах. Користувач піде, так і не дочекавшись завантаження.

При першому відвідуванні запит обробляється та клієнт бачить сторінку. При включеному кешуванні запит зберігається в оперативній пам’яті. Тобто коли сервер отримує повторний запит на сторінку, він не завантажує її заново, а «дістає» з пам’яті і відправляє користувачеві.

Сторінки зберігаються як HTML-файла. Що більше файлів, то більше оперативної пам’яті потрібно.

Взяття готового HTML-файлу відбувається швидше, ніж обробка та створення нового. Тому кешування пришвидшує роботу сторінки. Задоволений користувач серфіт і вибирає продукти, а продавець радіє, що користувачі не відвалюються.

Декілька термінів для розуміння

  • Вихідний сервер – місце, де спочатку знаходиться сторінка. Саме з ним працює адміністратор та додає до нього контент. У вихідному сервері визначається політика кешування, в яку входить таймер, коефіцієнт попадання в кеш та інші параметри.
  • Коефіцієнт влучення в кеш – частка вилучення контенту. Буквально це відношення кількості запитів, взятих із кешу, до загальної кількості запитів.
  • Свіжість кешу – параметр, який визначає актуальність контенту та сторінки. Задається політикою кешування.
  • Валідація – перевірка контенту для уточнення актуального контенту.
  • Інвалідація — видалення вмісту раніше терміну нового кешування. Простими словами це ручне збереження нової версії сторінки.

Види кешування

Існують різні механізми збереження та оновлення. Давайте розберемося з їхніми видами.

У браузері

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

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

В основному браузери зберігають легкі файли, картинки та http-сторінки.

На сервері

Під серверним кешуванням розуміються всі види кешування, коли дані зберігаються на серверній стороні. Ці дані не доступні клієнтським браузерам.

Серверне кешування можна розділити на кілька рівнів. Ходімо від простого до складного.

Для збереження статичних елементів, як код сторінки, адміністратори встановлюють зовнішні сервери. Або, по-айтішному, проксі-сервери. На проксі сервер завантажується статична сторінка. Після цього він перехоплює запити від користувачів і видає їм сторінку з кеша. Можна завантажити динамічні елементи, але це потребує великої оперативної пам’яті.

Саме на проксі діє політика кешування. Щоб настроїти зміни та перевірку свіжості контенту, адміністратор визначає політику та підключає до неї проксі.

Створення CDN

Коли компанія розростається до колосальних масштабів, звичайного проксі стає недостатньо. Створюється мережа проксі-серверів або CDN.

CDN – мережа доставки контенту, яка розташовується у всьому світі. Наприклад, на сайт хоче зайти користувач із Африки, проте наші потужності перебувають у США. Щоб скоротити час очікування, логічно поставити ще один проксі із кешем у регіоні Африки. Так, мережа розростається, щоб кожному користувачеві було комфортно користуватися сайтом.

На сервері можна кешувати більший обсяг даних, ніж у браузері. Наприклад, кешування сторінки повністю, php-файлів та окремих блоків сторінки.

У WordPress: плагіни кешування

Найпопулярніші плагіни – WP Super Cache, W3 Total Cache та Autoptimize. Їх завантажили понад 1 млн разів.

Коротко відзначимо переваги кожного плагіна:

  • WP Super Cache – простий у використанні, відмінно підходить для новачків. Гнучкі налаштування дозволяють відзначити необхідні блоки для кешування.
  • W3 Total Cache – крім кешування, плагін дозволяє налаштувати SEO та оптимізувати сайт. Однак у роботі він складніший, ніж попередній.
  • Autoptimize — плагін використовується для роботи з JavaScript та CSS. Найскладніший із трійці.

Налаштувати плагіни можна за інструкціями у спільноті WordPress. Зазначу, що краще використовувати один із них, а не всі 3 одночасно. Спільне використання може зламати код, і тоді вашу сторінку перестануть показувати користувачам.

У WordPress: кешування за допомогою хостингу

Системи хостингу працюють на фундаментальнішому рівні, ніж плагіни. Тобто, вони кешують статичні елементи, що ефективніше і менше ресурсів.

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

WordPress: кешування через код

Спосіб досить простий. За допомогою майданчика можна вписати функцію кешування відразу на сторінку. Декілька рядків коду будуть виконувати ту ж функцію, що й сторонні плагіни.

Метод для рядового користувача. Написання коду дає перевагу: не потрібно скористатися сторонніми сервісами. Проте правильно прописати кешування в сторінку та провести перевірку кешування сайту може лише досвідчений програміст.

Що робити, якщо періодично змінюєш контент

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

До статичним відносяться постійні елементи. Це структура сторінки та код деяких блоків.

До динамічних відносяться елементи, які творець сторінки часто змінює. Сюди можна віднести текст, картинки та стилі.

Що відбувається, коли змінюємо елементи

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

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

Рекомендації щодо настроювання політики кешування

Перш ніж налаштовувати кешування, потрібно розробити політику. Вона визначає елементи кешування та таймер.

Нижче наведено загальні рекомендації для створення власної політики:

  • Створіть окремі бібліотеки елементів. Створення структури від початку — правильний крок до простоті системи у майбутньому. Розмістіть зображення окремо від CSS-блоків та інших елементів сайту. Посилатися на теку простіше, ніж на весь архів.
  • Зробіть однаковий шлях на ті самі елементи. Шлях називається URL, і кеш буде працювати швидше, якщо використовувати той самий шлях при оновленнях.
  • Використовуйте валідацію. Простіше автоматизувати процес завантаження, ніж постійно виконувати його своїми руками. Якщо написати грамотний код, вам не доведеться думати, як відключити кешування на сайті.
  • Не потрібно кешувати всю сторінку. Збереження кожного об’ємного елемента призведе до швидкого заповнення бази даних. Краще кешувати статичні елементи, а динамічні підвантажувати з бази даних.
  • Подбайте про власний сервер. Краще зберігати дані у себе, щоб уникнути втрат. Також із власного сервера завантаження та відгук будуть швидше. Не забудьте про резервне сховище.

Переваги кешування

Покращення зручності використання сайту

Завантаження з кешу зменшує час відповіді. До того ж розташування проксі-сервера близько до користувача або завантаження контенту з браузера скорочує час обробки.

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

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

Скорочення витрат на бази даних

При кешуванні не потрібно зберігати великі обсяги в базі даних. Її можна розвантажити та використовувати ресурси для більш важливих рішень, а навантаження перенести на браузер.

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

Підвищення продуктивності сайту

Використання кешу дає можливість вичавити зі сторінки максимум. Коли основні структурні елементи можна взяти з кешу готовими серверу залишається завантажити тільки динамічні елементи.

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

Зниження навантаження на сервер

При великому завантаженні сайту підвантаження контенту з кешу не дає впасти серверу через перевантаження. Тому легко розвантажити вихідні потужності установкою проксі.

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

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

Кешування у браузері клієнта: корисно чи ні?

Ще раз розглянемо кешування у браузері користувача.

Крім показаного HTTP-кешування, існують такі техніки, як PWA та Service Workers. Останній працює на стороні користувача та дозволяє кешувати прямо у браузері без сторонньої допомоги.

Перевага кешування у швидкості завантаження ресурсів. При повторному запиті сторінки або зображення час на завантаження цих ресурсів дорівнює нулю. Т. е. ми їх просто не завантажуємо зовсім, а беремо з кешу на стороні клієнта. Крім того, клієнти заощаджують трафік, що особливо актуально для мобільних пристроїв. Основним недоліком кешування є те, що буває дуже складно відстежити свіжість, тобто коли кеш стає неактуальним. У такому разі нам потрібно завантажити нову версію ресурсу (наприклад, картинки, js або css файли), але з різних причин клієнт може отримувати стару версію ресурсу. Це може бути серйозною проблемою.

Налаштування кеша в різних браузерах універсальна. Навіть за допомогою простої технології користувачі бачитимуть одну сторінку з різних браузерів.

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

Що зрештою?

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

Політика кешування допомагає визначитися з вмістом на сторінці. Як часто його змінювати, що додавати, а який контент уже застарів — все можна додати до політики.

Пам’ятайте, що не варто кешувати кожний об’єкт. Це лише ускладнить роботу та призведе до перевантаження бази даних.