Как сжать скрипты и стили?

Для оптимизации сайтов мы думаем о том как сжать нам эти HTML, CSS и JavaScript. Конечно же самый делетанский метод — это установить соответствующий плагин для вордпресс или джумлу… и подхватить потом «трипер» от автора сие говна. Сейчас разберем как сжать самому без плагинов и расширений, используя при этом .htaccess. Проверить текущее состояние сжатия сайта можно по

адресуhttp://www.whatsmyip.org/http-compression-test.

Динамический вариант сжатия — добавляем директиву в .htaccess:

# сжатие text, html, javascript, css, xml:

AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/css text/javascript application/javascript application/x-javascript

Статический вариант сжатия — мы сжимаем архиватором скрипты (js, css и тд.) и приводим в формат.gzи закидываем архивы на хост рядом с сжатыми файлами. А в .htaccess прописываем следующую хрень:

# Перенаправление на gzip файлы
AddEncoding gzip .gz
<FilesMatch "\.js.gz$">
ForceType text/javascript
Header set Content-Encoding: gzip

<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 «\.css.gz$»>
ForceType text/css
Header set Content-Encoding: gzip

<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

Третий способ!

Обработчики Apache 2.0 и 2.2 позволяют вам сжать содержимое перед его отправкой в браузер посетителя. Типы содержимого, подлежащие сжатию, задаются типом MIME. Эта функция требует правильной работы команды mod_deflate обработчика Apache.

Добавьте в .htaccess строки:


AddOutPutFilterByType DEFLATE text/html text/plain text/xml

# Netscape 4.x has some problems…
BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems
BrowserMatch ^Mozilla/4.0[678] no-gzip

# MSIE masquerades as Netscape, but it is fine
# BrowserMatch bMSIE !no-gzip !gzip-only-text/html

# NOTE: Due to a bug in mod_setenvif up to Apache 2.0.48
# the above regex won’t work. You can use the following
# workaround to get the desired effect:
BrowserMatch bMSI[E] !no-gzip !gzip-only-text/html

# Don’t compress images
SetEnvIfNoCase Request_URI .(?:gif|jpe?g|png)$ no-gzip dont-vary

# Make sure proxies don’t deliver the wrong content
Header append Vary User-Agent env=!dont-vary

Четвертый способ

FileETag MTime Size
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType application/javascript «access plus 1 year»
ExpiresByType text/javascript «access plus 1 year»
ExpiresByType text/css «access plus 1 year»
ExpiresByType text/html «access plus 7 day»
ExpiresByType text/x-javascript «access 1 year»
ExpiresByType image/gif «access plus 1 year»
ExpiresByType image/jpeg «access plus 1 year»
ExpiresByType image/png «access plus 1 year»
ExpiresByType image/jpg «access plus 1 year»
ExpiresByType image/x-icon «access 1 year»
ExpiresByType image/webp «access plus 1 year»
ExpiresByType image/svg «access plus 1 year»
ExpiresByType image/svg+xml «access plus 1 year»
ExpiresByType image/vnd.microsoft.icon «access 1 year»
ExpiresByType application/x-shockwave-flash «access 1 year»
</IfModule>

Спросил как то у ДЖИНО — как сжать шрифты на сайти? Какую директиву для этого нужно прописать в .htaccess? В итоге мне скинули полный комплект сжатия вообще всего что можно:

<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/css image/webp text/html text/plain
AddOutputFilterByType DEFLATE text/javascript application/javascript application/x-javascript text/x-js text/ecmascript application/ecmascript text/vbscript text/fluffscript
AddOutputFilterByType DEFLATE image/svg+xml text/javascript application/x-font-ttf application/x-font font/opentype font/otf font/ttf application/x-font-truetype application/x-font-opentype application/vnd.ms-fontobject application/vnd.oasis.opendocument.formula-template
AddOutputFilterByType DEFLATE text/xml application/xml application/xhtml+xml
</IfModule>
<IfModule mod_expires.c>
<FilesMatch «\.(ico|gif|jpg|JPG|jpeg|png|PNG|swf|css|js|html?|xml|txt)$»>
ExpiresActive On
ExpiresDefault «access plus 1 month»
</FilesMatch>
</IfModule>
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

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

Ваш e-mail не будет опубликован.

Этот сайт использует Akismet для борьбы со спамом.Узнайте как обрабатываются ваши данные комментариев.