Блог Андрія Огороднікова Хто з мечем до нас прийде, від меча й загине.

Скоростная оптимизация — 2. Gzip

08.10.2016, 03:43

gzip_compressed, 68 процентов сжатия, 200 кб против 60 кб

И это хорошо. Потому что достигается просто. Если ваш сервер Apache (коих подавляющее большинство), достаточно добавить в корневой файл .htaccess вот такой простейший код:

<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
Header append Vary User-Agent
</IfModule>

Этот код дает команду серверу на лету сжимать, «архивировать» файлы вашего сайта, которые отдаются по запросу посетителя. Вместо того, чтобы загружать 200 кб, посетитель получит 60. А его браузер на том же лету файлы распакует. На моем сервере сжатие заняло 2 (две) миллисекунды. Учитывая, что 300 миллисекунд уходит на весь запрос, это сущая ерунда.

Для простых сайтов — это чудесная штука. Но вот не так просто рекомендовать включать сжатие на сервере для сложных динамических, когда сразу задействуются множество запросов и увеличивается нагрузка на сервер.

Но. Можно кое-что проделать вручную. Например, сжать большие файлы стилей, статических страниц или скриптов. Картинки сжимать нет смысла, jpg уж точно. A bmp давно канул в лету.

Порядок действий прост. Мы берем архиватор (да вот хоть привычный мне 7zip, я лет 10 не пользуюсь никаким другим) и сжимаем в формат gzip нужные файлы один за одним.

Вместо knopka-zashibis.js 100500 кб, у нас должен выйти knopka-zashibis.js.gz 100 кб.

Теоретически, достаточно вписать его в прежнюю ссылку ~ <script src="js/knopka-zashibis.js.gz"></script>. Современные браузеры все понимают и прощают. И при взгляде на код будет понятно, заархивирован файл или нет.

Но если это не сработает, то весь остальной труд будет напрасен. Поэтому ! — knopka-zashibis.js.gz мы снова переименовываем в knopka-zashibis.js. Но только нужно какую-то памятку создать, для самого себя или тех, кто будет код читать, например добавить комментарий <script src="js/knopka-zashibis.js"></script><!--Осторожно, злой архив-->.

Печально то, что для новых и промежуточных браузеров описанное выше работает и приносит всем радость. Но если мы скормим gzip старому Ослу, он подавится. И тут каждый решает для себя эту дилемму. Класть с прибором на заскорузлых ословодов или вставлять костыли.

Во втором случае, мы альтруистично оставляем на сервере и несжатый файл! Переименовываем его, скажем в knopka-zashibis.old.js.

Все несжатые файлы нужно по этой схеме переименовать последовательно — style.old.css и так далее.

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

<IfModule mod_rewrite.c>
        RewriteEngine On
        RewriteCond %{HTTP:Accept-encoding} !gzip [OR]
        RewriteCond %{HTTP_USER_AGENT} Konqueror
        RewriteRule ^(.*)\.(css|js)$ $1.old.$2 [QSA,L]
</IfModule>
<IfModule mod_headers.c>
        Header append Vary User-Agent
        <FilesMatch .*\.(js|css)$>
               Header set Content-Encoding: gzip
               Header set Cache-control: private
        </FilesMatch>
       <FilesMatch .*\.old\.(js|css)$>
               Header unset Content-Encoding
        </FilesMatch>
</IfModule>

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

Для тонкой подстройки сайта на обычных виртуальных хостингах, на которых лежат большинство блогов (мало кто имеет свой сервер или выделенный сервер), файл .htaccess — чудесная штука. Чаще всего доступа к настройкам сервера у пользователя хостинга нет, да и нет резона править какие-то конфиги. .htaccess позволяет очень гибко оптимизировать сайт, в том числе и по скорости.

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