2011-02-28 10 views
9

Ok Así que sé que siempre depende de la situación, pero hasta ahora he combinado mis archivos/complementos jquery en un solo archivo comprimido.Un archivo JavaScript por página o Combinar cuando se usa Jquery y función de documento preparado

Ahora me pregunto qué debo hacer con el código js/jQuery específico de mi página. ¿Debo tener un solo archivo con una sola función Document.Ready y mi código de sitios js dentro de él? ¿O dividirlo en archivos js separados por página con una llamada lista para documentos en cada uno?

Estos archivos incluirán elementos tales como .Haga clic en controladores y otro código jquery específico para ciertas páginas.

¿Cuál es la mejor práctica aquí para optimizar los tiempos de carga y la capacidad de mantenimiento?

Respuesta

8

Una forma de hacerlo sería usar require.js y luego tener una matriz con archivos y tipos de página. Dé a cada cuerpo de la etiqueta un ID y lo utilizan para hacer referencia a lo que deben cargarse los archivos en.

<body id="pageName"> 

mantener sus archivos todo lo mundial lo necesario para la funcionalidad básica para trabajar y carga luego dejados en las características que no son necesarios para que tu sitio funcione más rápido He visto mejoras de gran velocidad de esta técnica.

http://requirejs.org/

+0

muy interesante. Voy a investigar esto con seguridad – stephen776

+0

No me he tomado el tiempo para verificar esto, pero ¿esta técnica se aplica fácilmente si uso ASP.NET MVC3 – stephen776

+0

Hola stephen, si estás utilizando asp.net mvc3 es muy fácil, puede agregarlos y agruparlos muy fácilmente. – kobe

2

Debido a que es casi seguro que quiere tener cosas diferentes ejecutados en la función document.ready dependiendo de en qué página estás en la que no creo que el tener una función que se ejecuta en cada la página es útil.

Personalmente, mezclo mis llamadas $ .ready con mi HTML. Estas son simples llamadas a funciones almacenadas en un solo archivo, lo que minimiza el javascript, por lo que no ocupa demasiados bytes y evita la necesidad de un archivo Javascript por página. También me permite iniciar el Javascript donde creo el marcado, así que todo está en un solo lugar.

Si está minimizando su javascript y lo está utilizando con los encabezados correctos, ya tiene la mayoría de los beneficios, no comprometa la legibilidad más de lo necesario.

+1

Estaba bajo la suposición de que js en línea no era preferido debido a que no se podía comprimir. Si estoy equivocado, eso hace que mi vida sea mucho más fácil – stephen776

+0

Mi aplicación web actual, de hecho, usa un único archivo universal idéntico para todas las páginas. El código usa selectores jQuery simples (cuidadosamente escritos) para encontrar "características" en las páginas, y todo funciona bien. Es más fácil mantener las páginas porque no necesitan "saber" lo que necesitan en las secuencias de comandos, porque todo está siempre allí. – Pointy

+0

@ stephen776 JS en línea generalmente está en desuso ya que es intrusivo y no se almacena en caché a menos que las páginas estén en caché (no siempre es posible con la mayoría de los marcos de aplicación del lado del servidor, que construyen páginas dinámicamente). – Pointy

1

También depende de la tecnología del lado del servidor que esté utilizando. Puede encontrar herramientas para ayudarlo en esta tarea. Si está codificando un lado del servidor Java, puede intentar JAWR. Permite la creación de archivos JS/CSS separados, combinándolos y comprimiéndolos en el lado del servidor, convirtiendo todos los archivos separados en un solo archivo.

Acerca de Document.Ready, prefiero mantener la página de códigos específica en archivos separados, evitando la ejecución y el comportamiento incorrectos del código. También es más limpio y más fácil de mantener.

2

Podemos hacer esto de varias maneras, lo hice de la siguiente manera.

Agregada sus broadylyas archivos siguientes

1) Suma de todos los archivos necesarios para todas las páginas 2) se agregan las páginas específicas de la página.

incluir todos los archivos agregados común para todas las páginas, e incluyen otros archivos agregados condicionalmente en la página

1) jQuery y otros complementos comunes a todas las páginas de manera // irá a todos los archivos 2) Página de inicio-agregación /// para la página de inicio 3) gallerypage-aggregation // para la página de la galería.

Si incluye el mismo archivo para todas las páginas, puede que no sea necesario para todos los archivos.

Lo he hecho recientemente, hágamelo saber si necesita algo más

Cuestiones relacionadas