3 практических совета по оптимизации сайта на Joomla

Многие профессиональные разработчики и любители создавать сайты выбирают Joomla в качестве системы управления. Причин этому много: простота администрирования и универсальность, наличие множества шаблонов, большое число расширений контента для сайта (слайдеров, форм обратной связи, опросов и прочее).

Однако, ни для кого не секрет, что за универсальностью Joomla кроется один из ее подводных камней – ресурсоемкость. Особенно, это касается сайтов, где установлены тяжеловесные расширения, например, Virtuemart. Большинство пользователей не любит ждать, когда страница сайта грузится дольше 3-5 секунд. О том, как оптимизировать работу сайта на Joomla и пойдет речь далее.

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

Около 70-80% времени отклика пользователя тратится на отрисовывание интерфейса (читай дизайна сайта). Большая часть этого времени – это загрузка всех элементов страницы: картинок, css-таблиц, скриптов и т.д.

Уменьшение числа компонентов сводит к минимуму количество HTTP-запросов, необходимых для отображения странички и, следовательно, ускоряет ее загрузку. Итак, как же уменьшить число http-запросов?

 

Шаг 1: используем CSS-спрайты.

Как работает CSS-спрайт: допустим у вас на странице 10 небольших изображений, и, следовательно, понадобится 10 запросов.

Объединяем все картинки в один файл (вручную, с помощью Photoshop или любой другой программы, которая способна автоматически генерировать спрайты из множества изображений). 1 файл – 1 запрос, как вы понимаете.

Для дальнейшего отображения на сайте используем свойства css: background-image и background-position.

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

 

Шаг 2: используем сжатые JS-библиотеки.

Например, многие пользуются фреймворком JQuery, который поставляется в нормальном и minified варианте. Minified и означает сжатый исходный код js.

Существуют также плагины для упаковки в один файл всех css и js под Joomla.

Яркий пример – CssJsCompress. Помимо перечисленного выше, плагин может:

- минимизировать HTML-код (записывает все в одну строку)

- предлагает Gzip сжатие для файлов js и css

 

Шаг 3: используем expires-заголовки.

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

Пример настройки для сервера apache:

  • Включаем в конфигурационном файле mod_expires.
  • В .htaccess добавляем примерно следующее:

<IfModule mod_expires.c> ExpiresActive On ExpiresDefault "access plus 7 days" ExpiresByType image/gif "access plus 1 month" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType text/css "access plus 1 month" ExpiresByType text/javascript "access plus 1 week" ExpiresByType application/x-javascript "access plus 1 week" </IfModule>

Следует помнить, что в случае постоянно обновляемых скриптов все строчки про них следует убрать.

Не забываем периодически чистить кэш (в админ-панели joomla есть соответствующие функции).

Еще немного ускорить отображение страницы поможет следующее правило: css файлы располагаются в HEAD, а тяжеловесные js чем ниже тем лучше. 

Правда, работает это не всегда, поскольку если у вас на сайте множество анимации и эффектов, связанных с js, то независимо от того, насколько быстро прогрузится HTML, страница будет выглядеть неполной до завершения загрузки скриптов.

 

На этом все, надеюсь, материал был вам полезен.

Николай

15.07.2014

Понравилась статья? Поделитесь с друзьями!

Добавить комментарий


Защитный код
Обновить