Cómo usar yuicompressor2.4.2.jar para ofuscar código js y CSS

En la actualidad, Javascript juega un papel cada vez más importante en el desarrollo de aplicaciones web, y cada vez existen más frameworks relacionados con Javascript. Pero hay un problema. Durante nuestro proceso de desarrollo, todos los códigos JS están comentados. Si usamos JsDoc, el código será más legible y dicho código también será más fácil de depurar. Pero en un entorno de producción, queremos comprimir y ofuscar el código JS, principalmente para que el código JS se cargue más rápido, razón por la cual apareció la API de bibliotecas AJAX de Google. YUI Compressor es una herramienta de compresión y ofuscación de código JS y CSS muy poderosa desarrollada por Yahoo. Está desarrollado en Java. Muchos marcos de Javascript utilizan YUI Compressor para la distribución de código.

2. Introducción al uso:

Ejecute el programa Java en la línea de comando y ejecute el paquete jar yuicompressor para completar la tarea:

//Compressor JS.

java -jar yuicompressor-2.4.2.jar --type js -- charset utf-8 -v src.js > pack.js

//Comprimir CSS

java -jar yuicompressor-2.4.2.jar --type css --charset utf-8 -v src.css > pack.css

3. Consulte el inglés oficial instrucciones:

3.1 ¿Cómo funciona YUI Compressor? Primero analiza el archivo fuente de JavaScript para comprender su estructura. Luego imprime el flujo de tokens, omitiendo espacios en blanco cuando sea posible y reemplazando todos los símbolos locales con 1 (o 2 o 3) símbolos alfabéticos cuando corresponda (frente a funciones malvadas como eval o with, YUI Compressor tomará precauciones para no ofuscar cualquier alcance que contenga declaraciones malvadas). El algoritmo de compresión CSS utiliza un conjunto optimizado de expresiones regulares para comprimir archivos fuente CSS. YUI Compressor es de código abierto y se puede utilizar de muchas maneras.

3.2 Usando YUI Compressor a través de la línea de comando

java -jar yuicompressor-x.y.z.jar

Uso: java -jar yuicompressor-x.y.z.jar [opciones] [entrada file ]

Opciones globales -h, --help muestra esta información --type ?Especifique el tipo de archivo de entrada--charset ?Utilice para leer la entrada archivo-- salto de línea Inserta un carácter de nueva línea después del número de columna especificado -v, --verbose Muestra información y advertencias -o Coloca la salida en . El valor predeterminado es la salida estándar.

Opciones de JavaScript --nomunge solo minimizar, no ofuscar --preserve-semi?Conservar todos los puntos y coma --disable-optimizations?¿Desactivar optimización? Deshabilitar todas las microoptimizaciones

Opciones globales

-h, --help

Imprimir ayuda sobre cómo usar el compresor YUI

- -h, --help

Imprime ayuda sobre cómo usar el compresor YUI

--h, --help--type js|css

Compresión El tipo de renderizador (JavaScript o CSS) se elige en función de la extensión del nombre del archivo de entrada (.js o .css). Esta opción es obligatoria si no se especifica ningún archivo de entrada

. De lo contrario, esta opción sólo es necesaria si la extensión del archivo de entrada no es "js" ni ".css".

--conjunto de caracteres charset

Si se especifica un conjunto de caracteres admitido, el compresor YUI utilizará ese conjunto de caracteres

para leer el archivo de entrada. De lo contrario, asumirá que se utiliza el conjunto de caracteres predeterminado

de la plataforma. Los archivos de salida utilizan

la misma codificación de juego de caracteres. Los archivos de salida utilizan

la misma codificación de juego de caracteres. Importante: Si no se proporciona este parámetro y la codificación del archivo es incompatible con la codificación predeterminada del sistema, el compresor generará un error.

-o outfile

Coloca la salida en el archivo outfile. Si no se especifica, YUI Compressor

de forma predeterminada utilizará la salida estándar, que puede redirigir a un archivo.

-v, --verbose

Muestra mensajes informativos y advertencias.

