Компилятор Google Closure с приложениями jQuery

Question

У меня много времени инвестировано в jquery и большое приложение, построенное с ним. Недавно я просматривал Google Closure Library, но в это время нашел, что он не так элегантен, как jquery. Я считаю, что это может иметь некоторый потенциал и будет изучать его больше, но на данный момент я намерен продолжать использовать jQuery в качестве базовой базы.

Однако, я очень впечатлен Google Closure Compiler. Я хотел бы начать использовать его во время процесса сборки моего приложения. К сожалению, не совсем ясно, насколько легко будет использовать его для проектов, которые не соответствуют стандартным стандартам Google Closure.

Есть ли лучшие практики или хорошие ресурсы для разработки проектов на основе jquery и использования компилятора Google Closure? Например:

1. Имеет ли смысл компилировать JQuery и JQuery-UI с ним, или я должен продолжать указывать на эти ресурсы на Google CDN? Я уверен, что мои jquery и jquery-ui будут меньше, поскольку я не использую все функции библиотек, но указание на CDN увеличивает вероятность того, что файл уже находится в кеше посетителя.

2. Мое приложение разделено на и других файлах с файлом на одну функцию. Я хотел бы объединить их в определенном порядке и минимизировать их в файл в разделе на моем сайте. Я бы хотел автоматизировать этот процесс.

3. В настоящее время мой проект имеет java-сервер и построен с Maven. Имеет ли смысл добавить компилятор Google Closure в этот процесс сборки?

В принципе, я ищу любые полезные ресурсы, специфичные для использования компилятора Google Closure с jQuery.

Answer 1

Компилятор Google Closure - это jQuery или любой другой агностик библиотеки. Она имеет два типа оптимизации -

• Простых
• Расширенного

Я попытался применением передовых оптимизации, но это серьезно нарушило мое заявление. Если он сделает то же самое, вы можете либо попытаться исправить ваше приложение, либо использовать простую оптимизацию. Снизилось 32% с простой оптимизацией, а около 68% - с передовыми оптимизациями, но это все равно не получилось.

Перемещение конкатенации JS автоматическим способом в процесс сборки - это, безусловно, путь. См. JavaScript dependency management.

jQuery уже сильно оптимизирован для размера байтов, поэтому я сомневаюсь, что вы сможете сжать достаточное количество сока с помощью Google Closure Compiler, но стоит попробовать в сочетании с вашим проектом.

Я вижу Google Closure Library в благоприятном свете, но не получил его, так как в настоящее время я сильно инвестировал в MooTools. Глядя на это API, похоже, он имеет довольно широкий охват того, что он может предложить, помимо манипуляций с DOM, обработки AJAX, обработки событий и т. Д.

Answer 2

Я считаю, что с 1.4.2 (возможно, раньше), jQuery minified используя Google Closure Compiler по умолчанию. Поэтому, вероятно, лучше продолжить ссылку на jQuery/jQuery UI через Google CDN.Тем не менее, все еще есть преимущества для интеграции компилятора Closure в процесс сборки, чтобы объединить и минимизировать ваши JS-файлы. А именно, уменьшенные запросы JS на загрузку страницы и меньшие данные, передаваемые в надежде улучшить производительность загрузки страницы на стороне клиента. Вот некоторые из проблем, мы столкнулись в процессе интеграции Closure Compiler в наш процесс сборки:

1. Построение команды компиляции - Нам нужны средства вызова компилятора со всеми необходимыми параметрами в автоматическом режиме во время сборки обработать. Для нас это означало запись консольного приложения для создания команды. Если в вашей среде имеется сценарий оболочки, это может быть преимуществом.

