Разработчики, использующие Bundle Transformer, часто спрашивают у меня: «Какой минимизатор обладает самой высокой степенью сжатия?». В принципе, в сентябре прошлого года в своей статье «Вышел Bundle Transformer 1.6.2 или что изменилось за полгода?» я уже проводил сравнение минимизаторов по степени сжатия кода, но это сравнение было поверхностным и не было подкреплено цифрами.
В этой краткой статье мы проведем сравнение наиболее популярных алгоритмов минимизации CSS- и JS-кода на примере адаптеров-минимизаторов из Bundle Transformer. В качестве исходных файлов будут использоваться файлы bootstrap.css
и bootstrap.js
из Twitter Bootstrap версии 2.3.2. Измерять размеры файлов мы будем с помощью YSlow.
Сравнение минимизаторов CSS-кода
Размер исходного файла bootstrap.css
составляет 127,3 КБ, а после применения GZip-сжатия — 27,9 КБ. В таблице приведена информация о размерах файлов, полученных путем применения к файлу bootstrap.css
различных алгоритмов CSS-минимизации:
Адаптер-минимизатор | Алгоритм минимизации | Размер после минимизации | Экономия | Размер после минимизации с GZip-сжатием | Экономия при GZip-сжатии |
---|---|---|---|---|---|
YuiCssMinifier | YUI CSS Compressor for .Net 2.2.0.0 | 106,0 КБ | 16,73% | 24,5 КБ | 12,19% |
MicrosoftAjaxCssMinifier | Microsoft Ajax CSS Minifier 4.92 | 105,7 КБ | 16,97% | 24,5 КБ | 12,19% |
KryzhanovskyCssMinifier | CSSO 1.3.7 | 105,6 КБ | 17,05% | 24,6 КБ | 11,83% |
WgCssMinifier | WebGrease Semantic CSS Minifier 1.3.0 | - | - | - | - |
Из таблицы видно, что наилучший результат показал минимизатор CSSO (CSS Optimizer) от компании Яндекс. Основным достоинством данного минимизатора является поддержка структурной минимизации CSS-кода (о структурной минимизации можно более подробно прочитать на сайте методологии БЭМ).
К сожалению, структурный минимизатор от компании Microsoft — WebGrease Semantic CSS Minifier, выбыл из борьбы, потому что не смог минимизировать файл bootstrap.css
.
Другой минимизатор от Microsoft — Microsoft Ajax CSS Minifier наоборот показал очень хороший результат по сравнению со своим основным конкурентом YUI CSS Compressor for .Net.
Сравнение минимизаторов JS-кода
Размер исходного файла bootstrap.js
составляет 61,9 КБ, а после применения GZip-сжатия — 16,9 КБ. В таблице приведена информация о размерах файлов, полученных путем применения к файлу bootstrap.js
различных алгоритмов JS-минимизации:
Адаптер-минимизатор | Алгоритм минимизации | Размер после минимизации | Экономия | Размер после минимизации с GZip-сжатием | Экономия при GZip-сжатии |
---|---|---|---|---|---|
CrockfordJsMinifier | JSMin от 22.05.2007 | 34,5 КБ | 44,26% | 11,1 КБ | 34,32% |
EdwardsJsMinifier | Packer 3.0 | 31,3 КБ | 49,43% | 10,4 КБ | 38,46% |
YuiJsMinifier | YUI JS Compressor for .Net 2.2.0.0 | 28,8 КБ | 53,47% | 10,0 КБ | 40,83% |
ClosureLocalJsMinifier | Closure Compiler Application от 11.04.2013 (режим Simple) | 28,1 КБ | 54,60% | 9,7 КБ | 42,60% |
MicrosoftAjaxJsMinifier | Microsoft Ajax JS Minifier 4.92 | 28,3 КБ | 54,28% | 9,8 КБ | 42,01% |
UglifyJsMinifier | UglifyJS 2.3.6 | 28,3 КБ | 54,28% | 9,8 | 42,01% |
Как и следовало ожидать, 1-е место занял минимизатор Closure Compiler от компании Google. Следует также отметить, что в режиме Advanced
можно достичь еще более лучших результатов.
Как и в случае с CSS-минимизацией Microsoft Ajax JS Minifier обошел YUI JS Compressor for .Net. Кроме того, при сжатии файла bootstrap.js
Microsoft Ajax JS Minifier и UglifyJS показали одинаковый результат и оба заняли 2-е место.
Старейшие минимизаторы JSMin и Packer показали худшие результаты. Кроме того, код, минимизированный Packer, содержал ошибки.
Выводы
Безусловно, в битве минимизаторов победили поисковые гиганты Яндекс и Google.
Но и компания Microsoft не сидела сложа руки: хоть команда Рона Логана еще не выпустила стабильную версию WebGrease Semantic CSS Minifier, но они смогли поднять Microsoft Ajax Minifier на совершенно новый уровень.
UglifyJS по-прежнему можно считать JS-минимизатором №2 в мире.
Вообще, если смотреть объективно, то все современные алгоритмы минимизации, пройдя долгий путь эволюции, на данный момент имеют практически одинаковую степень сжатия.
Опрос
В заключении статьи предлагаю вам принять участие в опросе:
Автор: Taritsyn