Введение
Google Closure Compiler - уникальный инструмент, разработанный Google для сжатия и обфускации собственного javascript.
У него есть ряд интересных особенностей, которые отличают его от прочих упаковщиков.
Вместе с этим, инструмент это достаточно сложный. Основные его фичи скрываются в продвинутом режиме сжатия, для применения которого нужны соответствующие навыки и стиль программирования.
Google Closure Compiler написан на языке Java, причем так, что его достаточно просто расширить - конечно, если вам знакомы понятия компилятора, синтаксического дерева и понятен Java.
Официальная документация находится на http://code.google.com/intl/ru/closure/compiler/docs/overview.html.
На момент написания этой статьи, она, как и сам компилятор, еще в процессе разработки. Во всяком случае, такие слова я слышал от разработчиков компилятора, да и общее состояние текстов и кода на это похоже.
В этом введении мы разберем основные опции компилятора и осуществим компиляцию простых примеров.
Существует 3 способа запуска компилятора:
- Через веб-интерфейс. То есть, зайти на страничку, ввести или загрузить код и скомпилировать его с нужными опциями. Результат появится в текстовом поле.
Этот способ удобен, чтобы поиграться с оптимизациями, понять от чего чего бывает, не более.
Документация по этому способу: http://code.google.com/intl/ru/closure/compiler/docs/gettingstarted_ui.html.
- Через веб-сервис. Этот способ подразумевает отправку POST-запроса на адрес http://closure-compiler.appspot.com/compile. В параметрах запроса описаны флаги компиляции и передан код.
Ответом будет сжатый javascript, либо ошибки компиляции.
Этот способ удобен тем, что на веб-сервис google выкладывает, как правило, последнее стабильное API. Это убирает необходимость в хранении и обновлении компилятора.
Документация по этому способу находится на http://code.google.com/intl/ru/closure/compiler/docs/gettingstarted_ui.html.
- Через приложение. Google Closure Compiler является приложением, написанным на языке java, и распространяется как в виде jar-файла, так и в виде исходных кодов SVN: http://closure-compiler.googlecode.com/svn.
Этот способ - самый гибкий. Он не только не требует наличия интернет,
но и допускает использование собственной сборки компилятора, которая использует внутренние опции, недоступные для флагов.
Сделаем небольшое упражнение по сжатию javascript-файла при помощи приложения Google Closure Compiler.
Для него вам понадобится Java Runtime Environment версии 6.
Этот пример содержит основные шаги для сжатия с использованием Google Closure Compiler.
- Создайте директорию с названием
closure-compiler .
Скачайте файл компилятора compiler.jar и сохраните его в директории closure-compiler .
- Создайте javascript-файл
hello.js :
/* простая функция */
function hello(longName) {
alert('Hello, ' + longName);
}
hello('New User');
Сохраните его в директории closure-compiler .
-
Скомпилируйте javascript-файл. Для этого запустите из директории closure-compiler следующую команду:
java -jar compiler.jar --js hello.js --js_output_file hello-compiled.js
Она сгенерирует новый файл hello-compiled.js , который содержит следующий код:
function hello(a){alert("Hello, "+a)}hello("New User");
Заметьте, что компилятор удалил комментарии, пробелы и лишнюю точку с запятой. Кроме того, он заменил параметр longName на более короткое имя a . В результате получили намного меньший javascript-файл.
Чтобы убедиться, что получившийся файл работает корректно, подключите hello-compiled.js в HTML наподобие следующего:
<html>
<head><title>Hello World</title></head>
<body>
<script src="hello-compiled.js"></script>
</body>
</html>
Загрузите этот HTML-файл в браузер и вы должны увидеть дружеский привет!
Полный список флагов будет выведен при запуске:
java -jar compiler.jar --help
Он довольно длинный и, поначалу, большинство опций будут непонятны.
В этом разделе мы разберем самые основные опции сжатия, которые позволят сразу же делать основные операции по оптимизации javascript.
- --js
- Входной javascript-файл. Этот флаг может повторяться много раз с разными файлами:
--js script1.js --js script2.js ...
В результате получится объединенный сжатый файл.
Все флаги, которые допускают многократное использование, объявляются именно так. То есть, аргументы идут не через запятую, не через точку с запятой, а именно так: много раз один и тот же флаг.
- --js_output_file
- Имя файла для результата сжатия. По умолчанию: выводит в стандартный поток вывода.
- --check_types
- Включает проверку типов компилятором. По умолчанию - выключена. В любом случае, компилятор проверит синтаксическую правильность кода и выдаст ошибку в случае лишних скобок, незакрытых комментариев и т.п.
Более подробно о проверке типов вы можете прочитать в статье Объявление и проверка типов в примерах
- --compilation_level
- Уровень оптимизации, один из: WHITESPACE_ONLY, SIMPLE_OPTIMIZATIONS, ADVANCED_OPTIMIZATIONS. По умолчанию: SIMPLE_OPTIMIZATIONS.
Этот уровень подразумевает безопасные оптимизации и работает сходным образом с ShrinkSafe и YUI Compressor.
WHITESPACE_ONLY - простейший уровень для вырезания комментариев, пробелов и проверки кода на корректность.
Основные оптимизации раскрыты в статьях Оптимизации стандартного режима и Продвинутые оптимизации.
- --formatting
- Определяет форматирование выходного файла. Для печати сжатого файла в более-менее понятном виде, с форматированием и отступами, используйте значение
--formatting PRETTY_PRINT .
Чтобы ответить на этот вопрос, необходимо перечислить основные способы сжатия javascript. Их всего несколько:
- Удаление комментариев, лишних пробелов и прочего мусора через регулярные выражения.
Этот способ использовался в первых компрессорах, таких как JSMin и packer. Позволяет сжать код за счет очистки от заведомо лишних вещей.
- Архивация типа недо-gzip.
Из обычного файла можно сделать исполняемый самораспаковывающийся архив. Аналогично можно поступить с javascript. На этом основан известный упаковщик packer от Dean Edwards. При использовании этого способа код сжимается простеньким алгоритмом компрессии (сжатие со словарем), а то что получится - оборачивается в разархивирующий eval.
Получается такой недо-gzip. Вроде архивация, но слабая. Поэтому этот способ не рекомендуется использовать одновременно с реальным gzip: получится двойное сжатие слабым, а затем сильным алгоритмом. В результате - размер больший, чем просто gzip.
Кроме того, на браузер ложится дополнительная нагрузка по разархивации полученного javascript.
- Сжатие, основанное на структуре кода и сокращении символов.
Этот способ - самый последний. Его используют компрессоры ShrinkSafe, YUI Compressor и Google Closure Compiler.
При сжатии этим методом оптимизатор сначала читает javascript в синтаксическое дерево. Затем он проходит по полученному дереву, заменяет локальные переменные на более короткие и производит оптимизации. Потом по оптимизированному дереву оптимизатор генерирует код, уже с оптимизациями.
Этот способ заведомо превосходит и делает ненужным первый, т.к. знание о структуре кода, получаемое из синтаксического дерева - более правильное и полное, чем из регэкспов.
Google Closure Compiler, как и другие оптимизаторы последнего поколения, не использует регекспов и не производит архивацию (да, с этим прекрасно справляется серверный gzip).
В чем же отличия Google Closure Compiler от других аналогичных оптимизаторов, таких как ShrinkSafe и YUI Compressor?
Отличие кроется в подходе к оптимизации.
В то время как YUI Compressor использует локальные оптимизации, то Google Closure Compiler использует комплексный анализ кода.
Он выполняет гораздо больше оптимизаций, чем и обусловлен лучший результат.
Кроме того, у Google Closure Compiler есть продвинутые оптимизации, аналога которым в других оптимизаторах нет. Есть там и расширенная проверка типов и множество других интересных возможностей, за более подробным описанием которых вы можете обратиться к другим статьям этого раздела.
YUI Compressor работает безопаснее и стабильнее для некоторых видов синтаксических конструкций (eval/with/CC, см. подробнее в статье Оптимизации стандартного режима), но если понимать, что происходит, то и Google Closure Compiler может быть не менее безопасен.
На момент написания статьи, Google не опубликовала утилит для сжатия CSS, а вот YUI Compressor это умеет. Так что выбрасывать его пока рановато.
Но вот для сжатия javascript лучше Google Closure Compiler найти что-либо сложно. Во всяком случае, в открытом доступе
Для сборки компилятора подойдет практически любая ОС, т.к. используются только кросс-платформенные инструменты.
Чтобы собрать компилятор самостоятельно, его исходный код можно получить из SVN. Если у вас установлен стандартный SVN-клиент, то для этого подойдет команда:
svn co http://closure-compiler.googlecode.com/svn/trunk compiler
Последняя версия компилятора будет сохранена в директорию compiler .
Чтобы собрать компилятор, вам понадобится JDK версии 6 и установленный ANT.
Установка ANT довольно проста и описана в статье Installing Ant.
Для запуска достаточно запустить ant в директории с файлом сборки build.xml . После этого готовый к использованию jar-файл будет лежать в директории build .
Если после этого введения какие-то базовые вещи что-то осталось неясными - напишите в комментариях, отвечу. Спасибо.
|
Есть ли прога для компиляции js файлов, а то неудобно через командную строку
Не что не мешает написать bat'ник. Вот мой:
:: ищем js-сценарии в папке source
FOR /R %%i IN (source/*.js) DO (
:: скармливаем их компилятору
java -jar compiler.jar ^
--js source/%%~ni%%~xi ^
--js_output_file compiled/%%~ni-min.js ^
--compilation_level SIMPLE_OPTIMIZATIONS ^
--formatting PRETTY_PRINT
)
Результат сохраняется в папку compiled
Использую WebStorm
вызываем Настройки (ctrl+alt+s)
далее "File Watchers" справа жмем плюс и выбираем closure compiler
Нужно только указать путь до батника и минимум настроек (webStorm по дефолту знаком с Google Closure, sass, YuI - поэтому настраивать почти ничего не нужно)
Очень интересует, разумно ли его применять динамически, прямо на сервере? Раньше я использовал jsmin и минимизировал нагрузку на сервер с помощью кэширования на стороне сервера (если есть кэшированный файл с подходщим контентом, то отдаем его; если нет, генерируем динамически вывод, чистим jsmin'ом, сжимаем, отдаем и попутно создаем файл кэша) - такая тактика хорошо себя показала. Сразу поясню: такие извращения нужны для удобства разработки - в ручную жать 30-40 файлов тяжело.
30-40 файлов??? Что за фигня - если это на одну страницу - то клейте их не задумываясь. Если на разные, то кто Вам мешает написать sh или bat для автоматизации.
Т.е. для сжатия нужна установленная Java-машина, я правильно понимаю? Нет ли у них онлайн сервиса?
2 GreatRash:
On-line compiler:
http://closure-compiler.appspot.com/home
Описание (очень краткое):
http://code.google.com/intl/ru/closure/compiler/docs/gettingstarted_ui.h...
Также можно читать здесь: http://code.google.com/intl/ru/closure/compiler/
Можете мне, нубу в Java, пошагово объяснить, как собрать компилятор?
Я чекаутнул с помощью черепашки исходники, с указанного адреса.
Поставил ant
Запустил ant в контексте директории, в которой лежит build.bat - а он мне
Unable to locate tools.jar. Expected to find it in C:\Program Files\Java\jre7\li
b\tools.jar
Buildfile: c:\GCC\build.xml
rhino:
properties:
init:
compile:
compile-most:
BUILD FAILED
c:\GCC\build.xml:99: The following error occurred while executing this line:
c:\GCC\lib\rhino\build.xml:45: The following error occurred while executing this
line:
c:\GCC\lib\rhino\src\build.xml:38: Unable to find a javac compiler;
com.sun.tools.javac.Main is not on the classpath.
Perhaps JAVA_HOME does not point to the JDK.
It is currently set to "C:\Program Files\Java\jre7"
Total time: 0 seconds
Что я не так делаю?
Недостаточно иметь JRE, для компиляции надо скачать и установить JDK. Судя по сообщениям, у тебя только JRE установлен.
Вот у меня стоит задача удаления dead code из jscript при этом не переименовывать переменные, объекты, функции и т.п. Как можно его заставить сделать "простую оптимизацию", но без переименования? Заранее благодарен.
в точности с "Zenitchik", в Java, непонимаю ничего, с трудом перевариваю джи-ес, но вот то что ссылки битые, то видно всем, ведь инфа старая. Просьба, удалтите старые-битые ссылки! этот синий цвет очень глаза режет... А вообще заинтересовался данной серией статей о компиляторе так как столкнулся с подобным на лён-джи-ес.
Первый случай, когда documentFragment применим - это возврат множества узлов из функции. Можно это сделать возвращением массива, а можно вернуть documentFragment: run 3
Можете мне, нубу в Java, пошагово объяснить, как собрать компилятор?
Я чекаутнул с помощью черепашки исходники, с указанного адреса.
Поставил ant
Запустил ant в контексте директории, в которой лежит build.bat - а он мне
Unable to locate tools.jar. Expected to find it in C:\Program Files\Java\jre7\li
b\tools.jar super mario bros
Buildfile: c:\GCC\build.xml
rhino:
properties:
init:
compile:
compile-most:
BUILD FAILED
c:\GCC\build.xml:99: The following error occurred while executing this line:
c:\GCC\lib\rhino\build.xml:45: The following error occurred while executing this
line:
c:\GCC\lib\rhino\src\build.xml:38: Unable to find a javac compiler;
com.sun.tools.javac.Main is not on the classpath.
Perhaps JAVA_HOME does not point to the JDK.
It is currently set to "C:\Program Files\Java\jre7"
Total time: 0 seconds
Что я не так делаю?
I can't tell you how much I appreciate your website. You most certainly own some incredibly insightful and entertaining anecdotes. word hurdle
This is an excellent article. This is, in my opinion, one of the best posts ever written. Your work is excellent and inspiring. Thank you for posting this article. I act as a test user of game sites to check the safety of those game sites, I noticed a game that is being played a lot by students and is quite safe for everyone. Lol beans is a fun game with adorable and emotional snakes. It is a popular game that attracts people of all genders and ages.
Thank you for providing this information. I am delighted to come on this fantastic article. Waffle game online
Thank you for sharing this article with everyone. I will follow your instructions to apply for my job. wordle unlimited - nyt wordle
The information you share is perfect, I think. There are many articles similar to this on the internet but this is probably the one that I like the most. wordle nyt - wordle
What you share is great and useful to the community, with lots of useful information. Please continue to update. thanks! fnf
Since this is my first time using the forum, there are likely many things that I You have creative hands and minds of great food, really the recipes you share I feel very delicious and beautiful, thank you for sharing these great recipes. am unaware of at this point. I'm expecting to pick up some pointers from the forums, and I'm looking forward to getting to know everyone else that frequents this place. quordle
I was looking for another article by chance and found your article 온라인카지노 I am writing on this topic, so I think it will help a lot. I leave my blog address below. Please visit once.
Hello ! I am the one who writes posts on these topics 바카라사이트추천 I would like to write an article based on your article. When can I ask for a review?
Hi guys! Open to welcoming the first customers in papa's burgeria shop.
Google Closure Compiler is written in Java, and in such a way that it is quite easy to extend it - of course, if you are familiar with the concepts of a compiler, a syntax tree, and Java is understandable. bathroom contractor
Отправить комментарий
Приветствуются комментарии:Для остальных вопросов и обсуждений есть форум.