Ускоряем 1С-Битрикс: 9 приемов, которыми можно воспользоваться сегодня

как ускорить битрикс

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

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

Итак, важность скорости работы сайта мы обсудили, давайте посмотрим что можно предпринять, чтоб ускорить ваш Битрикс.

1. Минимизируйте CSS и JS файлы

Первое и самое простое, что можно сделать – это сжать JS и CSS файлы. Логика работы очень простая, из файлов убираются все «лишние» символы: пробелы, переносы строк, комментарии, переменные в JS приводятся к 1-2 символьному виду.

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

автоматическое уменьшение загружаемых изображений битрикс

Что значит «правильно»? Это значит, что в коде шаблонов сайтов и компонентов у вас нет вставок <script></script>.

Что делать, если все подключено как попало? Переподключать!

Вот пример подключения на D7:

use Bitrix\Main\Page\Asset;
Asset::getInstance()->addJs('/js/jQuery.min.js'); - правильное подключение JS.
Asset::getInstance()->addCss('/css/bootstrap-grid.css'); - правильное подключение CSS.

Пробегитесь по шаблонам сайтов и компонентов и убедитесь, что у вас нет блоков <script></script> нигде. Исключением может быть разве что счетчики метрик, а лучше одного счетчика – Google Tag Manager.

Про подключение файлов на старом ядре я писал в этой статье.

Второй вариант минификации файлов – использование Grunt или Gulp. Мне больше нравится Grunt, но любители Gulp легко найдут аналоги грантовских тасков:

  • grunt-contrib-cssmin – минифицирует CSS.
  • grunt-contrib-uglify – минифицирует JS.
  • grunt-contrib-concat – обычное объединение нескольких файлов в один.

Gruntfile.js:

module.exports = function(grunt) {
    grunt.initConfig({
        concat: {
            dist: {
                src: 'js/*.js',
                dest: 'js/min/all.js'
            }
        },
        uglify: {
            dist: {
                files: {
                    'js/min/all.min.js': ['js/min/all.js']
                }
            }
        },
        cssmin: {
            target: {
                files: [{
                    expand: true,
                    cwd: 'css',
                    src: ['*css', '!*.min.css'],
                    dest: 'css',
                    ext: '.min.css'
                }]
            }
        }
    });

    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    grunt.loadNpmTasks('grunt-contrib-concat');

    grunt.registerTask('default', ['concat', 'uglify', 'cssmin']);
};


Важно: сжатие скриптов и стилей с помощью стороннего софта не освобождают вас от правильного подключения в bitrix.

2. Оптимизируйте изображения

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

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

Проанализируйте какого размера картинки используются у вас на сайте и настройте все инфоблоки.

Если одни и те же изображения используются в нескольких местах с разным разрешением, то их вывод можно обернуть в CFile::ShowImage($img, $width, $height); Функция вернет HTML изображения, масштабированного в зависимости от указанных размеров. В первый параметр надо передать или ID изображения, либо путь к файлу.

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

3. Используйте CDN

Еще один пункт, внедряемый буквально за пару минут.

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

Хорошая новость: в битрикс CDN включается одной галочкой в админке. Перейдите в Настройки -> Облако 1С-Битрикс -> Ускорение сайта (CDN) и поставьте галочку «Включить ускорение сайта». На вкладке «Сайты» поставьте галочку напротив нужного сайта (если их несколько), а на вкладке «Дополнительно» проверьте правильно ли указано доменное имя и протокол https.

Плохая новость №1: для использования технологии вам нужна активная лицензия 1С-Битрикс. Не продлили вовремя – CDN перестанет работать, ресурсы будут отдаваться как обычно.

Плохая новость №2: CDN трафик ограниченный. На разных редакциях по-разному: от 5Гб на «Старте», до 40Гб на «Бизнесе». Если вы исчерпаете лимит – ресурсы станут отдаваться в обычном режиме. Без ограничений на CDN трафик только редакция Энтерпрайз. Но у вас ведь не она, правда? :)

Плохая новость №3: битрикс пользуется услугами совершенно определенной сети CDN – CDNvideo. Если вам по каким-то причинам захочется сменить CDN провайдера, без команды опытных разработчиков вам не обойтись.

4. Избегайте 301 редиректа

Редиректы - убийцы производительности. Избегайте их везде, где это возможно. Они будут генерировать дополнительные Round Trip Time (RTT) и, следовательно, удваивает время загрузки изначальной HTML страницы, еще до того, как браузер начнет загружать контент.

SEO специалисты на этом пункте завоют. И серьезно, иногда 301 не решить определенные задачи. Просто пробегитесь по сайту (или воспользуйтесь софтом) и проанализируйте все ли действующие редиректы вам все еще нужны.

