Dado que la agrupación y la minificación tienen que ver con la optimización y hacer que las páginas se carguen más rápido, me parece lógico crear un paquete para scripts y un paquete para estilos por vista, de modo que para cargar todos los scripts y estilos un navegador necesitará para hacer 2 solicitudes como máximo. Digamos que tengo un _Layout.cshtml
archivo donde necesito 3 js bootstrap.js
, jquery.js
y algunos custom1.js
puedo crear un paquete, algo como esto:
bundles.Add(new ScriptBundle("~/bundles/layout").Include(
"~/Scripts/bootstrap.js",
"~/Scripts/jquery.js",
"~/Scripts/custom1.js"));
Entonces digamos que tengo otra vista User.cshtml
donde necesito bootstrap.js
, jquery.js
y custom2.js
, de nuevo puedo crear un solo paquete:
bundles.Add(new ScriptBundle("~/bundles/user").Include(
"~/Scripts/bootstrap.js",
"~/Scripts/jquery.js",
"~/Scripts/custom2.js"));
Se puede usar el mismo enfoque para los paquetes de estilos. Pero por lo que veo, no es una práctica común hacerlo de esta manera, por lo general, los paquetes se crean en función del tipo, por ejemplo, uno para bootstrap, uno para jquery, uno para archivos js / css personalizados, etc. Pero eso no aumentaría el tiempo de carga de la página, porque tener más paquetes significa más solicitudes al servidor. Además, ¿cuál es el problema de hacer las cosas como describí al principio?
fuente
No.
Debido al almacenamiento en caché del navegador, obtiene los mejores resultados generales al usar el mismo paquete o paquetes en todas las páginas. Esto significa que el usuario descargará todos los css y js cuando lleguen a la primera página y reutilizará ese archivo en las páginas siguientes.
Dado que la mayor parte del paquete serán frameworks javascript empaquetados como jquery y bootstrap. Sus pocos bytes adicionales de código personalizado tienen un efecto insignificante en la velocidad general de carga de la página.
fuente
La desventaja de un paquete por página es que el paquete en caché de una página no se puede usar en otra página, lo que normalmente desea es que la mayor parte de sus scripts (por ejemplo, jQuery bootstrap, etc.) se descarguen una vez y se almacenen en caché para todas las páginas en el sitio.
La solución "óptima" desde una perspectiva de almacenamiento en caché sería tener un paquete único que contenga todos los archivos .js para todas las páginas en todo el sitio, la desventaja de ese enfoque es que el paquete termina siendo bastante grande, lo que significa que la carga inicial de la página es más lenta , lo que podría no ser deseable para los sitios web de cara al cliente donde las impresiones iniciales lo son todo.
La "mejor" solución probablemente será una combinación de técnicas, por ej.
fuente