Estoy usando un paquete web en node.js para compilar/agrupar Javascript para un sitio web estático. Es una configuración bastante típica de varios archivos JS más pequeños que se compilan en un solo archivo "main.js" que se usa en mi sitio.

Digamos que mi prepaquete de Javascript se veía así:

 module-a.js (50 kb) module-b.js (50 kb) module-c.js (50 kb)

Y mi sitio consta de 5 páginas;

• La página 1 utiliza código del módulo-a solamente.
• La página 2 utiliza código del módulo-a y del módulo-b.
• La página 3 utiliza código del módulo-c únicamente.
• La página 4 utiliza código de los tres módulos, módulo-a, módulo-b y módulo-c.
• La página 5 no utiliza nada del paquete.

Según tengo entendido, según la forma en que Webpack compila el archivo main.js, solo se utilizarán los recursos necesarios de main.js página por página y tendrán algún tipo de impacto en el rendimiento. Entonces, en la página 5, main.js no tendría peso o estaría cerca de él (excepto por la solicitud HTTP para main.js), la página 4 experimentaría el peso "completo" del paquete y las otras páginas se cargarían en partes según sea necesario. .

¿Estoy entendiendo esto correctamente? Si es así...

• ¿Significa eso que hay muy pocos beneficios (si los hay) en tener varios paquetes específicos especializados en las propias páginas (es decir, un "main-a.js" para la página 1, un "main-ab.js" para la página 2, etc.)
• ¿El tamaño total de mi archivo "main.js" realmente no importa en términos de rendimiento? Entonces, ¿un archivo main.js de 100 kb o 500 kb no importará para una página que utiliza las mismas funciones en cualquiera de los dos? En comparación con, por ejemplo, un archivo CSS, donde podría haber problemas de rendimiento si un solo archivo CSS se inflara masivamente con el tiempo.
• ¿Hay inconvenientes en agrupar todos sus JS en un solo archivo como este? Lo único en lo que puedo pensar es en tener que crear un nuevo paquete para un cambio en cualquier módulo individual en términos de mantenimiento del paquete.

¡Gracias!