Главная » Создание сайта, раскрутка сайта

Динамическое и статическое сжатие передаваемых данных

динамическое и статическое сжатие данных

Статическое и динамическое сжатие CSS-стилей и JS-скриптов

Я уже писал статью про сжатие передаваемых данных на сайте под руководством CMS WordPress методом gzip. Тогда я описал два способа сжатия передаваемых данных: динамическое и статическое сжатие. Для динамического сжатия я предложил пользоваться услугами специального плагина, а для статического сжатия привел код для файла .htaccess и некоторые необходимые действия. Данный пост полностью повторит ту тему, с той лишь разницей, что тут будут представлены другие инструменты сжатия. А это значит, что Вы можете использовать любой из приведенных методов статического и динамического сжатия.

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

Динамическое сжатие передаваемых данных

На момент написания предыдущей статьи, я пользовался услугами плагина Hyper Cache для динамического сжатия передаваемых данных. Это означает то, что данные, которые запросил конечный пользователь, сначала сжимаются на сервере и только потом отправляются конечному пользователю. Браузер пользователя принимает эти данные, разархивирует их и предоставляет на суд пользователя. Минус динамического сжатия состоит в том, что необходимость сжатия передаваемых данных тяжелым грузом ложится на плечи Вашего сервера. Разархивировать сжатый пакет для браузера пользователя не большая проблема. А вот сервер один. И если много пользователей одновременно будут просить сервер уделить им своё процессорное время, то очень скоро Ваш хостер может попросить Вас перейти на более дорогой и более производительный тариф, что может ударить по Вашему карману. А посему, необходимо запастись хорошим хостингом.

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

ob_start(«ob_gzhandler»);

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

Статическое сжатие передаваемых данных

Думаю сейчас нужно уточнить, что выше и ранее приведенные способы динамического сжатия передаваемых данных не действуют на стили CSS и скрипты JavaScript. И именно для них необходимо настроить статическое сжатие. Кроме того, что эти файлы будут статически архивированы на сервере, их объем можно дополнительно уменьшить. Для этого я советую Вам ознакомится со статьями Как сжать CSSстили и Как сжать JavaScript.

Под статическим сжатием данных подразумевается сжатие файлов ручками администратора сайта. Если при динамическом сжатии все операции по сжатию данных производил сервер, то при статическом сжатие придется поработать администратору сайта. Это означает, что Вам придется залить на сервер уже сжатые .css и .js-файлы. Сжимать придется вручную. Сжимать придется абсолютно все(желательно) .css и .js-файлы, так как код, который Вы впишете в файл .htaccess, будет при любом запросе направлять на сжатую версию файла. Сервер будет отправлять пользователя к несжатому файлу только если его браузер не поддерживает сжатие gzip. А в наше время такие браузеры уютно разместились в Красной книге.

Итак, начнем наше статическое сжатие передаваемых файлов. Вы должны создать архивы всех .css и .js файлов, которые есть в корневом каталоге Вашего сайта. Для этих целей лучше предварительно скачать весь корневой каталог к себе на компьютер. Для этих целей лучше использовать файловый менеджер и FTP-сервер. В отличии от первого поста, Вам не нужно будет переименовывать файлы. Так, если Ваш стиль носит имя style.css, то к концу всех мероприятий в той же папке должны лежать файлы style.css и style.css.gz.

А теперь по-подробнее про процесс статического сжатия. Для сжатия используйте программу 7-Zip(думаю, что вполне возможно использование любого другого архиватора, который имеет нижеприведенные настройки). При создании архива убедитесь в том, что выставлены следующие настройки:

динамическое и статическое сжатие передаваемых данных

Когда Вы создадите архивы всех .css и .js-файлов, Вам необходимо будет открыть Ваш файл .htaccess и внести туда следующий код:

### 1. Обработка js-файлов
<FilesMatch «\.js.gz$«>
ForceType text/javascript
Header set Content-Encoding: gzip
</FilesMatch>
<FilesMatch «\.js$„>
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} !“.*Safari.*»
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule (.*)\.js$ $1\.js.gz [L]
ForceType text/javascript
</FilesMatch>
### 2. Обработка css-файлов
<FilesMatch «\.css.gz$«>
ForceType text/css
Header set Content-Encoding: gzip
</FilesMatch>
<FilesMatch «\.css$„>
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} !“.*Safari.*»
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule (.*)\.css$ $1\.css.gz [L]
ForceType text/css
</FilesMatch>

После этого, Вам необходимо залить(если Вы скачивали корневой каталог к себе на компьютер) корневой каталог обратно на сервер. Убедиться в том, что статическое сжатие данных работает, можно с помощью сервиса Page Speed от Google. Если после анализа Вашего сайта Вы увидите сообщение Включите сжатие, в котором не будут перечислены файлы .css и .js, или Вы вообще не увидите такое сообщение, то всё шикарно. Если же такое сообщение появилось, то либо Вы где-то ошиблись, либо я не так объясняю…

Всего Вам доброго. Да прибудет с Вами динамическое и статическое сжатие передаваемых данных.

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

Ваш комментарий появится после модерации.