He leído que combinar varios archivos javascript en un solo archivo mejora el rendimiento, ¿es así?Fusionando varios archivos javascript
Si es así, ¿existe una manera fácil y sin errores de combinarlos, o tal vez una herramienta en línea que automáticamente hace eso?
Muchas gracias.
Ver Multiple javascript/css files: best practices? y Supercharging Javascript in PHP.
La respuesta corta es que quiere minimizar las solicitudes HTTP externas. La mejor manera de hacerlo es obligar al navegador a almacenar en caché los archivos que tiene en el servidor hasta que cambien. Para ello, haga versiones de los archivos y proporcione un encabezado Expires futuro. Cuando el nombre del archivo cambia (cambiando la versión), el navegador obtendrá la nueva versión.
Si hace esto, entonces muchos archivos Javascript realmente no importan. Pero si fuerza al cliente a descargar 27 archivos JS en todas y cada una de las páginas sin almacenamiento en caché, reducir el número de archivos puede hacer una diferencia sustancial. Por supuesto, esto es aún inferior a las estrategias efectivas de caché/control de versiones.
Otra cuestión más reciente a considerar es iphone caching:
iPhone no va componentes caché más grande que 15K (fue 25K en el experimento anterior )
Así, en algunas circunstancias, la combinación de archivos puede ser perjudicial.
¿por qué le miente al cliente "lo mejor"? al menos Firefox solicita archivos js, etc. condicionalmente (con If-Modified-Since). no hay necesidad de jugar con los nombres de archivo. –
Cuando dice "archivos" con respecto al almacenamiento en caché, ¿está hablando de páginas web, no Javascript correcto? –
No, me refiero a contenido estático en general (Javascript, CSS, imágenes).Esos deben ser guardados en caché agresivamente. ¿Quién dijo algo sobre "mentir"? Básicamente le dices al cliente "No vuelvas a pedir esto hasta que te diga que ha cambiado". Eso es bueno. – cletus
Si tiene muchos archivos javascript, puede ayudar a combinarlos y minimizarlos. Al combinarlos en un solo archivo, reduce la cantidad de conexiones y archivos que deben descargarse de su sitio. Si los minimiza, en realidad reduce el tamaño de los archivos al eliminar el espacio en blanco, los comentarios, etc. Eche un vistazo a JSMin y YUI Compressor.
Editar: Como indican otros comentaristas, la combinación de archivos realmente solo tiene sentido si los usuarios están utilizando activamente funciones de todos los archivos. No tendría sentido combinar un archivo javascript grande y poco utilizado con todas las funciones que se usan habitualmente.
También puede consultar http://jscompress.com/, una herramienta de compresión de JavaScript en línea.
puede probar pakd.io puede combinar archivos CSS y JS
No creo que esto es cierto - un archivo js monolítica se necesitará más tiempo para descargar, y de ser monolítica hay riesgo de que la página está utilizando el 25% de los js en él (o menos). –
Depende de cuántos archivos. Como señala el comentador anterior, poner todo el archivo JS cargado en todas las páginas puede ocasionar que cargue muchos JS irrelevantes. Sin embargo, si combinara 3 archivos en los que a menudo se usaba todo el código en 1, reduciría el número de solicitudes HTTP para carga de página y, por lo tanto, mejoraría la velocidad de carga de la página. – mopoke
Cargar varios archivos en lugar de sinlgerar uno es definitivamente más lento porque su navegador está estableciendo múltiples conexiones http para cargar esos archivos y establecer una conexión http tiene algún costo. – Nayan