it-swarm-es.com

¿Qué debo usar para combinar automáticamente archivos css / js?

Soy consciente de sprockets para combinar archivos javascript, pero no lo he probado. ¿Cuáles son algunas otras opciones y cómo se comparan?

14
Cebjyre

Escribí un controlador para Asp.Net que usa YUI para comprimir, concatenar y almacenar en caché la salida.

Aquí está la fuente: http://Gist.github.com/13091

4
travis

Ya he abordado este problema en otra pregunta

En retrospectiva, debería haberlo preguntado en Webmasters en lugar del sitio de Programadores.

Tiene 3 opciones:

  1. Deje que su marco lo maneje automáticamente
  2. Deje que su servidor web lo maneje automáticamente
  3. Gire su propia opción para hacerlo manualmente

Opción 1 (usando una extensión CakePHP):

Descargue e instale AssetPacker en su sitio (que también requiere jsmin y CSSTidy). Modifique sus pocas líneas de origen que incluyen los archivos js. Lavar-> Enjuagar-> Repetir. Voila, el resto se hace automáticamente por ti.

Si usa algún otro marco, lo más probable es que haya una herramienta que lo logre por usted. Es un requisito bastante común en el mundo webdev.

Opción 2 (usando un mod de Apache):

Eche un vistazo a Google Pagespeed mod para Apache . Hace todo lo que usted describe y mucho más.

Sin embargo, asegúrese de monitorear los recursos de su servidor de producción. Algunas personas han estado viendo problemas en los que esto aumenta la carga en su servidor de manera negativa. No soy positivo, pero puede requerir una estrategia de contenido estático suficiente para ser una opción efectiva.

Opción 3:

Si realmente quieres, puedes crear algo de magia [PHP que concatene el lado del servidor de archivos JS y combine todos los enlaces rel en uno, pero ... Eso es exactamente lo que las dos estrategias ya están haciendo de todos modos.

Personalmente, desaconsejaría esta opción.


Por lo que sé, Sprockets concatena archivos JS de la misma manera que AssetPacker, solo se implementa como una Gema Ruby. Lo que no hace es minificar el código js. Entonces, si lo usas, probablemente sea una buena idea agarrar la gema jsmin también. Para obtener información sobre cómo usar Sprockets + JSMin en CakePHP, consulte esto .

Sé que pongo énfasis en CakePHP pero ... supongo que, si un complemento se puede adaptar a CakePHP, también debería ser trivial adaptarlo a un marco diferente.

2
Evan Plaice

Si su aplicación web está en PHP, debería considerar usar minify :

Combina múltiples archivos CSS o Javascript, elimina espacios en blanco y comentarios innecesarios, y los sirve con codificación gzip y encabezados óptimos de caché del lado del cliente.

1
Tom

Una búsqueda rápida en Google encuentra esto para combinar archivos CSS: http://www.tothepc.com/archives/combine-merge-multiple-css-files/

1
Macha

¿Estás seguro de que quieres combinarlos? Si usa una biblioteca común, puede aprovechar una CDN para entregar sus javascripts. Luego puede aprovechar el almacenamiento en caché del navegador (suponiendo que otros sitios estén usando el mismo CDN) y la entrega distribuida. Microsoft y Google cada uno tiene soluciones (tampoco lo he usado honestamente, pero ciertamente voy a comenzar) y puede haber otras.

1
Larry Smithmier

Para los proyectos ASP.NET, lo hice parte de mi proceso de compilación basado en instrucciones de Karl Seguin .

Karl lo describe mejor en su blog, pero la versión corta es configurar una aplicación de consola que envuelva YUICompressor. Luego, puede configurar una tarea posterior a la compilación para llamar a esa aplicación de consola contra la ubicación de los archivos JS en su sitio.

1
Raleigh Buckner

Para este conocimiento Python podría ser realmente útil. Puedes aprender Python bastante rápido. Comencé hace aproximadamente 2 semanas y mi primera aplicación (que aún no está terminada) hará exactamente lo mismo que usted desea. Al igual que el compilador DotLess, tendrá una función de observación que examinará los archivos o directorios y, si cambian, generará un nuevo archivo.

Python también es ideal para otras tareas de mantenimiento y leí que a muchos administradores de sistemas les gusta usarlo.

1
Pickels

Creé Minifpy : una herramienta escrita en Python3 (compatible con Mac OS, Windows y Linux) para fusionar y minimizar archivos JS y CSS mediante Python.

Minifpy utiliza un archivo de configuración JSON muy fácil para definir qué archivos deben fusionarse, minimizarse o no:

{
    "js": {
        "minify_files": [
            {"from": "static/file.js", "to":"static/file.min.js"},
        ],
        "merge_files": [
            {"from" : ["static/file1.js", "static/file2.js"], "to":"static/public.js", "to_min": "static/public.min.js"}
        ]
    },
    "css" : {
        "minify_files": [
            {"from": "static/file.css", "to":"static/file.min.css"},
        ],
        "merge_files": [
            {"from" : ["static/file1.css", "static/file2.css"], "to":"static/public.css", "to_min": "static/public.min.css"}
        ]
    }
}

También puede usar esta herramienta en la CLI.

Minifpy detecta cualquier modificación en los archivos JS/CSS y los combina/minimiza automáticamente (útil para el desarrollo).

0
Samuel Dauzon