Скорость загрузки сайта - это ключевой фактор, оказывающий значительное влияние на успех вашего интернет-бизнеса. Быстрая загрузка страницы позволяет пользователям быстрее находить нужную информацию, увеличивает конверсию и делает работу с сайтом более комфортной. Высокая скорость загрузки влияет не только на пользовательское восприятие, но и повышает рейтинг сайта в поисковых системах, увеличивает его видимость.
Ускорение загрузки сайта + оптимизация для Google PageSpeed Insights - это решение для 1с-Битрикс, ускоряющее отображение сайта на всех типах устройств и положительно влияющее на баллы, скорость и параметры загрузки сайта в Google PageSpeed Insights.
Обзор возможностей решения в видео-формате: rutube.ru
1. Оптимизация css-стилей сайта
Решение оптимизирует работу таблиц стилей, сокращает время отображения страницы. Стили объединяются в один файл и оптимизируются - как следствие уменьшается вес стилей и количество подключений. Решение оптимизирует не только стандартные стили сайта, но и внешние - например Google Fonts. Сохраняет, оптимизирует и подключает их локально.
Оптимизация стилей устраняет проблему "Устраните ресурсы, блокирующие отображение" в PageSpeed.
2. Оптимизация изображений, конвертация в Webp
Решение конвертирует изображения в современный формат WebP, позволяющий значительно сократить вес изображений и ускорить работу браузера с изображениями.
Оптимизация изображений устраняет или уменьшает проблемы "Используйте современные форматы изображений" и "Настройте эффективную кодировку изображений" в PageSpeed.
3. Оптимизация JavaScript и счётчиков
В последних версиях решения добавился функционал работы с JavaScript - теперь вы можете отложить выбранные скрипты до загрузки страницы или до взаимодействия пользователя с сайтом
Решение исправляет проблему "Пассивные прослушиватели событий не используются для улучшения производительности при прокрутке" в PageSpeed.
4. Оптимизация Youtube и Rutube видео
Загрузка страниц с видео происходит медленно, т.к. видеоплеер подгружает большой объём данных: скрипты, библиотеки, интерфейс и производит сборку плеера во время первоначального открытия страницы.
Решение преобразует исходный фрейм (iframe) видео. Скрипты решения загрузят все необходимые данные, когда они будут нужны - при клике на кнопку воспроизвести. Для конечного пользователя данный механизм не заметен.
Преобразования проводимые решением так же исправляют ошибку pagespeed "Для отложенной загрузку с фасадными объектами доступно несколько ресурсов"
5. Отложенная загрузка шрифтов (font-display)
Решение имеет механизм автоматической установки font-display: swap для шрифтов.
Использование font-display устраняет проблему "Настройте показ всего текста во время загрузки веб шрифтов" в PageSpeed
6. Preconnect и Preloading
С помощью решения можно через настройки установить preconnect (предсоединения), preloading (предзагрузки) без редактирования кода сайта
Использование preloading устраняет проблему "Настройте предварительную загрузку ключевых запросов" в PageSpeed
7. Удаление стандартного OpenSans
Битрикс актуальных версий автоматически подключает шрифт OpenSans - если он вам не нужен, с помощью решения можно удалить данное подключение и сэкономить несколько килобайт загрузки
| ▷ | Безопасность файлов - исходные файлы не редактируются | |
| ▷ | Гибкая настройка - можно включить только те оптимизации, которые вам нужны | |
| ▷ | Ускоряет работу сайта у реальных пользователей, а не только в PageSpeed Insight |
| ✔ | Поддерживает механизм многосайтовости, композитный и автокомпозитный режим | |
| ✔ | Поддержка версий PHP: 7.x, 8.x | |
| ✔ | Корректно работает на актуальных и на более старых версиях 1с-Битрикс | |
| ✔ | Корректно работает с большинством готовых шаблонов (Аспро, Сотбит, Digital Web, Intec, Альфа, Некстайп, Крайт и т.д.) и на сайтах с уникальным дизайном | |
Для дополнительного ускорения отображения сайта и увеличения рейтинга скорости по Google Pagespeed Вам будут полезны:
- Решение "Отложенная загрузка картинок, видео и фоновых изображений", решающее проблему "Отложите загрузку изображений" - смотреть карточку решения
- Решение "Оптимизация и сжатие HTML + CSS", уменьшающее вес отдаваемых html-страниц - смотреть карточку решения
<img src="https://arturgolubev.ru/marketplace/img/space/warring_0_10.png" border="0" width="500" height="50" data-bx-image="https://arturgolubev.ru/marketplace/img/space/warring_0_10.png" data-bx-onload="Y" /><br />1. Для удобства и безопасности оптимизация страницы не производится если Вы авторизованы как Администратор.<br /><br />2. При замерах Pagespeed работаем с блоком "Выявляйте проблемы с производительностью" - актуальные замеры появляются в нём. В блоке "Определяйте фактическую производительность сайта" - при тестировании решения показатели меняться не будут - в нём сводная статистика за большой промежуток времени.<br /><br />3. Обязательно тестируйте решение в демо режиме, т.к. эффект от решения на каждом сайте сугубо индивидуален.<br /><br />Решение исправляет проблемы, уменьшает вес страницы и улучшает показатели, но Pagespeed всегда по разному реагирует на изменения. На похожих проектах с одинаковыми шаблонами может добавиться (или убавиться) разное количество баллов. <br /><img src="https://arturgolubev.ru/marketplace/img/space/install_and_setting_30_10.png" border="0" width="500" height="80" data-bx-image="https://arturgolubev.ru/marketplace/img/space/install_and_setting_30_10.png" data-bx-onload="Y" /><table class="data-table"><tr><td> <a href="https://arturgolubev.ru/knowledge/course7/" target="_blank" ><img src="https://arturgolubev.ru/marketplace/buttons/video.png" border="0" width="327" height="43" data-bx-image="https://arturgolubev.ru/marketplace/buttons/video.png" data-bx-onload="Y" /></a></td><td> <a href="https://arturgolubev.ru/knowledge/course7/" target="_blank" ><img src="https://arturgolubev.ru/marketplace/buttons/faq.png" border="0" width="327" height="43" data-bx-image="https://arturgolubev.ru/marketplace/buttons/faq.png" data-bx-onload="Y" /></a></td></tr></table><b><br /></b><br /><b>Полезная информация и популярные вопросы:</b><ol><li><a href="https://arturgolubev.ru/knowledge/course7/lesson23/" target="_blank" >Как проверить работу решения?</a><br /><li><a href="https://arturgolubev.ru/knowledge/course7/lesson46/" target="_blank" >Как отключить решение на определенных страницах?</a><br /><li><a href="https://arturgolubev.ru/knowledge/course7/lesson163/" target="_blank" >Как установить серверную библиотеку cwebp?</a><br /><li><a href="https://arturgolubev.ru/knowledge/course7/lesson167/" target="_blank" >Как правильно заполнять файлы в "Ускорение JavaScript"</a><br /></ol><b>Технические требования:</b><br /><ul><li>Битрикс версии 18.5 и старше<br /><li>PHP версии 7.x, 8.x<br /></ul>