Un gros fichier javascript ou plusieurs fichiers plus petits?
Ok, j'ai donc un projet de taille raisonnable, où j'utilise le backbone jquery et quelques autres bibliothèques javascript. Je me demandais si je devrais avoir un fichier pour mes bibliothèques javascript et un autre pour mon code personnalisé. Ou un tas de fichiers javascript distincts.
C'est généralement une bonne idée d'avoir moins de requêtes HTTP. Vous devez donc réduire le nombre de fichiers autant que raisonnable.
Ma préférence personnelle est d'avoir trois "groupes" de fichiers JavaScript:
- Fichier core. Contient des fonctions qui sont utilisées presque partout et d'autres choses utiles d'initialisation de page.
- Fichiers de module. Contient du code utilisé à plusieurs endroits, mais pas partout. Peut être déposé pour fournir des fonctionnalités supplémentaires. Par exemple, si vous avez un script pour gérer les entrées de date, vous pouvez l'inclure en tant que fichier de module et l'ajouter aux pages qui ont des entrées de date.
- Fichiers spécifiques à la page. Ces fichiers contiennent du code qui n'est utilisé qu'à un seul endroit. La seule raison pour laquelle ils sont ajoutés en tant que fichiers séparés que dans le cadre de la page elle-même est pour des raisons de cache.
Un gros fichier. Vous devez réduire le code lors de sa mise en production et le compresser s'il est volumineux. Vous souhaitez faire le moins de requêtes possible au serveur pour améliorer les performances de la page
Un gros fichier ou deux fichiers: un petit et un gros. Pour être clair, pendant le développement, il est bon d'avoir des fichiers séparés - peut-être en utilisant quelque chose comme requireJS . Mais lorsque vous le déployez, il est bon de tout compresser dans un seul fichier, afin de réduire la latence HTTP et les requêtes.
J'ai mentionné deux fichiers. Dans certains cas, il peut être bon d'avoir un petit fichier, qui s'occupe des opérations de "bootstrap", en attendant le "gros fichier" - surtout si c'est vraiment grand - est téléchargé. Cela est particulièrement utile pour le premier accès, car les utilisateurs n'ont pas encore mis vos fichiers en cache.
Il est préférable de le séparer, mais ne devenez pas trop zélé. De cette façon, vous pouvez réutiliser votre code de bibliothèque plus tard. De plus, tout le monde aime plus travailler avec des fichiers séparés car cela permet de mieux organiser les choses.
Cela dit, il est également préférable de donner à l'utilisateur un fichier compressé afin que tout puisse être mis en cache facilement, ce qui réduit également le nombre de demandes de page. Rails 3 le fait automatiquement dans le pipeline d'actifs, par exemple. Vous pouvez écrire un script pour exécuter votre compresseur préféré. Mais vous ne devriez pas sacrifier la lisibilité du code pour cela - vous pouvez avoir votre gâteau et mangez-le aussi!
Comme suggéré, il est agréable de travailler avec des fichiers plus petits, mais pour le code de production, votre processus de construction doit inclure l'optimisation. Une partie de cette optimisation devrait être de minimiser la taille des fichiers et l'optimisation du trafic réseau, en combinant en un seul fichier js pour réduire les appels effectués par le navigateur.
En règle générale, je choisis le moins possible simplement pour réduire le nombre de requêtes adressées au serveur.
Dépend de la taille de votre application. Mais il est généralement préférable de regrouper vos fichiers javascript de manière appropriée pour une meilleure maintenabilité et réutilisation.
Vous pouvez utiliser un chargeur de module JS comme RequireJS pour charger votre JavaScript. Au moins, les fichiers seront organisés. Vous pouvez améliorer les performances du serveur en vous assurant que ces fichiers peuvent être mis en cache sur les navigateurs de l'utilisateur afin qu'ils ne les téléchargent qu'une seule fois.