Зачем магазину на CS-Cart нужен CDN и как подключить Yandex Cloud CDN
Пока интернет-магазин небольшой, скорость загрузки изображений, шрифтов, стилей и прочего статического контента редко выглядит проблемой.
Когда каталог растёт, картина меняется. На витрине прибавляются фото, промо-блоки, стили, скрипты, шрифты и другие файлы, которые браузер должен скачать до нормальной работы страницы.
Если всё идёт с основного сервера, он одновременно обрабатывает каталог, корзину, заказы, фильтры, личный кабинет и ещё раздаёт статический контент каждому посетителю.
На малом трафике это почти не видно. Но большой каталог, реклама, сезонная акция или аудитория из разных регионов быстро показывают слабое место: страницы грузятся дольше, а сервер занят лишней работой.
В таком случае на помощь приходит CDN.
Что такое CDN и зачем он нужен интернет-магазину
CDN — сеть доставки контента. Её задача простая: отдавать статические файлы магазина не напрямую с основного сервера, а через отдельную инфраструктуру.
Фотографии, CSS, JavaScript, шрифты и другие публичные файлы кешируются на стороне CDN. Покупатель получает их с CDN-серверов, а не каждый раз с вашего хостинга.
Основной сервер в это время меньше отвлекается на раздачу файлов и больше ресурсов оставляет для CS-Cart: каталога, корзины, оформления заказа, фильтров и личного кабинета.
Для магазина это даёт несколько практичных плюсов:
- страницы открываются стабильнее;
- снижается нагрузка на основной сервер;
- покупателям из разных регионов проще загрузить нужные файлы;
- магазин спокойнее проходит всплески трафика;
- тяжёлая витрина меньше давит на хостинг;
- меньше риск потерять оплаченный рекламный трафик из-за долгой загрузки.
CDN не превращает магазин в быстрый одним переключателем. Но он закрывает заметный кусок работы: доставку статики.
Почему это особенно заметно в CS-Cart
CS-Cart — не набор статичных HTML-страниц. В живом магазине есть категории, фильтры, изображения товаров, баннеры, тема оформления, сторонние модули, JavaScript-компоненты и дополнительные стили.
Чем тяжелее витрина, тем больше файлов браузер тянет при открытии страницы.
Особенно это заметно, если:
- каталог уже большой;
- у товаров по несколько изображений;
- используются баннеры и промо-блоки;
- в теме много CSS и JavaScript;
- подключены дополнительные модули;
- магазин работает на Multi-Vendor и каталог растёт за счёт продавцов;
- аудитория приходит из разных городов и регионов.
В такой схеме статика становится отдельной нагрузкой. Сервер одновременно обслуживает CS-Cart и отправляет посетителям изображения, стили, скрипты, шрифты и прочие файлы.
CDN выносит эту часть работы за пределы основного сервера.
Сайт для покупателя остаётся тем же. Меняется маршрут части файлов: они приходят через CDN-инфраструктуру. Для владельца это более ровная нагрузка и предсказуемая доставка статики.
Какие файлы можно отдавать через CDN
Через стандартные настройки CS-Cart на CDN можно перевести публичную статику витрины.
Обычно через CDN отдаются:
- изображения товаров;
- изображения категорий;
- баннеры;
- CSS-файлы;
- JavaScript-файлы;
- шрифты;
- другие публичные статические файлы магазина.
Файлы не переезжают из магазина навсегда. Они остаются на сервере, но браузер покупателя может получать их через CDN-домен.
Например, картинка товара загружается не напрямую с основного сервера, а через CDN.
Чем больше изображений и промо-материалов на витрине, тем заметнее польза.
Когда магазину стоит подключить CDN
CDN стоит рассматривать, когда магазин уже вырос из формата небольшого сайта с несколькими товарами.
Чаще всего он полезен, если:
- в магазине сотни или тысячи товаров;
- у товаров много фотографий;
- страницы категорий и карточки товара открываются медленнее, чем хотелось бы;
- на витрине много баннеров, стилей, скриптов и шрифтов;
- покупатели приходят из разных регионов;
- есть заметная нагрузка на хостинг;
- скорость проседает во время акций или сезонных всплесков;
- важны скорость загрузки и показатели для поисковых систем;
- нужно убрать с основного сервера раздачу статики.
Отдельная история — реклама. Если человек пришёл из платного канала, а карточка товара открывается слишком долго, часть бюджета просто уходит в пустоту. Покупатель не обязан ждать, пока магазин покажет товар.
CDN снижает этот риск именно на уровне доставки файлов.
Как модуль Yandex CDN помогает подключить CDN к CS-Cart
Для подключения Yandex Cloud CDN к CS-Cart я разработал модуль Larionov.tech: Yandex CDN для CS-Cart.
Модуль добавляет поддержку Yandex Cloud CDN в стандартный раздел CS-Cart:
Администрирование → Хранилище данных → Настройки CDN
После установки и настройки магазин может отдавать статику через Yandex Cloud CDN и отдельный CDN-домен.
Переделывать логику магазина и вручную переносить файлы не нужно. Модуль подключается к стандартному CDN-механизму CS-Cart и добавляет Yandex Cloud CDN как вариант для доставки статики.
Что делает модуль:
- добавляет Yandex CDN в стандартные настройки CDN;
- даёт указать CDN-домен;
- переводит изображения, CSS, JavaScript, шрифты и другую статику на отдачу через CDN;
- снижает нагрузку на основной сервер при раздаче статических файлов;
- подключает инфраструктуру Yandex Cloud CDN к магазину на CS-Cart.
Итог простой: CS-Cart продолжает работать как раньше, а статика отдаётся через CDN-домен.
Что нужно подготовить перед подключением
Модуль подключает к CS-Cart уже подготовленный CDN-ресурс в Yandex Cloud.
Перед включением CDN нужно подготовить инфраструктуру:
- создать CDN-ресурс в Yandex Cloud;
- настроить источник файлов;
- выпустить SSL-сертификат;
- настроить DNS у вашего DNS-провайдера;
- подготовить CDN-домен;
- указать CDN-домен в настройках CS-Cart;
- очистить кеш CS-Cart и CDN после настройки;
- проверить, что изображения и статические файлы корректно отдаются через CDN.
Это одноразовая подготовка перед запуском.
Сделать её можно самостоятельно. Но на практике ошибки чаще всего появляются именно здесь: DNS, SSL-сертификат, домен, источник, кеширование.
Если не хочется тратить на это время, я могу настроить связку полностью.
CDN и оптимизация скорости: в чём разница
CDN помогает со скоростью, но не заменяет полноценную оптимизацию производительности.
Он ускоряет и стабилизирует доставку:
- изображений;
- CSS;
- JavaScript;
- шрифтов;
- баннеров;
- других публичных файлов витрины.
Но CDN не чинит весь магазин.
Если на сайте тяжёлые изображения, перегруженный шаблон, блокирующие скрипты, медленные SQL-запросы, проблемные модули или слабый сервер, это всё равно придётся разбирать отдельно.
Лучше смотреть на CDN как на один из уровней оптимизации.
Его зона ответственности — статика. Полная работа со скоростью может включать аудит шаблона, изображений, модулей, серверной части, базы данных, кеширования и клиентской загрузки.
CDN не кнопка «ускорить всё». Зато для магазина с большим количеством изображений и статических файлов это логичный шаг.
Настройка Yandex Cloud CDN для CS-Cart под ключ
Если не хочется самостоятельно разбираться с Yandex Cloud, DNS, SSL-сертификатами и настройками CS-Cart, я могу подключить CDN под ключ.
Я официальный партнёр Yandex Cloud и могу подготовить всю связку:
- создать и настроить CDN-ресурс в Yandex Cloud;
- подобрать и настроить CDN-домен;
- настроить DNS;
- подготовить SSL-сертификат;
- подключить CDN в CS-Cart;
- проверить отдачу изображений и других статических файлов;
- убедиться, что витрина продолжает работать корректно после подключения.
В результате вы получаете не просто установленный модуль, а рабочую схему:
Yandex Cloud CDN + CDN-домен + SSL + DNS + магазин на CS-Cart.
Если магазин уже тормозит, можно отдельно провести аудит скорости и понять, где узкое место: статика, изображения, шаблон, модули, сервер или база данных.
Нужна помощь с подключением CDN?
Если хотите понять, нужен ли CDN вашему магазину на CS-Cart, напишите мне.
Я посмотрю витрину, количество изображений и статических файлов, текущую схему загрузки и скажу, что разумнее делать сейчас: подключать Yandex Cloud CDN или сначала разбираться с другими проблемами скорости.
Telegram: https://t.me/larionov_tech
Канал: https://t.me/larionovtech
Max: https://max.ru/u/f9LHodD0cOLdN6ZKkMm6PbZAkOe2HwsW5t1WnB9fYWg6Brd1Say9rYSZ_vE
Сайт: https://larionov.tech/