Cómo usar yuicompressor2.4.2.jar para ofuscar códigos js y CSS
En la actualidad, Javascript juega un papel cada vez más importante en el desarrollo de aplicaciones web y existen muchos marcos de Javascript relacionados. Pero hay un problema. Durante nuestro proceso de desarrollo, se agregan comentarios a todos los códigos JS. Si usamos JsDoc, el código es más legible y dicho código también es fácil de depurar. Pero en un entorno de producción, esperamos que estos códigos JS estén comprimidos y ofuscados, lo que principalmente hace que el código JS se cargue más rápido. Esta es también la razón por la que 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 potente desarrollada por Yahoo. Actualmente, 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 de software yuicompressor jar para completar la tarea:
//Comprimir 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 los comentarios oficiales en inglés:
3.1 ¿Cómo funciona el compresor YUI? ?
El compresor YUI está escrito en Java (requiere Java >= 1.4) y depende de Rhino para tokenizar el archivo JavaScript fuente. Comienza analizando el archivo JavaScript fuente para comprender cómo está estructurado. imprime el flujo de tokens, omitiendo tantos espacios en blanco como sea posible y reemplazando todos los símbolos locales por un símbolo de 1 (o 2, o 3) letras siempre que dicha sustitución sea apropiada (frente a características malvadas como eval o con , YUI Compressor adopta un enfoque defensivo al no ofuscar ninguno de los ámbitos que contienen la declaración malvada) El algoritmo de compresión CSS utiliza un conjunto de expresiones regulares finamente ajustadas para comprimir el archivo CSS fuente. El YUI Compressor es de código abierto, así que no lo haga. No dudes en mirar el código para entender exactamente cómo funciona.
3.2 Uso del compresor YUI desde la línea de comandos
java -jar yuicompressor-x.y.z.jar
Uso: java - jar yuicompressor-x.y.z.jar [opciones] [archivo de entrada]
Opciones globales -h, --help? Muestra esta información --type
ine-break
Opciones de JavaScript --nomunge Minimizar solo, no ofuscar --preserve-semi Preservar todos los puntos y comas --disable-optimizations Deshabilitar todas las micro optimizaciones
OPCIONES GLOBALES
-h, --help Imprime ayuda sobre cómo usar el compresor YUI
--salto de línea A algunas herramientas de control de código fuente no les gustan los archivos que contienen líneas de más de, digamos, 8000 caracteres. La opción de salto de línea se usa en ese caso para dividir líneas largas. líneas después de una columna específica También se puede utilizar para hacer que el código sea más legible y más fácil de depurar (especialmente con MS Script Debugger). Especifique 0 para obtener un salto de línea después de cada punto y coma en JavaScript y después de cada regla en CSS. .
--type js|css El tipo de compresor (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 hay ningún archivo de entrada. De lo contrario, esta opción solo es necesaria si la extensión del archivo de entrada no es 'js' ni 'css'.
--charset Character-set Si se especifica un conjunto de caracteres admitido, el compresor YUI lo hará. úselo para leer el archivo de entrada. De lo contrario, se asumirá que se está utilizando el conjunto de caracteres predeterminado de la plataforma. El archivo de salida está codificado con el mismo conjunto de caracteres. IMPORTANTE: si no proporciona este argumento.
y la codificación del archivo no es compatible con la codificación predeterminada del sistema, el compresor generará un error. En particular, si su archivo está codificado en utf-8, debe incluir este parámetro.
-o outfile Coloque la salida en el archivo de salida. Si no se especifica, YUI Compressor utilizará de forma predeterminada la salida estándar, que puede redirigir a un archivo.
-v, --verbose Muestra mensajes informativos y advertencias.
OPCIONES SÓLO DE JAVASCRIPT
--nomunge Minimizar únicamente. No ofuscar símbolos locales.
--preserve-semi Conserva los puntos y comas innecesarios (como justo antes de '}' ) Esta opción es útil cuando el código comprimido debe ejecutarse a través de JSLint (como es el caso de YUI, por ejemplo)
--disable-optimizations Deshabilita todas las microoptimizaciones integradas. Nota: si no hay entrada Cuando se especifica el archivo, el valor predeterminado es stdin.
La siguiente línea de comando (x.y.z representa el número de versión):
java -jar yuicompressor-x.y.z.jar myfile.js -o myfile-min .js minificará 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 en el archivo.
El parámetro charset es. 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, si su archivo está codificado en utf-8, debe proporcionar el parámetro.
java -jar yuicompressor-x.y.z.jar miarchivo.js -o miarchivo-min.js --charset
utf-8
4. El principio de YUI Compressor que comprime JavaScript
El contenido de YUI Compressor que comprime JavaScript incluye:
1. Eliminar comentarios. 3. Optimización sutil 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: un identificador legal de JavaScript comienza con una letra, seguida opcionalmente por una o más letras, números o guiones bajos) y no lo es. Las palabras reservadas se optimizarán para : object.property
{"property":123}. Si el nombre de la propiedad es un identificador legal de JavaScript y no una palabra reservada, se optimizará para {property:123} (Nota: en literales de objeto). , no es necesario citar el nombre de la propiedad si es un identificador de JavaScript válido y no es una palabra reservada).
'abcd/'efgh' se optimizará a "abcd'efgh".
"abcd" + "efgh", si las cadenas están conectadas, se optimizará a "abcdefgh" (Nota: todo bajo la premisa de usar YUI Compressor, para conexiones de cadenas en scripts, use el carácter de conexión "+ " es el más eficiente y mantenible). La optimización de la compresión más eficaz para JavaScript es la sustitución del identificador.
Por ejemplo:
(function(){function add(num1, num2) {return num1 + num2;}})();
Realizar atributo identificación Después de reemplazar los caracteres:
(function(){function A(C, B) {return C+ B;}})();
Luego elimine los espacios adicionales y finalmente conviértase
(function(){function A(C,B){return C+B;}})();
El reemplazo del identificador de YUI Compressor solo reemplaza nombres de funciones y variables Nombre, Entonces, ¿cuáles no se pueden reemplazar?
1. Valores primitivos: cadena, booleano, número, nulo e indefinido. En términos generales, las cadenas ocupan la mayor parte del espacio, seguidas de los literales no numéricos (verdadero, falso, nulo, insuficiente). 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 las cadenas. El operador "." no se puede reemplazar y a.b.c consume más espacio. 4. Palabras clave. Las palabras clave que a menudo se usan en exceso son: var, return. El mejor método de optimización: las palabras clave var y return aparecen solo una vez en una función. El tratamiento de optimización para valores primitivos, variables globales y nombres de atributos es aproximadamente el mismo: cualquier valor literal, variable global o nombre de atributo utilizado más de 2 veces (inclusive) debe reemplazarse por almacenamiento de variables locales.
Pero hay algunas situaciones en las que la sustitución de identificadores está prohibida:
1. Utilice la función eval(). Solución: No utilice ni cree una función global contenedora eval(). 2. Utilice la declaración with. Solución: El método es el mismo que el anterior. 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.