Ускорение загрузки сайта - оптимизация css, js и изображений

Заказать

Задать вопрос

Оставьте заявку и получите консультацию от нашего специалиста.

Ускорение загрузки сайта - оптимизация css, js и изображений

Мы продаем лицензии по официальным ценам вендора. Но при покупке тарифов через нас

вы получите бонусы на 20 % от стоимости покупки

в виде услуг компании Адена.

Adwex.Minified — модуль для быстрой оптимизации загрузки сайта. Модуль оптимизирует стилевые файлы, файлы скриптов и изображения. Также добавлены дополнительные возможности: инлайн стилей (inline), конвертация изображений в формат WebP, прекконект к службам метрики, ленивая загрузка изображений.

Минимизация Модуль создает файлы с минимизированным кодом внутри. В коде убираются пробелы, переносы строк и комментарии, сокращаются цветовые обозначения. Это уменьшает вес файлов, а следовательно и время загрузки.

Встраивание (inline) Благодаря встраиванию CSS уменьшается количество запросов к серверу, пользователь получает CSS код сразу вместе со страницей. Иногда, если CSS файлы большие, это приводит к уменьшению оценки в Google PageSpeed, для того, чтобы этого не происходило, включите опцию «Встраивать только небольшие файлы» - в этом случае количество запросов к серверу сокращается, а размер HTML кода увеличивается, но не критично.
В последних обновлениях, добавлено оптимизированное встраивание стилей. Стили встраиваются в страницу только в первый заход пользователя, тогда же они кэшируются браузером в фоновом режиме. В следующий заход пользователь получит стили из кэша, а HTML код будет без доп. вставок кода, что значительно сократит его размер.

Модуль создает файлы с минимизированным кодом внутри. Это уменьшает вес файлов. Т.к. JS код может быть самым разным, для работы можно использовать одну из четырех библиотек:

Patchwork
PHPWee
JSMin
MatthiasMullie

Изображения В первую очередь на скорость загрузки сайта влияют изображения. Модуль оптимизирует как уже загруженные файлы, так и только загружаемые в автоматическом режиме. Для минимизации используется различные библиотеки, результат их работы сравнивается и остаётся файл с наименьшим весом.
В версии 2.0.5 добавлена конвертация изображений в формат WebP. WebP изображения создаются из уже оптимизированых, хранятся отдельно от оригиналов, и показываются только в современных браузерах. Обратите внимание, что конвертация работает не на всех хостингах. После установки в настройках модуля, можно проверить хостинг на поддержку формата.

Шрифты Если на сайте используется подключаемые шрифты Fonts.Google (решения Аспро, BXReady, INTEC и др.), то с помощью модуля вы сможете оптимизировать их загрузку.
В последних версиях Битрикс добавляет загрузку шрифта Open Sans. Если он вам не нужен или он уже подключается из другого места, его можно убрать с помощью соответствующей опции.
Оптимизация HTML Модуль также сжимает итоговый код HTML. Это экспериментальная функция, мы рекомендуем использовать ее только на небольших сайтах или сайтах, где контент редко изменяется (новостные, корпоративные, блоги). Для минификации используются библиотеки:

Patchwork
PHPWee
TinyHtml
Shaun

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

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

изображения можно оптимизировать заранее, чтобы пользователю не нужно было ждать, когда произойдет оптимизация «на лету»;
экономится место на хостинге;
при сохранении оригиналов, нужно следить за удалением файлов. Пример: на страницу добавили новый файл, а старый удалили. Для нового файла создастся оптимизированная копия, но копия для старого файла, также останется, ведь её не удалили. Со временем, это может сказаться на занимаемом месте;

Вы не зависите от работоспособности сторонних сервисов, т.к. все операции происходят на вашем сервере.

JS и CSS файлы оптимизируются только если они подключены через API Битрикса.

Для работы модуля нужен PHP версии >5.6. Для быстрой и стабильной работы сайта, рекомендуется PHP версии выше 7.1

Также рекомендуем настроить на сервере HTTP/2, это необходимо как для быстрой загрузки, так и для безопасности вашего сайта.
Результаты работы модуля зависят от индивидуальных особенностей сайта и могут отличаться от приведенных примеров. Чтобы проверить работу модуля на вашем сайте, протестируйте его в демо-режиме. Если вам требуется помощь с настройкой модуля, напишите в нашу службу поддержки.

Услуги

Видео

Проекты

Вам может понравиться

Статьи

Вопросы и ответы

Как проходит работа по созданию сайта на шаблонном решении? Какие этапы?

1 шаг. Проводим предварительную консультацию и знакомимся с клиентом
2 шаг. Согласовываем перечень задач, сроки выполнения и стоимость разработки
3 шаг. Выполняем весь перечень работ по сайту
4 шаг. Демонстрируем готовый к запуску сайт
5 шаг. Проводим обучение по работе с сайтом

Если нужны доработки после запуска сайта?

Отлично! Мы согласовываем с вами список задач по сайту, оцениваем стоимость и выставляем счет на оплату.

Оказываете ли вы поддержку после запуска проектов?

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

Назад к списку

Проекты Услуги Главная Каталог Акции Контакты