>

Компрессия битрикс. Принципы увеличения скорости загрузки страниц

Как известно, Bitrix Framework состоит из модулей. Собственно, ядро «Битрикс» тоже модуль, так называемый «Главный модуль», дополненный системой установки обновлений SiteUpdate. Стандартных модулей всего 40, в различные редакции они входят в разнообразной комплектации.

К примеру, минимальная редакция «Старт» включает 4 модуля: «Главный модуль», «Управление структурой», «Информационные блоки» и «Компрессия». А минимальная редакция для интернет - торговли, называемая «Малый бизнес», состоит всего из 28 модулей, включая Главный. А именно:

1. Главный модуль
2. Торговый каталог
3. Фотогалерея 2.0
4. Управление структурой
5. Интернет-магазин
6. Социальные сервисы
7. Информационные блоки
8. Валюты
9. Опросы
10. Highload-блоки
11. Монитор производительности
12. Форумы
13. SEO-модуль
14. Облачные хранилища
15. Облачные хранилища
16. Блоги
17. Поиск
18. Облачные сервисы
19. Подписка, рассылки
20. Проактивная защита
21. Масштабирование
22. E-mail маркетинг
23. Компрессия
24. Перевод
25. Мобильная платформа
26. Веб-формы
27. Мобильное приложение
28. Технология Push & Pull

Управление модулями осуществляется в административном разделе по адресу Настройки > Настройки продукта > Модули. Имейте в виду, что установка модуля требует ресурсов хостинга, прежде всего дискового пространства. Поэтому после приобретения редакции вам следует внимательно изучить список установленных модулей, уточнить, какие задачи они выполняют, и неиспользуемые модули удалить (деинсталлировать).

Бесплатная установка модуля «Битрикс» из Marketplace

Войдя в административную панель, перейдите на закладку Marketplace. Найдите нужный вам модуль поиском по названию. Кликнув по иконке, перейдите на загрузочную страницу модуля. Нажмите кнопку «Загрузить», затем кнопку «Установить». По окончании установки настройте модуль в разделе Модули административной панели. Для этого перейдите по адресу Настройки > Настройки продукта > Модули, выберите название установленного модуля, и перейдите в настройки, кликнув по нему.

Бесплатная установка бесплатного модуля «Битрикс» из архива

Скачайте архив модуля (только из доверенного источника! Иначе вы своими руками откроете хакерам ворота!). Загрузите архив на хостинг в папку /bitrix/modules/ИМЯ МОДУЛЯ. Затем распакуйте архив на хостинге, и удалите файл архива. Войдите в административную панель и перейдите по адресу Настройки > Настройки продукта > Модули. Найдите ваш новый модуль в списке доступных модулей и запустите установку, нажав кнопку «Установить». После окончания вы увидите модуль в списке установленных модулей и сможете его настроить.

Платная установка модуля «Битрикс» из Marketplace

В «Битрикс Marketplace» доступны десятки тысяч модулей, за небольшие деньги помогающие ускорить работу сайта, упростить рутинные процедуры по обслуживанию, многократно увеличить скорость работы с торговым каталогом, оказать немалую помощь с поисковой оптимизацией. В каталоге Marketplace 245 готовых интернет – магазинов, 373 готовых сайта, 127 отраслевых решений и 45 решений для SEO.

Для установки платного модуля «Битрикс» из Marketplace найдите его карточку в каталоге, нажмите кнопку «Купить» и оплатите модуль. Вскоре вы получите от разработчика письмо купоном активации и инструкциями по установке. После этого войдите в панель управления, перейдите на вкладку Marketplace и в разделе Обновление решений перейдите на вкладку Активация купона. Введите код купона. После этого в списке доступных модулей появится название купленного вами модуля. Нажмите кнопку «Установить» и далее действуйте так же, как при установке бесплатного модуля.

Что будет, если нагрузить фуру и старую клячу грузом в 1 тонну? Правильно: первый поедет на максимальной скорости, а вторая не сможет сдвинуться с места. Так и сайты: у каждого из них свои требования к хостингу, конфигурации, настройкам платформы 1С-Битрикс.