5. Используйте хостинг, рекомендуемый 1С-Битрикс или виртуальный сервер

Еще одна очень частая проблема – не оптимальная настройка хостинга. При этом сайт может работать абсолютно корректно.

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

Настройки -> Производительность -> Панель производительности. Запустите тест на 1 минуту, после завершения, на вкладке «Конфигурация» вы увидите сравнение текущей конфигурации с эталоном.

Мы перепробовали какое-то количество хостингов за последние 7 лет (даже запускали свой), могу сказать, что оценка в 30 баллов – очень средняя отметка. На минимальном тарифе под 1С-Битрикс моего любимого Спринтхоста выдает 30 глазом не моргнув.

тест производительности битрикс

Да и любой хороший хостинг на средних тарифах, выдает 50-80. Ходят слухи, что кто-то разгонял Битрикс до 290 попугаев, но тут уже нужен сервер с хорошим железом.

На второй вкладке - «Битрикс» - найдете вердикт по настройке конфигурации. Если настроено не оптимально – ознакомьтесь с документацией и исправьте.

Если все плохо и хостер отказывается изменять конфигурацию (или переносить ваш сайт на другой сервер), стоит задуматься о его смене. На официальном сайте битрикса есть целый раздел с рекомендованными хостинг-партнерами. Выберите себе исходя из цены, качества и дополнительных плюшек. :)

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

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

Идем в настройки битрикса: Настройки продукта -> Автокеширование и включаем (если выключено).

Если вы думали, что на этом все – вы очень ошибались. Проходим по всему сайту, заходим в настройки каждого компонента и выставляем кеширование на «Авто», либо «Кешировать» и время кеширования в секундах (минимум 86400).

Можно сделать замену в IDE, запустив поиск по всему проекту. За кеширование компонентов отвечают параметры:

"CACHE_TYPE" => "A",
"CACHE_TIME" => "36000000",

7. Настройте композитный сайт

Композитный сайт – запатентованная технология 1С-Битрикс и её включение действительно приводит к хорошим результатам.

В идеале настроить на хранение в memcached.

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

8. Не используйте старые версии PHP

Этот пункт можно было бы отнести в раздел о Хостинге, но я решил выделить его отдельно. Перестаньте сидеть на старых версиях php. Уже сам битрикс официально не поддерживает старые версии. Просто посмотрите на сравнение производительности. К сожалению, данных по Битрикс не нашел, но уверен там все примерно также.

php 7.2 скорость

Смотреть сравнение для других платформ: https://habr.com/ru/company/mailru/blog/350686/.

Избавьтесь от устаревшего кода, протестируйте ваш сайт и переводите сервер/хостинг на php последней стабильной версии.

9. Включите Gzip

Это рекомендует и сам Google. Gzip – утилита сжатия файлов. По нашим наблюдениям, включение gzip на сервере заметно увеличивает скорость загрузки.

Для Apache вы можете включить сжатие в .htaccess.


    # Compress HTML, CSS, JavaScript, Text, XML and fonts
    AddOutputFilterByType DEFLATE application/javascript
    AddOutputFilterByType DEFLATE application/rss+xml
    AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
    AddOutputFilterByType DEFLATE application/x-font
    AddOutputFilterByType DEFLATE application/x-font-opentype
    AddOutputFilterByType DEFLATE application/x-font-otf
    AddOutputFilterByType DEFLATE application/x-font-truetype
    AddOutputFilterByType DEFLATE application/x-font-ttf
    AddOutputFilterByType DEFLATE application/x-javascript
    AddOutputFilterByType DEFLATE application/xhtml+xml
    AddOutputFilterByType DEFLATE application/xml
    AddOutputFilterByType DEFLATE font/opentype
    AddOutputFilterByType DEFLATE font/otf
    AddOutputFilterByType DEFLATE font/ttf
    AddOutputFilterByType DEFLATE image/svg+xml
    AddOutputFilterByType DEFLATE image/x-icon
    AddOutputFilterByType DEFLATE text/css
    AddOutputFilterByType DEFLATE text/html
    AddOutputFilterByType DEFLATE text/javascript
    AddOutputFilterByType DEFLATE text/plain
    AddOutputFilterByType DEFLATE text/xml

Для Nginx сжатие необходимо включить в файле nginx.conf.

gzip on;
gzip_comp_level 2;
gzip_http_version 1.0;
gzip_proxied any;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;
gzip_disable "MSIE [1-6].(?!.*SV1)";
gzip_vary on;

Итог

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

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

Услуги

Подпишись на меня в Телеграм, не пропускай новые статьи

К выступлениям