¿Qué se utiliza para minimizar y comprimir bibliotecas JavaScript? [cerrado]


¿Qué se usa para minimizar y comprimir bibliotecas JavaScript?

Author: hughdbrown, 2009-03-01

17 answers

Utilizo YUI Compressor. ¡Parece hacer bien el trabajo!

 33
Author: jonstjohn,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-03-01 14:40:02

He usado YUI Compressor durante mucho tiempo y no he tenido problemas con él, pero recientemente he comenzado a usar Google Closure Compiler y tuve cierto éxito con él. Mis impresiones de ello hasta ahora:

  • Generalmente supera a YUI Compressor en términos de reducción de tamaño de archivo. Por una pequeña cantidad en el modo simple, y por mucho en el modo avanzado.
  • El modo simple hasta ahora ha sido tan confiable como YUI Compressor. Nada de lo que he alimentado ha mostrado problema.
  • El modo avanzado de "compilación" es genial para algunos scripts, pero la dramática reducción de tamaño de su script viene a expensas de una gran cantidad de intromisión con su código que tiene una buena probabilidad de romperlo. Hay formas de lidiar con algunos de estos problemas y entender lo que está haciendo puede ayudar mucho a evitar problemas, pero generalmente evito usar este modo.

He pasado a usar el compilador de cierre de Google en modo "compilación" simple, porque supera ligeramente al compresor YUI en general. Lo he utilizado considerablemente menos de lo que tengo compresor YUI, pero por lo que he visto hasta ahora lo recomendaría.

Otro que aún tengo que probar pero que suena prometedor es UglifyJS de Mihai Bazon.

 42
Author: Tim Down,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-22 00:06:36

Usted tiene una manada de posibilidades aquí:

Desde mi experiencia personal, te recomiendo que uses el SDK de Dojo para crear una compilación personalizada, que luego puedes configurar para usar su compilador ShrinkSafe habitual, o Google Closure, que ahora también admiten.

En términos de compresión, creo que el cierre de Google es el que produce los mejores resultados para mí hasta ahora, sin embargo, por lo general estoy satisfecho con ShrinkSafe y es un poco más viejo y más robusto, mientras que el compilador de cierre parece un un poco de un niño nuevo en el bloque (que sus partes interesadas podrían no ser demasiado aficionados, por ejemplo).

Algunas personas juran solo por el compresor YUI sin embargo. Personalmente, no puedo dar fe de ello.

Ahora, si su pregunta era comprimir bibliotecas y no solo su propio código JavaScript, obviamente se vuelve realmente más involucrado, ya que necesitará la mayoría de estas herramientas para exportar los símbolos que no deben ser renombrados o despojados. La mayoría de los compresores decentes eliminarán funciones que creen que no se usan-a menudo el caso en una biblioteca, si no está vinculada a un proyecto, obviamente-y cambiar los nombres para hacerlos más cortos y usar menos caracteres - también es un problema, ya que obviamente desea que una API pública no sea manipulada.

También puede encontrar otros temas sobre este tema y encontrar información en la documentación de soporte de las herramientas. También es posible que desee echar un vistazo a JSBuilder2 , algún tipo de colgante para la herramienta de construcción de Dojo (por lo tanto, utilizando ShrinkSafe o Cierre Compilador) para ExtJS (usando el compresor YUI).

(Lo siento, siendo un nuevo usuario de SO, no puedo agregar más de un enlace, por lo que no puedo vincular directamente a las herramientas.)

