02.07.2014
Ускорение сайта в 100 раз
Как сделать сайт композитным?
Удачная комбинация статики и динамики
Секрет технологии - в оптимальном сочетании скорости загрузки статического сайта и возможностей динамического сайта. Именно эта связка дает ускорение в х100 раз!
Композитный сайт
Как все работает:
- Страница разделяется на 2 составляющие: динамическую и статическую
- Статическая часть кешируется и отображается мгновенно
- Динамическая часть подгружается в фоновом режиме и кешируется в браузере посетителя
Что происходит?
- Разработчик разделяет компоненты на статические и динамические
- Включает композитный режим
- При первом запросе готовая html страница сохраняется на диск
- При следующих запросах статическая часть отдается с диска мгновенно, а динамическая подгружается в фоновом режиме
Но вам совершенно не нужно знать тонкости технологии. Обратитесь к нам и мы сделаем это для вас!
Карточка товара
Карточка товара: композит включен!
Важнее видеть, что ваш сайт заработал быстрее!
Каталог товаров
Раздел каталога: композит включен!
Как включить композитный режим?
Быстро с «1С-Битрикс»
Чтобы сайт заработал в композитном режиме, обратитесь к нам. На всех страницах вашего сайта появится симпатичная кнопка «Быстро «с 1С-Битрикс». Это значит, что композитный режим заработал.
Быстро с «1С-Битрикс»
Кнопка органично вписывается в дизайн любого сайта. Вы можете выбирать дизайн и цвет.
Цвет и вид - на выбор
Каждый сайт может стать композитным!
Любой сайт на платформе «1С-Битрикс» может быть разработан по композитной технологии!
Почему «композитный»?
Страница – композитный материал
Как работает композитный режим? Представьте, что страница сайта – композитный материал. Слои - это динамические и статические данные. Сначала мгновенно подгружаются слои - javascript, css, html и графика. Пользователь сразу видит всю страницу и контент - он не ждет. А динамический слой данных подгружается в фоновом режиме.
Композитный материал, композит (англ. composite)— искусственно созданный неоднородный сплошной материал, состоящий из двух или более компонентов с четкой границей раздела между ними.
В результате совмещения элементов и матрицы образуется композиция, отражающая как исходные характеристики компонентов, так и новые свойства, которыми изолированные компоненты не обладают. Создается новое качество.
Новая схема – «композитные страницы»
Существующий функционал HTML-кеширования позволяет добиться значительного ускорения загрузки страниц, но имеет ряд недостатков.
«Тормоза» HTML-кеширования:
- Страницы из кеша обновляются только вытеснением по объему или удалением всего кеша
- Сайт превращается в HTML и лишается всей функциональности «старших» редакций продукта
- Для пользователей с сессией, тем более авторизованных, кеширование просто не работает
Убираем слабые звенья
Композитная технология включила в себя все преимущества HTML-кеширования и убрала его недостатки.
Почему некомпозитный сайт открывается долго? Система обращается к базе данных, собирает какую-то информацию, что-то «подтягивает» компонентами. На подобную «сборку» уходит много времени. Страница отдается клиенту, только когда все собрано вместе. Самое слабое звено определяет скорость отдачи страницы.
Композитный режим выполнения страницы
Статическая часть кэшируется и отображается мгновенно
Разделяем страницу на две составляющие: статическую и динамическую
Разделяем страницу на две составляющие
Динамические:
- Рекламные баннеры
- Цены, скидки
- Строка корзины
- Топ новостей
Динамическая часть подгружается в фоновом режиме и кэшируется в браузере посетителя
В закешированной HTML странице в месте динамических блоков вставляется плейсхолдер с закешированной информацией (новости) или контентом по умолчанию (строка корзины).
Здесь будут плейсхолдеры
После загрузки страницы запускается асинхронный AJAX запрос на сервер на этот же URL, но с дополнительным признаком (чтобы не попасть опять в кеш).
Схема работы: Первый хит
Система собирает первый кеш
При первом заходе на страницу система создает копию (снимок, кеш) этой страницы. Это готовые данные в виде статики, где уже ничего не нужно выбирать, генерировать и подтягивать компонентами.
Схема работы: Первый хит
Страница собирается в обычном (некомпозитном) режиме только при ее первом открытии. То же самое происходит, если на сайте сброшен кеш. Однако чаще всего первый хит делают сами владельцы сайты или редакторы. Для обычных посетителей это будет далеко не первый хит.
Схема работы: второй и следующие хиты
Система «выплескивает» статику
При повторном открытии страницы система «выстреливает» статику мгновенно - даже не за доли секунды, а за доли долей секунды. Тут же система делает запросы и моментально подгружает на страницу изменения.
Схема работы: Второй и следующие хиты
Включите композитный режим. Ваш посетитель видит актуальную информацию.
По ощущениям пользователя - страница появляется мгновенно - буквально «выскакивает» перед глазами. Тут же, практически незаметно для глаза, информация обновляется. Эта «свежая» информация снова кешируется. Для следующего посетителя (хита) - откроется эта, уже обновленная страница. И снова закешируется.
Динамические блоки
Отдавать без задержки!
Динамическая информация (цена, состояние корзины, новость и т.д.) обновляется в фоновом режиме. Большинство пользователей даже не заметит изменений, пока пролистает страницу.
Динамические блоки |
Динамические блоки |
До включения композита
После включения композита
Преимущества:
- Мгновенная выдача первого хита, можно через nginx
- Загруженная страница сразу начинает подгружать все ресурсы страницы из заголовка
- Полноценный фоновый (AJAX) хит:
- Возможность показать динамическую информацию
- Автоматический пересчет кеша, если статическая часть изменилась
- Выполнение кода страницы: веб-аналитика, счетчик просмотров товаров, события, не приводящее к визуальной задержке выполнения страницы
Подгружаются только изменения. На любом сайте есть статическая информация, которая обновляется очень редко - иногда раз в неделю, в месяц, а то и в полгода. При включении композитного режима такая статика отдается мгновенно - больше не будет собираться для страницы каждый раз.
Закажите композит!