Каждую неделю в нашу поддержку приходят жалобы на низкую скорость загрузки. В 99,9% случаев оказывается, что проблема кроется в слабеньком хостинге и неправильных настройках. Рассказываем, что делать, если сайт или интернет-магазин тормозит, и как правильно произвести диагностику и самостоятельно увеличить производительность - так, чтобы летал.

1. Оцените производительность

Модуль «Монитор производительности» 1С-Битрикс позволит протестировать производительность сайта и сравнить результаты с эталонными показателями. Он укажет на слабые места: сайт, CMS, конфигурация, некачественная разработка или хостинг. Вы можете развернуть ваш сайт или «чистый» 1С-Битрикс на разных площадках и сравнить эти цифры.

Что нужно знать о показателях производительности:

  • меньше 30 пунктов – забудьте про производительность и быструю загрузку страниц. Показателя «Очень быстро» вам не видать. Тормозить будет все!
  • от 30 до 60 – подойдет для небольших проектов (корпоративные сайты или интернет магазины с небольшим количеством товаров, небольшим количеством SKU и параметров в умном фильтре)
  • от 60 до 100 - конфигурация сервера приемлема, но не оптимальна. Подойдет для большинства проектов. Сайт работать будет, но не на сверхскоростях.
  • от 100 – вы молодцы: не поленились выбрать нормальную хостинг площадку! Админка летает, большие объемы данных из 1С выгружаются на ура, страницы отдаются быстро. Вы спите спокойно и даже не думаете писать в техподдерожку с жалобами на проблемы с загрузкой сайта, ни разу не видели ошибок Request timeout или 502 Bad Gateway.
  • 200 и выше – идеально!

Как протестировать сайт

Перейдите в панель производительности: Настройки → Производительность → Панель производительности. Нажмите кнопку «Тестирование производительности» и подождите несколько минут.

2. Перейдите на PHP7

3 декабря 2015 года вышла седьмая версия PHP. Она разрабатывалась с упором на увеличение производительности и уменьшение потребления памяти. Тесты это убедительно показывают (пример 1 , пример 2) - прирост производительности после перехода на новое ядро составляет от 40%!

Сидеть на старых версиях PHP - осложнять жизнь пользователю и делать этот интернет хуже. Если ваш хостинг не поддерживает PHP7, меняйте его (например, на этот с бесплатным переносом). Если ваш сайт не поддерживает PHP7, срочно исправляйтесь. А еще лучше, используйте решения с поддержкой PHP7 - например, от Аспро.

3. Настройте кеширование

Использовать композит и автокомпозит - это хорошо и правильно. Но просто включить их - полдела. Чтобы получить ощутимый прирост в скорости, нужно корректно задать время жизни кеша в зависимости от частоты обновления данных на сайте и посещаемости.

Как не надо:


Как надо - в зависимости от частоты обновления данных и посещаемости сайта:

  1. Цены на сайте обновляются вручную или несколько раз в неделю.
    Рекомендуемое время кеширования: не менее 172800 секунд (2 суток).
  2. Цены на сайте обновляются один раз в день, выгрузка из 1С или другой системы складского учета происходит ночью.
    86400 секунд (1 сутки).
  3. Нечасто, но бывает: цены обновляются через реал-тайм обмен с 1С и бывает, что несколько раз в течение дня.
    Рекомендуемое время кеширования:     7200 секунд (2 часа).

4. Создайте фасетные индексы для умного фильтра

Фасетные индексы ускоряют работу умного фильтра. Обычно умному фильтру нужно перебрать все товары каталога и сравнить их свойства с заданными параметрами. Если товаров много, такой процесс может занять определенное время. Фасета же заранее просчитывает и составляет варианты запросов, сохраняет в системе и выдает по запросу.

На словах все здорово, на деле - не очень: фасеты редко создают и используют. Попробуйте это сделать и сравните скорость загрузки результатов фильтрации.