EDIT: con respecto a las preocupaciones expresadas en algunas respuestas de que la compresión podría introducir errores y que hace que la depuración sea más fácil ya que el código no está destrozado: sí, es una preocupación válida. Sin embargo:

  • obtendrá una mejora muy significativa en términos de ancho de banda si utiliza un minificador, incluso con compresión gzip activado (y puede aprender a aprovechar la compresión gzip haciendo la vida del compresor más fácil
  • solo debe probar su código en modo de depuración y producción para asegurarse de que el comportamiento sea idéntico. Quiero decir, es parte de tu trabajo también...
  • algunos de estos compresores han existido por un tiempo y realmente no introducirán errores en su código. En realidad están reorganizando las cosas y sustituyendo cuerdas.
  • algunos compresores (por ejemplo, el sistema de construcción dojo) vienen con opciones que le permiten producir tanto una salida comprimida como una sin comprimir, de modo que pueda habilitar diferentes modos de depuración y producción, utilizando parámetros de consulta, por ejemplo.
 22
Author: haylem,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-29 13:13:44

No minimizo JavaScript en absoluto: la compresión gzip es lo suficientemente buena para mí y tiene el beneficio adicional de que los mensajes de error seguirán siendo útiles.

 12
Author: Christoph,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-03-01 16:19:36

Yo también uso el compresor YUI. Tengo una tarea ant como esta que uso en mis proyectos:

<!--
YUI Compressor tasks 
http://www.julienlecomte.net/yuicompressor/README
-->
<property name="yuicompressor.jar"
           value="C:/devlibs/yuicompressor-2.2.4/build/yuicompressor-2.2.4.jar"/>

<target name="js.compress">
    <!-- Create min directory under js direcrtory if it doesnt exist -->
    <mkdir dir="${js-directory}/min" />

    <apply verbose="true" executable="java" parallel="false" failonerror="true">
        <fileset dir="${js-directory}" includes="*.js"/>
        <arg line="-jar"/>
        <arg path="${yuicompressor.jar}"/>
        <srcfile/>
        <arg line="-o"/>
        <mapper type="glob" from="*.js" to="${js-directory}/min/*-min.js"/>
        <targetfile/>
    </apply>
</target>
 11
Author: kosoant,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-03-01 16:19:23

Dean Edward's packer logra unos ratios de compresión bastante buenos. Tiene implementaciones de línea de comandos que le permiten ser utilizado en un proceso de integración continua.

 5
Author: Darin Dimitrov,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-03-01 14:51:25

UglifyJS es una nueva.

UglifyJS se comprime mejor que YUI Compresor y casi a la par con el Compilador de Cierre de Google. Para ejemplo, la versión comprimida de jQuery desde el Cierre de Google El compilador es solo 403 bytes más pequeño que la versión producida por UglifyJS - impresionante! UglifyJS también es el más rápido para correr por un tiro largo, superando Cierre por más de 6 segundos!

Además, el código producido por UglifyJS es más seguro que el código que El cierre genera. Por ejemplo, Cierre no sabe cómo lidiar con eval o con {} - solo registra un error y continúa renombrando variables Por cierto. Esto, obviamente, conduce a código roto. UglifyJS no tiene este problema.

Puede encontrar más información aquí: http://badassjs.com/post/971960912/uglifyjs-a-fast-new-javascript-compressor-for-node-js

 5
Author: Louis,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-22 00:20:16

El cierre de Google herramientas

Puede asignar la versión minificada al código fuente regular para depurar en Firebug con su complemento.

 4
Author: epascarello,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-23 20:18:36

He probado YUI compressor antes, pero me da un mensaje de error.

Sugiero usar JSMIN para reducir tu javascript:

Http://www.crockford.com/javascript/jsmin.html

 3
Author: Billy,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-03-01 16:19:01

Esta es una solución de Microsoft que puede integrar en Visual Studio para reducir los archivos automáticamente cuando crea su proyecto.

Para Instalar:

Descargue el msi de: http://aspnet.codeplex.com/releases/view/40584

Es posible que deba reiniciar el equipo después de que haya terminado.

Para utilizar:

Edita tu .csproj e incluir lo siguiente al final del archivo (pero antes de la </Project> tag):

<Import Project="$(MSBuildExtensionsPath)\Microsoft\MicrosoftAjax\ajaxmin.tasks" />

<Target Name="AfterBuild">
    <ItemGroup>
        <JS Include="**\*.js" Exclude="**\*.min.js;Scripts\*.js" />
        <CSS Include="**\*.css" Exclude="**\*.min.css" />
    </ItemGroup>
    <AjaxMin 
    JsSourceFiles="@(JS)"
    JsSourceExtensionPattern="\.js$"
    JsTargetExtension=".min.js"
    CssSourceFiles="@(CSS)"
    CssSourceExtensionPattern="\.css$"
    CssTargetExtension=".min.css"/>
</Target>

Ahora cuando construyes tu proyecto, todos los archivos CSS y js que no terminan .min.js, .min.css será minificado (Vea el atributo "Exclude" para excluir otros archivos de ser minificados).

 3
Author: Brandon Boone,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-27 13:36:42

Http://code.google.com/p/jsmin-php /

El viejo Doug Crockford :-) La belleza de esto es que con el control de caché puede obtener una compresión muy automatizada solo cuando se requiere. O en uno de mis proyectos que acaba de salida de los archivos comprimidos/gzipped y eliminarlos cuando hago un cambio. Para un entorno de desarrollo, simplemente no llamo al script de minificación.

 1
Author: Alex,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-21 13:49:29

Utilizo un script de envoltura simple (3-4 líneas) alrededor de JavaScript::Minifier::XS.

 0
Author: ,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-03-01 15:39:07

Aquí hay un artículo que describe cómo usar YUI Compressor para minimizar archivos durante la compilación: Comprimir archivos JS como parte de su proceso de compilación

 0
Author: Giorgi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-21 10:43:42

Utilizo JavaScript::Minifier de perl. Funciona bastante bien y puedes, por ejemplo, reemplazar algunas frases usando perl.

 0
Author: elektronikLexikon,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-21 13:50:18

Http://caja.appspot.com/tools/index hace los tres de HTML/CSS/JS.

 0
Author: Mike Samuel,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-25 01:17:22

Https://jawr.dev.java.net / es excelente para minificación y versionado

 0
Author: Amareswar,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-27 14:34:16

Hay un compresor en línea muy bueno:

Http://javascriptcompressor.com /

También puede reducir las variables, si desea incluso más comprimidas.

Espero que ayude

 0
Author: greuze,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-09-28 07:45:46