Solo opciones JAVASCRIPT

--nombre minimizar solo. No mezcle símbolos locales.

-- Preserve-semi

- --nomunge Minimizar únicamente. preserve-semi conserva los puntos y comas innecesarios (por ejemplo, antes de '}'). Esta opción es útil cuando el código minimizado debe ejecutarse a través de JSLint (como es el caso de YUI)

----disable-optimizations desactiva todas las microoptimizaciones integradas.

La siguiente línea de comando (x.y.z representa el número de versión):

java -jar yuicompressor-x.y.z.jar myfile.java -jar yuicompressor-x.y .z.jar myfile.js -o. myfile-min.js minimizará el archivo myfile.js y generará el archivo myfile-min.js. Para obtener más información sobre cómo utilizar el compresor YUI, consulte la documentación incluida con el archivo.

El parámetro charset no siempre es necesario, pero el compresor puede generar un error si la codificación del archivo es incompatible con la codificación predeterminada del sistema. En particular, debe proporcionar este parámetro si su archivo utiliza codificación UTF-8.

java -jar yuicompressor-x.y.z.jar myfile.js -o myfile-min.js --charset utf-8

Cuatro: Principios del uso de YUI Compressor para comprimir JavaScript

YUI YUI Compressor comprime JavaScript de las siguientes maneras:

1. Eliminar comentarios

2. Eliminar espacios adicionales

3. Optimización menor

4. Reemplazo de identificador

¿Qué optimizaciones sutiles incluye YUI Compressor? objeto["propiedad"], si el nombre de la propiedad es un identificador legal de JavaScript (nota: los identificadores legales de JavaScript comienzan con una letra y pueden ir seguidos de una o más letras, números o guiones bajos) y no es una palabra reservada, se optimizará para ：object.property

?{"property":123}, o {property:123}, siempre que el nombre de la propiedad sea un identificador legal de JavaScript y no una palabra reservada (nota: en literales de objeto, si el nombre del atributo es un identificador legal de JavaScript y no es una palabra reservada, no es necesario citarlo).

?'abcd/'efgh', se optimizará a "abcd'efgh".

?"abcd" + "efgh", si es una conexión de cadena, se optimizará a "abcdefgh" (Nota: para la conexión de cadena en todos los scripts que usan YUI Compressor, el carácter de conexión "+" se utiliza el más eficiente y mantenible).

La optimización de la compresión más eficaz de JavaScript es la sustitución del identificador.

(function(){function A(C,B){return C+B;}})();

El reemplazo del identificador del compresor YUI solo reemplaza los nombres de funciones y nombres de variables, Entonces, ¿cuáles no se pueden reemplazar?

1. Valores primitivos: cadena, booleano, número, nulo e indefinido. En términos generales, las cadenas ocupan el espacio más grande, seguidas de los literales no numéricos (verdadero, falso, nulo, no encontrado).

2. Variables globales: ventana, documento, XMLHttpRequest, etc. Los más utilizados son documento y ventana.

3. Nombre del atributo, como foo.bar. El espacio ocupado es superado solo por la cadena, el operador "." no se puede reemplazar y a.b.c ocupa más espacio.

4. Palabras clave. Las palabras clave que a menudo se usan en exceso son: var, return. La mejor manera de optimizar es hacer que las palabras clave var y return aparezcan solo una vez en la función.

Las optimizaciones para valores primitivos, variables globales y nombres de propiedades se manejan de manera muy similar: cualquier valor literal, variable global o nombre de propiedad usado más de dos veces (inclusive) debe reemplazarse con almacenamiento de variables locales. .

Pero en algunos casos, el reemplazo de identificadores está prohibido:

1. Solución alternativa: no utilice ni cree una función global para ajustar eval().

2. Utilice la declaración with. Solución: Igual que arriba: Igual que arriba.

3. Comentarios condicionales de JScript. La única solución: no usarlo.

Dado que YUI Compressor se basa en el intérprete de Rhino, todas las optimizaciones anteriores son seguras.