2009-12-23 10 views
14

J'ai lu que la fusion de plusieurs fichiers javascript en un seul fichier améliore les performances, est-ce vrai?Fusion de plusieurs fichiers javascript

Si oui, y a-t-il un moyen simple et sans erreur de les fusionner, ou peut-être un outil en ligne qui fait cela automatiquement?

Merci beaucoup.

+1

Je ne crois pas que cela soit vrai - un fichier js monolithique prendra plus de temps à télécharger, et étant monolithique il y a risque que la page utilise 25% de la js dessus (ou moins). –

+0

Cela dépend du nombre de fichiers. Comme le remarque le commentateur précédent, mettre tout votre fichier JS qui est chargé par toutes les pages peut entraîner le chargement de beaucoup de JS non pertinents. Cependant, si vous combinez 3 fichiers où tout le code est souvent utilisé dans 1, vous devrez réduire le nombre de requêtes HTTP pour le chargement de la page et ainsi améliorer la vitesse de chargement de la page. – mopoke

+0

Chargement de plusieurs fichiers plutôt que de charger un fichier est certainement plus lent, car votre navigateur établit plusieurs connexions http pour charger ces fichiers et l'établissement d'une connexion http a un certain coût. – Nayan

Répondre

16

Voir Multiple javascript/css files: best practices? et Supercharging Javascript in PHP.

La réponse courte est que vous voulez minimiser les requêtes HTTP externes. La meilleure façon de le faire est de forcer le navigateur à mettre en cache les fichiers que vous serveur jusqu'à ce qu'ils changent. Vous faites cela en versionnant les fichiers et en fournissant un futur en-tête Expires très lointain. Lorsque le nom de fichier change (en changeant la version), le navigateur obtiendra la nouvelle version.

Si vous faites cela, alors plusieurs fichiers Javascript n'ont pas vraiment d'importance. Mais si vous forcez le client à télécharger 27 fichiers JS sur chaque page sans mise en cache, la réduction du nombre de fichiers peut faire une différence substantielle. Bien sûr, cela reste inférieur aux stratégies efficaces de mise en cache/versionnage.

Une autre question plus récente à considérer est iphone caching:

iPhone ne sera pas les composants de cache plus grand que 15K (était 25K dans la expérience précédente)

Ainsi, dans certaines circonstances, combinant fichiers peuvent être préjudiciable.

+0

pourquoi mentir au client "le meilleur"? au moins Firefox demande des fichiers js, etc conditionnellement (avec If-Modified-Since). pas besoin de bricoler avec les noms de fichiers. –

+0

Quand vous dites "fichiers" en ce qui concerne la mise en cache, vous parlez de pages Web, pas Javascript correct? –

+0

Non, je veux dire le contenu statique en général (Javascript, CSS, images).Ceux-ci devraient être mis en cache agressivement. Qui a dit quoi que ce soit sur "mentir"? Vous dites essentiellement au client: «Ne le demandez plus tant que je ne vous ai pas dit que c'est changé». C'est bon. – cletus

3

Si vous avez beaucoup de fichiers javascript, il peut être utile de les combiner et de les réduire. En les combinant dans un seul fichier, vous réduisez le nombre de connexions et de fichiers à télécharger depuis votre site. En les réduisant, vous réduisez la taille des fichiers en supprimant les espaces blancs, les commentaires, etc. Jetez un oeil à JSMin et YUI Compressor.

Modifier: Comme d'autres commentateurs l'indiquent, la combinaison de fichiers n'a vraiment de sens que si les utilisateurs utilisent activement les fonctionnalités de tous les fichiers. Il ne serait pas logique de combiner un fichier javascript volumineux et rarement utilisé avec toutes vos fonctions couramment utilisées.

0

vous pouvez essayer pakd.io vous pouvez fusionner les fichiers CSS et js

Questions connexes