5. Проанализируйте и создайте индексы в базе данных

Индексы анализируются и создаются здесь: Настройки → Производительность → Индексы → Анализ индексов.

Нажмите на кнопку «Выполнить анализ собранных SQL запросов». Если появившиеся индикаторы зеленые, все в порядке: индексы созданы. Если индикаторы желтые, создайте их самостоятельно. Инструкция в мануалах 1С-Битрикс

6. Отключите неиспользуемые модули

При инциализации ядра 1С-Битрикс подключается большой список модулей. Они отнимают ресурсы, но при этом не нужны для полноценной работы сайта. Отключаем лишние модули - получаем прирост производительности. Перед тем, как это делать, обязательно сделайте резервную копию сайта.

Какие модули используются редко и их можно отключить без последствий для работы сайта:

  • AD/LDAP интеграция (ldap)
  • Push and Pull (pull)
  • Wiki (wiki)
  • А/B-тестирование (abtest)
  • Веб-аналитика (statistic)
  • Веб-кластер (cluster)
  • Веб-мессенджер (im)
  • Веб-сервисы (webservice)
  • Дизайнер бизнес-процессов (bizprocdesigner)
  • Документооборот (workflow)
  • Календарь событий (calendar)
  • Конструктор отчетов (report)
  • Менеджер идей (idea)
  • Мобильная платформа (mobileapp) - если не подключено мобильное приложение
  • Мобильное приложение для интернет-магазина (eshopapp) - если не подключено мобильное приложение
  • Обучение (learning)
  • Перевод (translate)
  • Почта (mail)
  • Техподдержка (support)
  • Универсальные списки (lists)
  • Управление масштабированием (scale).
Как это сделать: перейдите в настройки модулей Рабочий стол → Настройки → Настройки продукта → Модули и отключите лишние.

7. Настройте CDN

Еще одна неоднозначная вещь, которая может как разогнать сайт, так и заставить его хорошенько притормозить. Что это такое?

Теория:

«Модуль Ускорение сайта (CDN), который позволяет загружать весь статический контент вашего сайта (картинки, файлы стилей css, скрипты js) через сеть дистрибуции контента (Content Delivery Network или Content Distribution Network, CDN). Тем самым значительная часть ресурсов сайта загружается посетителем с ближайшего к нему сервера. Это позволяет увеличить скорость загрузки страниц до нескольких раз.

Также подключение CDN снижает нагрузку на основные серверы сайта. Так как весь статический контент загружается посетителями вашего сайта не напрямую с ваших серверов, а с узлов CDN, которые умеют очень эффективно кэшировать контент, снижается количество обращений непосредственно к вашим серверам» (отсюда)

Настраивается CDN здесь: Настройки → Облако 1С-Битрикс → Ускорение сайта (CDN).

Практика

Не все так однозначно: для кого-то включенный CDN дает реальный прирост производительности, а у кого-то, напротив, снижает скорость загрузки сайта. Выход один: тестировать и замерять результаты.

8. Включите объединение и сжатие CSS и JS-файлов

В настройках главного модуля сайта есть волшебный блок, который позволяют улучшить показатели скорости загрузки сайта. Называется он “Оптимизация CSS”. Отмечайте галочками все, сохраняйте изменения и тестируйте скорость загрузки страниц.


Как это все работает в деталях, читайте . А оценить в количественных и качественных характеристиках эти «до» и «после» поможет старый добрый Google PageSpeed Insights.

Сегодня узнаем как грамотно оформлять header.php в Битрикс , как правильно подключать.css и.js в header.php , как правильно подключать jQuery в Битрикс и как включить сжатие.css и.js файлов в Битрикс .

Это очень острая и актуальная проблема на сегодняшний день. Самые частые обращения по модулям связаны с ошибками в скриптах, когда неправильно подключена jQuery в header.php , и очень часто подключено несколько jQuery, но должна быть подключена на всех страницах сайта только одна библиотека jQuery и самой первой среди всех скриптов шаблона сайта.

