YUI Compressor es una herramienta que permite la reducción del tamaño de archivos Javascript y CSS permitiendo una optimización del tiempo de transferencia entre el servidor web y el browser.
Los archivos Javascript son comprimidos eliminando comentarios y espacios en blanco, como asi tambien ofuscando variables locales utilizando nombres cortos. Los archivos CSS son comprimidos haciendo uso de expresiones regulares basadas en CSS minifier.
Instalación de YUI Compressor
sudo aptitude install yui-compressor
Comprimir y Obfuscar Javascript
cat *.js > original.js yui-compressor -type js -o compressed.js original.js
Comprimir CSS
cat *.css > original.css yui-compressor -type css -o compressed.css original.css
Utilizar YUI Compress con ANT
<path id="yuicompressor.classpath"> <fileset dir="${yuicompressor.dir}"> <include name="**/yuicompressor-2.2.5.jar"/> <include name="**/YUIAnt.jar"/> <!– include name="**/rhino*.jar"/ –> </fileset> </path> <target name="js.compress"> <taskdef name="yuicompress" classname="com.yahoo.platform.yui.compressor.YUICompressTask"> <classpath> <path refid="yuicompressor.classpath"/> </classpath> </taskdef> <yuicompress warn="false" munge="yes" preserveallsemicolons="true" outputfolder="${js-min.dir}" > <fileset dir="${js.dir}" > <include name="javascript/*.js" /> </fileset> </yuicompress> </target>
Utilizar YUI Compress con Maven
<project> ... <build> <plugins> ... <plugin> <groupId>net.alchim31.maven</groupId> <artifactId>yuicompressor-maven-plugin</artifactId> <executions> <execution> <phase>package</phase> <goals> <goal>compress</goal> </goals> </execution> </executions> <configuration> <failOnWarning>true</failOnWarning> <nosuffix>true</nosuffix> <force>true</force> <aggregations> <aggregation> <!-- Elimina los archivos declarado en agregations (default: false) --> <removeIncluded>false</removeIncluded> <!-- Inserta una linea despues de concatenar los archivos (default: false) --> <insertNewLine>false</insertNewLine> <!-- Es el archivo generado a partir de comprimir cada JS --> <output>${project.basedir}/${webcontent.dir}/js/compressed.js</output> <!-- Los archivos JS que deben comprimirse --> <includes> <include>javascript/*.js</include> </includes> <!-- Los archivos JS que deben omitirse --> <excludes> <exclude>...</exclude> </excludes> </aggregation> </aggregations> </configuration> </plugin> ... </plugins> </build> ... </project>
