- PVSM.RU - https://www.pvsm.ru -
Подробные инструкции, которые даются на code.google [1] позволят вам:
Всё это будет происходить при запуске единственного скрипта compress.php
Для примера, результат сжатия скриптов моего сайта:
Получается, что экономия трафика составляет 329270 b. Но основной выигрыш для скорости загрузки в том, что теперь загружается не 14 файлов, а всего 2. (а это намного быстрее, так как браузер не тратит время на запросы)
В итоге, получится:
<link rel="stylesheet" type="text/css" href="min/styles_1349888114.cssgz" />
<script src="min/all_1349888114.jsgz" /></script>
Инструкции на удивление просты:
require_once('compress_timestamp.php'); //загрузить timestamp сохранённый в файле, чтобы обмануть кэширование. Устанавливает $compress_stamp=unix_timestamp
if (stripos($_SERVER['HTTP_ACCEPT_ENCODING'],'GZIP')!==false)
$gz='gz';
else
$gz=null;
echo '<script src="min/js_schedule_'.$compress_stamp.'.js'.$gz.'" />',PHP_EOL;
echo '<link rel="stylesheet" type="text/css" href="min/css_schedule_'.$compress_stamp.'.css'.$gz.'" />',PHP_EOL;
file_compress('css_schedule.css',array('./CSS/menu.css', './CSS/ThreeColumnFixed.css', './CSS/sprite.css', './CSS/iCal.css'));
file_compress('js_schedule.js',array('./js/all1.js', './js/jquery.js', './js/love_habrahabr.js', './love_4pda.js'));
Именно ради этих волшебных функций (пакующих в один файл и сжимающих его) мы всё и затевали. Необходимые файлы создадутся в папке MIN в варианте GZipped и обычном. Если браузер старый, будет выдаваться обычный формат JS и CSS, если новый то JSGZ и CSSGZ.
*для простоты мы сохраняем все файлы в корень сайта, но лучше этого не делать в целях безопасности
Теперь ваш сайт загружается быстрее, код ваших JS и CSS труднее расшифровать любителям чего нибудь поломать.
Каждый раз, когда вы меняете скрипты на сайте, нужно запустить compress.php перед загрузкой сайта, всё остальное происходит автоматически.
Не забывайте, что ссылки на картинки в ваших стилях CSS теперь должны вызываться с учётом того, что CSS находится в папке MIN.
Если хотите ещё больше ускорить сайт, есть простое решение. Установите заголовки статических файлов такими, чтобы браузеры их кэшировали на долго. Это можно сделать, если положить в корень сайта файл .htaccess:
## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType audio/mp3 "access 1 year"
ExpiresByType audio/wav "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>
## EXPIRES CACHING ##
Послесловие: Статья нацелена на новичков, так как профи уже всё это делают при помощи сложных громоздких платформ. Надеюсь кому то из новичков пригодится и сайты в интернете станут быстрее, экономя нам драгоценные секунды. Если что не так, пишите в комментариях.
Автор: imater
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/google/16968
Ссылки в тексте:
[1] code.google: http://code.google.com/p/compress/
[2] compress.php: http://code.google.com/p/compress/downloads/list
[3] cssmin.php: http://code.google.com/p/cssmin/downloads/list
[4] jsmin.php: https://github.com/rgrove/jsmin-php/
Нажмите здесь для печати.