Сжатие javascript файлов
В этой статье рассмотрим online способы сжатия js (jаvascript) файлов для уменьшения их размеров. Сейчас очень много веб-ресурсов используют, как сторонние java скрипты (например, та же jQuery библиотека и многочисленные плагины к ней), так и собственной разработки. Сжатие позволит уменьшить размер загружаемой страницы сайта, а соответственно и время его загрузки. Это один из этапов оптимизации, который желательно проделать всем.
Даже если на сервере используется gzip сжатие, которое несомненно уменьшит размер, не стоит пренебрегать оптимизацией файлов, так как и на распаковку файлов из архива требуется время.
Рассмотрим два наиболее распространенных и эффективных способа сжатия: YUI Compressor и Google Closure Compiler.
YUI Compressor
Использует парсер jаvascript, написанный на языке java, который называется Rhino.
Патченный Rhino сжимает за счет двух основных операций:
- убирает лишние пробельные символы и комментарии
- заменяет имена локальных переменных на более короткие
Официльный сайт Yahoo не предоставляет возможности онлайн сжатия скриптов, но в сети есть сервис
предоставляющий эту возможность.
Сжимать, для примера, будем скрипт мигающего текста:
var blink_text="Blink Text?"
var speed=700
var n=navigator.appName
var ns=(n=="Netscape")
var ie=(n=="Microsoft Internet Explorer")
if (ns){
document.write('<blink>'+blink_text+'</blink>')}
else if (ie){
var verify = 1;
document.write('<div id="blink"></div>')
blink()}
function blink(){
if (verify == 1){
document.all.blink.innerText=blink_text;
verify=0;}
else {
document.all.blink.innerText="";
verify=1;}
setTimeout("blink()",speed);
}
Вставляем код в текстовое поле, выбираем тип файла JS (можно сжимать, также и CSS файлы) и жмем Compress.В результате получим:
- Размер до 489 байт
- После сжатия 417 байт
- Процент сжатия 15%
- После сжатия и упаковки в gzip 270 байт
- Процент сжатия и упаковки в gzip 45%
Google Closure Compiler
Данный инструмент от Google и также, как и YUI эффективно справляется со своей задачей. В отличие от YUI Compressor он имеет официальный онлайн сервис сжатия
Для сжатия используем всё тот же код. Вставляем его в текстовое поле и жмем Compile.
В правой части окна получим сжатую версию
- Размер до 439 байт
- После сжатия 390 байт
- Процент сжатия 11,16%
- После сжатия и упаковки в gzip 255 байт
- Процент сжатия и упаковки в gzip 6,25%
Google Closure Compiler, если судить по размерам файла после сжатия, 390 байт против 417 байт у YUI Compressor уменьшает более эффективно. Эффективнее (в данном примере) на 6,5 %, однако странно, что исходный размер скрипта, оба сервиса определяют по разному.
Использовать можете любой сервис.
Восстановление скрипта в исходное состояние
А чтобы ваш сжатый jаvascript файл вернуть опять в удобочитаемый вид воспользуемся онлайн сервисом