2. Управление зависимостями - Компилятор Closure имеет возможность автоматически сортировать порядок объединенной JS, чтобы сохранялись зависимости. Чтобы использовать эту функцию, файлы JS должны быть аннотированы goog.provide\goog.require, чтобы сообщить компилятору, что за зависимости (--manage_closure_dependencies). Компилятор также исключает любую JS, которая не требуется (т. Е. Не ссылается через оператор goog.require) из объединенной JS. Вот несколько вещей, чтобы не упустить:

   • Если вы хотите включить все из вас JS файлов в комбинированном выходе, убедитесь, что вы включаете «манифест» JS файл в компиляции, который содержит только goog.require заявления для каждый файл должен быть включен в комбинированный сценарий (т. е. нет goog.provide операторов).
   • Если вы не используете библиотеку Closure, убедитесь, что вы компилируете с помощью SIMPLE_OPTIMIZATIONS или выше. В противном случае компилятор не удалит операторы goog.provide/goog.require. Кроме того, вы можете также определить свои собственные функции goog.provide/goog.require JS, чтобы избежать ошибок.
   • Убедитесь, что есть no циклические зависимости, или же последствия.

3. Компиляция отладочной версии комбинированного сценария - При необходимости, вы можете скомпилировать отладочную версию комбинированного сценария с использованием --formatting PRETTY_PRINT флага. Это приведет к созданию эквивалентного сценария, отформатированного без пробелов для разработки/отладки.

Хотя документация Closure компилятор может быть редкими временами, это достаточно, чтобы начать работу по большей части и постоянно совершенствуется - так регулярно проверять наличие обновлений, не просто так;)

Надеюсь это поможет.

Answer 3

Tauren, вы можете проверить свой код, используя closure-compiler дома. Вы можете импортировать свою библиотеку JQuery или что-то еще и попробовать. Если возможно, определите свой код JavaScript, используя анонимную функцию, которая позволяет избежать конфликтов имен. Используйте пространства имен, используя библиотеку Google , чтобы обеспечить функцию. Другим полезным ресурсом, который может вам помочь, является Google JavaScript Style Guide

Answer 4

jQuery не совместим (пока) с компилятором Closure в расширенном режиме. Я согласен, что было бы очень удобно сделать его совместимым, потому что его синтаксис с привязкой к методу очень легко дает прототип виртуализации для значительно улучшенной скорости выполнения.

Фактически, среди популярных библиотек JavaScript (кроме библиотеки Closure), только Dojo Toolkit совместим с режимом Closure Advanced.

http://dojo-toolkit.33424.n3.nabble.com/file/n2636749/Using_the_Dojo_Toolkit_with_the_Closure_Compiler.pdf?by-user=t

Answer 5

$(elem)['width']() вместо $(elem).width()

Это работает с ADVANCED_OPTIMIZATIONS, так что закрытие компилятор не реорганизовать методы JQuery.

Answer 6

Using jQuery with closure compiler advanced mode

Answer 7

Получение Jquery хорошо работать с Closure Compiler/расширенным был труден для меня, но так как вы имеете дело с несколькими файлами, я думаю, что это важно, что вы смотрите в опцию модулей здесь:

Using the --module option in Closure Compiler to create multiple output files

Я копаться хорошей документации в Интернете, но есть ОЧЕНЬ ОЧЕНЬ мало. Используя один JQuery EXTERN, я был в состоянии собрать с усовершенствованным штрафом - с несколькими файлами и т.д.

@echo off 
java -jar bin\compiler.jar^
    --compilation_level=ADVANCED_OPTIMIZATIONS^
    --externs "externs\jquery-1.8.js"^
    --language_in=ECMASCRIPT5_STRICT^
    --warning_level=VERBOSE^
    --module_output_path_prefix .\compiled\^
    ^
    --module_wrapper core:"(function(){%%s%%})();"^
    --js ".\corelib.js"^
    --module core:1^
    ^
    --module_wrapper somescript"(function(){%%s%%})();"^
    --js ".\some_other_runtime_loaded_script"^
    --module somescript:1:core^
    ^
    --module_wrapper somescript1:"(function(){%%s%%})();"^
    --js ".\some_other_runtime_loaded_script"^
    --module somescript1:1:core 

описание

--module_wrapper name:wrapper 

Это позволяет обернуть ваши сценарии в затворе - поскольку компилятор по умолчанию удалит их. Если вы используете «использовать строгую», как я, это нет.

--module name:#:dependency 

name  Name of the script that will get written 
#   number of scripts above that line to include into this script 
dependency What script does this depend on? 

Answer 8

Вы можете использовать kjscompiler: https://github.com/knyga/kjscompiler и указать любые библиотеки, как вам нравится внешний. Они не будут минимизированы. Действительно приятное решение.