Как вы автоматизируете миниатюра Javascript для своих веб-приложений Java?
Мне интересно узнать, как вы предпочитаете автоматизировать миниатюра Javascript для своих веб-приложений Java. Вот несколько аспектов, которые меня особенно интересуют:
- Как он интегрируется? Является ли он частью вашего инструмента сборки, фильтра сервлета, автономной программы после обработки файла WAR или чего-то еще?
- Можно ли легко включать и отключать? Очень неудобно пытаться отлаживать миниатюрный script, но также полезно, чтобы разработчик смог проверить, что мини-код ничего не сломает.
- Работает ли он прозрачно или имеет какие-либо побочные эффекты (помимо тех, которые присущи минимализации), которые я должен учитывать в своей повседневной работе?
- Какой minifier он использует?
- Имеет ли отсутствие каких-либо функций, о которых вы можете думать?
- Что вам нравится?
- Что вам не нравится?
Это будет главным образом служить в качестве ссылки для моих будущих проектов (и, надеюсь, другой SOER тоже будет очень информативным), поэтому интересны всевозможные инструменты.
(Обратите внимание, что это не вопрос о том, какой minifier лучший. У нас уже много таких.)
Ответы
Ответ 1
Закрытое сообщение
Если вы публикуете что-то новое в этом потоке, отредактируйте это сообщение, чтобы связаться с вашим.
Ответ 2
Мы используем задачу Ant, чтобы минимизировать js файлы с YUICompressor во время сборки сборки и поместить результат в разделенную папку. Затем мы загружаем эти файлы на веб-сервер. Вы можете найти несколько хороших примеров интеграции YUI + Ant в этом блоге.
Вот пример:
<target name="js.minify" depends="js.preprocess">
<apply executable="java" parallel="false">
<fileset dir="." includes="foo.js, bar.js"/>
<arg line="-jar"/>
<arg path="yuicompressor.jar"/>
<srcfile/>
<arg line="-o"/>
<mapper type="glob" from="*.js" to="*-min.js"/>
<targetfile/>
</apply>
</target>
Ответ 3
Я считаю, что одним из лучших и правильных инструментов для работы является wro4j Отъезд https://github.com/wro4j/wro4j p >
Он делает все, что вам нужно:
- Хорошо организованные веб-ресурсы проекта (js и css)
- Объединить и минимизировать их во время выполнения (используя простой фильтр) или время сборки (используя плагин maven)
- Бесплатный и открытый исходный код: выпущен под лицензией Apache 2.0
- несколько инструментов минимизации, поддерживаемых wro4j: JsMin, компрессор Google Closure, YUI и т.д.
- Очень проста в использовании. Поддерживает сервлет-фильтр, обычную Java или Spring Конфигурация
- Поддержка метаданных Javascript и CSS: CoffeeScript, Less, Sass и т.д.
- Проверка: JSLint, CSSLint и т.д.
Может работать как в режиме отладки, так и в режиме производства. Просто укажите все файлы, которые он должен обрабатывать/предварительно обрабатывать, и все остальное.
Вы можете просто включить объединенный, сокращенный и сжатый ресурс, например:
<script type="text/javascript" src="wro/all.js"></script>
Ответ 4
Я написал макросы ant для компилятора Google Closure и Yahoo-компрессора и включил этот файл в различные веб-проекты.
<?xml version="1.0" encoding="UTF-8"?>
<!-- CSS and JS minifier. -->
<!DOCTYPE project>
<project name="minifier" basedir=".">
<property name="gc" value="compiler-r1592.jar" />
<property name="yc" value="yuicompressor-2.4.6.jar" />
<!-- Compress single js with Google Closure compiler -->
<macrodef name="gc-js">
<attribute name="dir" />
<attribute name="src" />
<sequential>
<java jar="${gc}" fork="true">
<!--
- - compilation_level WHITESPACE_ONLY | SIMPLE_OPTIMIZATIONS | ADVANCED_OPTIMIZATIONS
Specifies the compilation level to use. Default: SIMPLE_OPTIMIZATIONS
- - warning_level QUIET | DEFAULT | VERBOSE
Specifies the warning level to use.
-->
<arg line="[email protected]{dir}/@{src}.js" />
<arg line="[email protected]{dir}/@{src}-min-gc.js" />
</java>
</sequential>
</macrodef>
<!-- Compress single js with Yahoo compressor -->
<macrodef name="yc-js">
<attribute name="dir" />
<attribute name="src" />
<sequential>
<java jar="${yc}" fork="true">
<arg value="@{dir}/@{src}.js" />
<arg line="-o" />
<arg value="@{dir}/@{src}-min-yc.js" />
</java>
</sequential>
</macrodef>
<!-- Compress all js in directory with Yahoo compressor -->
<macrodef name="yc-js-all">
<attribute name="dir" />
<sequential>
<apply executable="java" parallel="false">
<fileset dir="@{dir}" includes="*.js" excludes="*-min*.js" />
<arg line="-jar" />
<arg path="${yc}" />
<srcfile />
<arg line="-o" />
<mapper type="glob" from="*.js" to="@{dir}/*-min-yc.js" />
<targetfile />
</apply>
</sequential>
</macrodef>
<!-- Compress all css in directory with Yahoo compressor -->
<macrodef name="yc-css-all">
<attribute name="dir" default="${build.css.dir}" />
<sequential>
<apply executable="java" parallel="false">
<fileset dir="@{dir}" includes="*.css" excludes="*-min*.css" />
<arg line="-jar" />
<arg path="${yc}" />
<arg line="-v --line-break 0" />
<srcfile />
<arg line="-o" />
<mapper type="glob" from="*.css" to="@{dir}/*-min.css" />
<targetfile />
</apply>
</sequential>
</macrodef>
</project>
-
Интеграция: <import file="build-minifier.xml" />
в вашем файле build.xml, а затем вызовите как обычно ant задачи: <gc-js dir="${build.js.dir}" src="prototype" />
<yc-js-all dir="${build.js.dir}" />
-
Выбор двух minifiers: компилятора Google Closure и компрессора Yahoo, вы должны загрузить их вручную и разместить рядом с файлом xml
-
Minifiers пропустить уже сжатые файлы (заканчивающиеся на -min*
)
-
Обычно я делаю три версии script: несжатый (например, prototype.js
) для отладки, сжатый компилятором закрытия (prototype-min-gc.js
) для производственного сервера, сжатый с помощью Yahoo (prototype-min-yc.js
) для устранения неполадок, закрывающий компилятор использует рискованные оптимизации и иногда создает недопустимый сжатый файл, а компрессор Yahoo более безопасен
-
Yahoo-компрессор может минимизировать все файлы в директории с одним макросом, компилятор Closure не может
Ответ 5
Я пробовал два способа:
- с использованием фильтра сервлета. В режиме производства фильтр активируется и сжимает любые данные, ограниченные URL-адресом, например *.css или *.js
- с помощью maven и yuicompressor-maven-plugin; сжатие выполнено una-tantum (при сборке производственной войны)
Конечно, последнее решение лучше, так как оно не потребляет ресурсы во время выполнения (мой webapp использует движок Google), и это не усложняет ваш код приложения. Поэтому предположим, что этот последний случай в следующих ответах:
Как он интегрируется? Является ли это частью вашего инструмента сборки, фильтра сервлетов, автономной программы после обработки файла WAR или чего-то еще?
с помощью maven
Легко ли включать и отключать? Очень неудобно пытаться отлаживать миниатюрный script, но также полезно, чтобы разработчик смог проверить, что мини-код ничего не сломает.
вы активируете его только при сборке финальной войны; в режиме разработки вы видите несжатую версию своих ресурсов.
Работает ли он прозрачно или имеет какие-либо побочные эффекты (кроме тех, которые присущи мини-классификации), которые я должен учитывать в своей повседневной работе?
абсолютно
Какой minifier он использует?
Компрессор YUI
Не хватает ли каких-либо функций, о которых вы можете думать?
нет, он очень полный и простой в использовании
Что вам нравится?
он интегрирован с моим любимым инструментом (maven), и плагин находится в центральном хранилище (хороший гражданин maven)
Ответ 6
Мне кажется, вам нужна библиотека сжатия, например, тег Granule.
http://code.google.com/p/granule/
Это gzip и объединяет javascripts, обернутые g: compress тегом, используя разные методы, также имеет задачу Ant
пример кода:
<g:compress>
<script type="text/javascript" src="common.js"/>
<script type="text/javascript" src="closure/goog/base.js"/>
<script>
goog.require('goog.dom');
goog.require('goog.date');
goog.require('goog.ui.DatePicker');
</script>
<script type="text/javascript">
var dp = new goog.ui.DatePicker();
dp.render(document.getElementById('datepicker'));
</script>
</g:compress>
...
Ответ 7
Наш проект обработал его несколькими способами, но мы продолжаем использовать YUI Compressor через наши разные итерации.
Сначала у нас был сервлет, обрабатывающий сжатие для JavaScript в первый раз, когда к этому файлу обращались; он был затем кэширован. У нас уже есть система для обработки пользовательских файлов свойств, поэтому мы просто обновляем наши файлы конфигурации, чтобы поддерживать включение или отключение компрессора в зависимости от среды, в которой мы работали.
Теперь среда разработки никогда не использует сжатый JavaScript для целей отладки. Вместо этого мы обрабатываем сжатие в нашем процессе сборки при экспорте нашего приложения в файл WAR.
Наш клиент никогда не высказывал опасений по поводу сжатия, и разработчики этого не замечают, пока не примут решение об отладке JavaScript. Поэтому я бы сказал, что это довольно прозрачно с минимальными, если таковые имеются, побочными эффектами.
Ответ 8
Я действительно удивлен, что никто не упомянул JAWR - https://jawr.java.net/
Он довольно зрелый и поддерживает все стандартные функции, которые следует ожидать, и немного больше. Вот как он держится против превосходных критериев OP.
Как он интегрируется? Является ли это частью вашего инструмента сборки, сервлета фильтр, автономную программу после обработки файла WAR или что-то еще?
Первоначально обработка/тяжелая атлетика при запуске приложения и обслуживании основывалась на servlet. Начиная с 3.x они добавили поддержку интеграции во время сборки.
Поддержка JSP и Facelets предоставляется через пользовательскую библиотеку тегов JSP для импорта обработанных ресурсов. Кроме того, реализуется загрузчик ресурсов JS, который поддерживает загрузку ресурсов со статических HTML-страниц.
Легко ли включать и отключать? Очень неудобно пытаться отлаживать minified script, но он также полезен для разработчика, чтобы иметь возможность проверьте, что минимизация ничего не нарушает.
A debug=on
опция доступна для использования перед запуском приложения, и пользовательский параметр GET
может быть указан при индивидуальных запросах в производстве для выборочного переключения режима отладки во время выполнения для указанного запроса.
Какой minifier он использует?
Для JS он поддерживает YUI Compressor и JSMin, для CSS я не уверен.
Не хватает ли каких-либо функций, о которых вы можете думать?
Поддержка SASS
приходит на ум. Тем не менее, он поддерживает LESS
.
Ответ 9
Это сработало для меня: https://bitbucket.org/m6_russell_francis/yui-compressor-ant-task/wiki/Home
<!-- minimize all static *.css & *.js content -->
<target name="static-content-minify">
<taskdef name="yuicompressor"
classname="com.metrosix.yuicompressor.anttask.YuiCompressorTask">
<classpath>
<pathelement location="${jar.yui.compressor}"/>
<pathelement location="${jar.yui.anttask.compressor}" />
</classpath>
</taskdef>
<yuicompressor todir="${build.static.content.min}" charset="utf-8"
preserveallsemicolons="true" munge="true" >
<fileset dir="${src.static.content}">
<include name="**/*.css"/>
<include name="**/*.js"/>
</fileset>
</yuicompressor>
</target>
Ответ 10
Я пишу структуру для управления сетевыми ресурсами, называемую humpty. Он стремится быть более простым и современным, чем jawr или wro4j, используя WebJars и ServiceLoaders.
Как он интегрируется? Является ли это частью вашего инструмента сборки, фильтра сервлетов, автономной программы после обработки файла WAR или чего-то еще?
В процессе разработки сервлет обрабатывает активы по мере необходимости. Затем активы будут предварительно скомпилированы перед производством и помещены в общую папку, так что единственная часть, которая используется, генерирует правильные включения в HTML.
Легко ли включать и отключать? Очень неудобно пытаться отлаживать миниатюрный script, но также полезно, чтобы разработчик смог проверить, что мини-код ничего не сломает.
Это будет сделано путем переключения между режимами разработки и производства.
Работает ли он прозрачно или имеет какие-либо побочные эффекты (кроме тех, которые присущи мини-классификации), которые я должен учитывать в своей повседневной работе?
Я считаю, что он прозрачен, но сильно поддерживает использование WebJars.
Какой minifier он использует?
Какой бы ни был плагин, который вы используете в своем классе. В настоящее время рассматривается создание плагина для компилятора Google Closure.
Не хватает ли каких-либо функций, о которых вы можете думать?
Еще до релиза, хотя я использую его в производстве. Плагин maven по-прежнему нуждается в большой работе.
Что вам нравится?
Простота просто добавления зависимости для настройки фреймворка
Что вам не нравится?
Это мой ребенок, я люблю все это;)