Ноя 01
2008Минификация и Gzip CSS + JS файлов.
Рубрики: (css & js minifier, nginx, Полезные штуки, Утилиты) Автор: phpdude 01-11-2008
Теги : apache, css, js, nginx, phpdude css & js minifier, ПИЗДАТО, полезные штуки
привет все, думаю все надеются что этот блог уже умер, какбы не так
)
Короче затея.
Мне жутко понравился nginx веб сервер.
Есть крупный проект, на котором есть много яваскриптов, ксс файлов. задача: сделать загрузку максимально быстрой и не требовательной к веб серверу.
Если бы не использовать мои методы, то пришлось бы загружать порядка 15-20 js файлов и порядка 10 css файлов.
Сейчас, я пишу ссылку на src тега script в виде и получаю файл, который является слитым из перечисленных файлов + minify + gzip. это хорошо, очень хорошо
http://sitename.ru/js/images.js,jquery/jquery.js,I18n/data/ru.js ,I18n/I18n.js,jquery/plugins/jquery.jgrowl.js,jquery/plugins/ jquery.cookie.js,jquery/plugins/ui/ui.core.js,jquery/plugins/ ui/ui.sortable.js,jquery/plugins/ui/ui.slider.js,captcha.js, editor/editor.js,jquery/plugins/jquery.autocomplete.pack.js, index.js,tags/Tags.js,jquery/plugins/jquery.blockUI.js,slider/ Slider.js,comments/Comments.js,jquery/plugins/jquery.scrollTo.js, swfobject.js,ping.js,favourites/ favourites.js,vote/vote.js,jquery/plugins/jquery.sprintf.js соответственно http://sitename.ru/css/index.css,editor.css,sortable.css,jquery.autocomplete.css,tags.css,slider.css, comments.css,vote.css,jquery.jgrowl.css
Архитектура – есть пхп файл, который обслуживает эти запросы.
прелесть в том, что! сейчас вместо 40 запросов к серверу идет один, но я думаю что массы возразят, зато запрос – вызов пхп скрипта и лялля!
)
Короче суть в том, что пхп скрипт только генерит файлы кеша для css,js файлов, а nginx проверяет, есть ли они, если есть – показывает их, если нет – проксирует запрос апача, а тот в свою очередь на пхп генерит эти файлы на будущее (для nginx).
Не буду таить выкладываю исходники для возведения этой шняги.
Прелесть!
Самое то пиздатое в том, что отдается сейчас гзип версия через nginx!!!
часа 4 делал, заебался разбираться, по nginx’y не хорошей документации, а примеры окторые в интернете – гавно ебаное, они только путают
Необходимая конфигурация веб сервера nginx.
location ~* /(js|css)/.*\.(css|js)$ {
expires 10d;
rewrite /(css|js)/[0-9]+/(.*) /$1/$2 last;
if (-f /sites/sitename.ru/html/secure/tmp/$uri)
{
rewrite (.*) /secure/tmp$1 break;
}if (!-f /sites/sitename.ru/html/secure/tmp/$uri)
{
proxy_pass http://127.0.0.1:8080$uri;
break;
}
}
Писал php код по быстрому, возможны ошибки, во с виду чистенько все
Спасибо кто со мной, только оставляйте комментарии, а то пишу пишу … скучно писать в никуда:)
Полезное хоть пишу то?)
УДАЧИ! НАХУЙ!!!
)
Всея ПЫХА
adw0rd
Мавр
ГО
Irinax
К сожалению, до уровня данного поста ещё не дорос, но в целом полезные вещи на блоге нашел. И парочкой из них уже успел воспользоваться.
Так что в моем случае более полезными кажутся простые примеры, которые не тяжело будет разбирать неопытным в ПХП пользователям. Но как бы то ни было – полезное пишите, сто пудов
это микрооптимизация. на самом деле полезная вещь, нужна при разработчке не домашней страницы – минимизация передаваемого трафика по сети + прозрачность. прозрачность это то, что у меня на девелопер сервере не настроен nginx и его эта правила не трогают, он все запросы обрабатывает, но мне этого и надо, а вот на реальном веб сервере настроен nginx, так что он отдает только кеши файлов, кто снижает процессорное время + количество вызовов пхп скриптов на одну генерацию страницы (получается один вызов на одну страницу, было 3). плюсы налицо мне кажется)
однозначно полезно, только полгода уже как не могу уломать нашего технолога разнести большой css на маленькие для оптимизации страниц(((
ну я на маленькие разнес по идее то, но клиенту все таки решил отдавать одним файлом, чтобы запросов поменьше. а то 100 оналйн – 3000 щапросов. нахуй надо )
есть еще вариант настроить в nginx expire далеко в будущее, котроллировать картинки суффиксами «?123″, берущимися из даты. под эту статью попадут и js и css.
какоето время назад так и сделал, только поэтому еще не пересобрал с gzip static
я думал не о суфиксах, а о префиксах
например в админке я могу указать дату рулиза, допустим
20081110
и тогда урл
/js/2008/11/10/lalalallall.js
хотя в этом варианте напряг – модуль реврайта, хотя напряг ли это по сравннеию с тем же скл запросов пусть даже кешированным на стороне мускуля
идея этого скрипта не только в настройках нгинкс, тут плюс – я подобрал два минификатора – ксс и жс, которые сами сжимают неплохо жс и ксс
а гзип это уже так
модуль static_gzip думаю настрою, мне просто сразу в трех ветках одной системы надо переделывать … не хочу ночь залазить)