На одном сайте был рекорд, я насчитал 7 подключенных библиотек jQuery, просто человек замучился искать ошибки и деваться уже некуда было, когда проблема была найдена и исправлена, все стало работать на сайте правильно.

Итак, как грамотно должен быть оформлен файл header.php шаблона сайта в Битрикс:

  1. Перед не должно быть никаких пробелов и переносов
  2. Кодировка страницы задается перед </b></li> <li><b>После заголовка <title> перечисляются все мета-теги <meta> </b></li> <li><b>После мета-тегов подключаются.css стили сайта <link> </b></li> <li><b>И только после подключения.css стилей подключаются все.js скрипты <script> </b></li> <li><b>Комментарии к IE по возможности лучше опустить в самый конец перед закрывающим тегом </head> </b></li> </ol><h3>Пример header.php для HTML 5 DOCTYPE</h3><blockquote class="bxhtmled-quote"> <?<br> if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true) die();<br> /**<br> * @var CUser $USER<br> * @var CMain $APPLICATION<br> * @var $full_width - переменная в которой будет true если выполнится условие из $arFullWidthPages<br> */<br> ?><!DOCTYPE html><br> <html lang="<?=LANGUAGE_ID?>"><br> <head><br> <meta charset="<?=SITE_CHARSET?>"><br> <title><?$APPLICATION->ShowTitle()?>
    //Тут мета-теги
    $APPLICATION->
    $APPLICATION->
    $APPLICATION->
    ?>




    //Тут канонический url
    $APPLICATION->ShowLink("canonical", null, false);

    //Тут стили шаблона сайта
    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/uikit.gradient.min.css");
    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/components/form-password.gradient.min.css");
    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/components/sticky.gradient.min.css");
    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/components/placeholder.gradient.min.css");
    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/jquery.responsive-tabs.css");
    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/nanoscroller.css");
    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/scrollup/image.css");
    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/pace.min.css");

    //Тут выводим стили
    $APPLICATION->ShowCSS(true, false);
    ?>



    //Это встроенная в ядро Битрикс jQuery, если подключать ее, то строку подключения jQuery 1.11.2 выше надо удалить.
    //CJSCore::Init(array("jquery"));

    //Тут скрипты
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/core.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/grid.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/modal.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/dropdown.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/scrollspy.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/utility.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/button.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/switcher.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/nav.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/components/sticky.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/components/form-password.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/pace.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/jquery.nanoscroller.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/jquery.responsiveTabs.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/switchery.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/readmore.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/jquery.scrollUp.min.js");
    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/fn.js");

    //Тут выводим скрипты
    $APPLICATION->ShowHeadStrings();
    $APPLICATION->ShowHeadScripts();
    ?>

    CUtil::GetAdditionalFileURL() - генерирует url к файлу с указанием метки версии файла, т.е. он будет кешироваться в браузере посетителя.

    SITE_TEMPLATE_PATH - это константа указывающая URL от корня сайта до папки текущего шаблона включая имя папки, если измените папку шаблона, то в header.php ничего исправлять уже не придется, он изменится в этой константе, например: /bitrix/templates/папка шаблона сайта/

    Разберем представленный выше код header.php детально, чтобы понимать, что тут для чего подключается.
    Хочу обратить внимание на передаваемые параметры true и false в методах, например ShowMeta() и ShowCSS(), от них зависит стандарт вывода тегов, для HTML 4, HTML 5 в виде , иначе по стандарту xHTML в виде , в данном примере для HTML 5, подробнее читайте в API-документации Битрикс.

    Тут мы выводим мета-теги "описание" и "ключевые слова" для поисковых систем.

    $APPLICATION->ShowMeta("robots", false, false);
    $APPLICATION->ShowMeta("keywords", false, false);
    $APPLICATION->ShowMeta("description", false, false);
    ?>

    Методом SetAdditionalCSS() подключаем стили шаблона, так каждый стиль.

    $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH ."/css/uikit.gradient.min.css");

    Метод ShowCSS() выводит все стили шаблона и стили, которые могут подключаться в компонентах Битрикс, т.е. вообще все подключенные стили, включая стили ядра Битрикс.

    $APPLICATION->ShowCSS(true, false);
    ?>

    Перед подключением вообще всех скриптов сайта и только для браузера Internet Explorer младше IE 9 я подключаю специальные полифилы функций/методов, которые в нем отсутствуют и вызывают ошибки javascript, возможная самая частая ошибка типа Object doesn"t support property or method "forEach" ...
    Т.е. если какого-то метода нет в IE 8, но он используется в новой jQuery или каком-то плагине, то может повезет и он найдется в этом скрипте, но Вы можете его не подключать, только если нужен.




    А вот и подошли мы к самому интересному, на этом этапе самая частая ошибка подключения jQuery, которая должна выводиться самой первой среди всех остальных подключенных в компонентах или в шаблоне сайта jQuery-плагинах, т.е. ошибок с подключенными где-то в компоненте или шаблоне jQuery-плагинами быть не должно!
    Все плагины и скрипты будут подключаться как положено, после jQuery, а не как у многих, в обратном порядке, это базовое правило подключения плагинов jQuery, знать его нужно всем!


    Методом AddHeadScript() подключаем скрипты шаблона и только после подключения стилей, стили всегда подключайте выше скриптов.

    $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH ."/js/uikit/core.min.js");

    Ниже два заключительных метода "выводят" :

    • ShowHeadStrings() выводит все скрипты ядра Битрикс, включая встроенную jQuery, если вызывается методом CJSCore::Init(array("jquery"));
    • ShowHeadScripts() выводит скрипты шаблона добавленные с помощью AddHeadScript(), а также специальные стили, JavaScript, либо произвольный html-код, который задается в компонентах с помощью CMain::AddHeadString() и все на свете пользовательское.

    Обратите внимание на порядок, именно в таком порядке!

    $APPLICATION->ShowHeadStrings();
    $APPLICATION->ShowHeadScripts();

    Почему строго в таком порядке?
    Потому что в методе ShowHeadStrings() может выводиться jQuery ядра Битрикс, вызываемая таким образом:

    CJSCore::Init(array("jquery"));

    Я ее специально закомментировал, чтобы Вы это знали, и знали где подключать. Вызываться он может в любом компоненте, в шаблоне, на любой странице сайта, а выводится она именно в этом самом первом методе, если поменять их местами, она окажется в самом низу, вот и ошибка разработки, можно это смело добавлять в чек-лист по разработке сайта.
    Но если Вы выводите встроенную jQuery, значит подключенную ранее вручную jQuery надо удалить со страницы, не забывайте, она должна быть одна на всем сайте!

    Итак, все это подключенное в исходном коде выглядит так:

    Это конечно все круто! Но, как мы видим, к серверу очень много запросов - 93 шт., много подключено всяких файликов, а это заметно сказывается на скорости загрузки страницы, на время ожидания клиентом, мне-то как разработчику очень удобно, наглядно все видно в коде, но посетители мои от этого заметно страдают...


    Оказывается, в Битрикс есть отличные опции в настройках главного модуля, позволяющие:

    • Объединять CSS файлы
    • Объединять JS файлы
    • Подключать минифицированные версии CSS и JS файлов
    • Создавать сжатую копию объединенных CSS и JS файлов - нужно отключить

    Включается сжатие и объединение.css и.js здесь:

    Администрирование -> Настройки -> Настройки модулей -> Главный модуль

    Создавать сжатую копию объединенных CSS и JS файлов - это нужно отключить!
    Потому что при включенной опции Битрикс сжимает вообще все подключенные на сайте скрипты и стили со всех страниц сайта, это и вес им прибавляет, и велика вероятность появления JS-ошибок на странице.

    Лично я столкнулся с такой проблемой, JS-ошибка запросто будет в модуле, где у jQuery-плагина есть js-lang, эти лэнги хранятся в соответствующих php-файлах, вот если на странице сайта подключается какое-то расширение, то Битрикс его также сжимает, скрипт этого расширения будет на всех страницах сайта, а вот лэнги расширения подключаются только на той странице, где вызывается расширение, если jQuery-плагин не видит свой js-lang, то запросто может быть на странице js-ошибка.

    Например, я свой jQuery-плагин подключил как расширение на странице Каталог, тут же и лэнги моего плагина подключаются, вот если включить сжатую копию всех JS-файлов, мой плагин будет на всех страницах сайта в хедере, а лэнг только на странице Каталог, соответственно, когда я открываю например главную страницу сайта или любую другую отличную от Каталога, то в консоли появляется JS-ошибка, т.к. лэнги моего плагина подключаются только на странице Каталог.

    В общем, очень опасная опция, не включайте ее вообще.

    Все, сжатие включено и должно работать.

    Для точного результата работы сжатия необходимо разлогиниться, далее открывайте главную страницу сайта, обновите ее, откройте исходный код и увидите такую картину


    Наглядно видим, насколько уменьшилось количество файлов, все скрипты шаблона сжаты в один файл, стили также в один файл.
    Количество запросов уменьшилось в разы, время полной загрузки страницы сократилось с 3.8сек. до 1.8сек., запросы к серверу сократились с 93 до 43.


    Заключение

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

    Обязательно изучите все моменты подключения jQuery, скриптов и стилей, их порядок и включайте сжатие на сайте, это существенно ускорит время загрузки страницы и время ее отклика на действия посетителя, облегчит ее и нагрузку на сервер, сайт даже меньше трафика станет потреблять, т.к. каждый файлик на вашем сайте - это трафик!
    Также, советую избавляться от всех малонужных и устаревших jQuery-плагинов, ко многим можно найти замену меньшую в разы и даже лучше по функционалу.

    Это была моя первая статья из курса "Ускорение сайта" , продолжение следует...

    В настоящее время для работы на сайте необходима динамичная система управления. При создании сайта на 1С-Битрикс предоставляется возможность с помощью широкого набора инструментов донести свои идеи до посетителя.

    Главная особенность этой CMS в её модульности, то есть, имея одну административную базу управления сайтом, все редакции 1С-Bitrix отличаются друг от друга количеством модулей.
    К примеру самая простая редакция «Первый сайт», разработанная для маленьких компаний, включает в себя основных 4 модуля:

    • Главный модуль.
    • Управление структурой.
    • Инфоблоки.
    • Модуль .
    В редакции "Старт" добавляются модули облачных сервисов, SEO-модуль и поиск. В "Стандарте" появляются блог, форум, возможности мобильной рассылки и мобильной платформы. «Малый бизнес» позволяет с минимальными затратами сделать собственный интернет-магазин и управлять контентом сайта.
    Под "Экспертом", являющимся основой для разработки информационного портала со своей социальной сетью и сообществами, предоставляется возможность поработать над сайта.

    Композитный сайт Битрикс

    Технология "Композитный сайт" нацелена на ускорение доставки контента от сервера к пользователю, снижая при этом нагрузку на сервер.
    сокращает время получение страницы пользователем
    снижает нагрузку на сервер
    добавляет динамические области на закешированной странице.

    Технология "Композитный сайт" Bitrix расширяет функционал автокеширования страницы. Благодаря этой технологии, в кеше страницы появились динамические области, в которых могут отображаться результаты поведения пользователя на сайте: например, товары, добавленные в корзину пользователем или блок просмотренных пользователем товаров.

    В динамические области страницы посредством асинхронных ajax-запросов выводятся результаты действия пользователя на странице.

    Технология "Композитный сайт" - совокупность работы html-кеширования и ajax-подгрузки информации.

    В итоге, очевидные плюсы ускорения работы сайта:
    пользователи удовлетворены работой сайта, "отказы" по этой причине исчезают
    лучшее ранжирование в поисковой выдаче
    уменьшение точечной нагрузки на сервер, сайт сможет работать без ошибок с большим количеством посетителей.


    Модуль монитора качества CMS Bitrix выполняет проверку качества сайта, и его основная цель – предоставить заказчику технически доработанный и проверенный экспертом в лице 1С-Битрикс проект.
    В CMS Bitrix для сдачи проекта по Монитору качества требуется пройти тесты различного назначения – проверку качества разработки, настроек продукта и соблюдение рекомендаций, специфичных для платформы 1С-Битрикс.

    Модуль состоит из совокупности тестов, проходимых в ручном и автоматическом режиме, разделенных на обязательные по прохождению и необязательные. Обязательные тесты проверяют критически важные моменты, поэтому должны быть пройдены.
    Тестирование включает в себя 66 тестов из них 26 обязательных, и проверка проводится в таком порядке:

    1. Интеграция дизайна и разработка
    2. Безопасность
    3. Производительность
    4. Размещение на хостинге
    5. Сдача проекта

    После прохождения всех 26 обязательных тестов, проект сайта можно сдать, после чего отчет по тестированию попадает в архив. Чем больше тестов успешно пройдено из всего количества, тем лучше для заказчика.


    Эта заметка не будет касаться напрямую возможностей Битрикс. Я приведу несколько базовых принципов увеличения скорости работы сайта.1. Необходимо уменьшить количество HTTP-запросов.

    Сайт это не только html-страница, но и картинки, javascript-файлы, файлы стилей. Если мы уменьшим количество этих файлов, то мы увеличим скорость загрузки страницы.

    • файлы стилей можно объединить в один файл
    • файлы javascript также можно объединить в один файл
    • как бы это не звучало странно, но картинки также можно объединить в один файл, называемый css-спрайтом.

    По первому пункту все уже сделано в последних версиях движка 1С-Битрикс. Вы можете включить эти галки в настройке главного модуля.

    Таким образом во время разработки вы можете иметь столько файлов со стилям, сколько вам нужно, а при сдаче в продакшен — включить галки и все файлы css сольются в один.

    По второму пункту, к сожалению, готовых решений я не нашел, хотя по сути решение должно быть точно такое же как и для CSS.

    Для реализации третьего пункта необходимо сразу же делать верстку на основе одной картинки. О технологии создания CSS-спрайтов написано немало статей.

    2. Все CSS-файлы необходимо размещать в начале страницы

    Если вы пользуетесь стандартным подходом Битрикс к интеграции верстки в дизайн, то так у вас и будет.

    3. Минимизация кода CSS-файлов и JS-файлов, уменьшение размеров картинок, GZIP-сжатие страницы.

    Для минимизации кода CSS-файла нужно всего лишь поставить галку «Создавать сжатую копию объединенного файла CSS», для минимизации кода javascript-файлов есть специальные решения вроде http://yuilibrary.com/download/yuicompressor/ .

    Для того, чтобы включить GZIP-сжатие в Битрикс достаточно установить модуль Компрессия из стандартной поставки Битрикс.

    4. Используйте Google Libraries для загрузки больших javascript-библиотек

    Хотя бы по мере возможности. Jquery точно стоит подключать таким образом.


    5. Обязательно используйте кеш браузера.

    Для этого необходимо поставить mod_expires для apache2 и настроить его таким образом, чтобы статическая информация кешировалась со стороны браузера на очень долгое время. Например, вот так:

    // код файла.htaccess

    Header append Cache-Control "public" FileETag MTime Size ExpiresActive On ExpiresDefault "access plus 0 minutes" ExpiresByType image/ico "access plus 1 years" ExpiresByType text/css "access plus 1 years" ExpiresByType text/javascript "access plus 1 years" ExpiresByType image/gif "access plus 1 years" ExpiresByType image/jpg "access plus 1 years" ExpiresByType image/jpeg "access plus 1 years" ExpiresByType image/bmp "access plus 1 years" ExpiresByType image/png "access plus 1 years"

    На этом я закончу свой краткий обзор основных принципов увеличения скорости загрузки страниц.