Comment combiner les requêtes pour plusieurs fichiers javascript en une requête http?

Ce concept est un nouveau pour moi – je l'ai rencontré pour la première fois dans le configurateur de dépendance YUI . Fondamentalement, au lieu d'avoir plusieurs requêtes pour de nombreux fichiers, les fichiers sont enchaînés dans une requête http pour réduire le temps de chargement de la page.

Quelqu'un sait comment le mettre en œuvre sur une pile LAMP? (J'ai déjà vu une question similaire, mais elle semble être spécifique à l'ASP .

Merci!

Mise à jour: les deux réponses sont utiles … (mon représentant n'est pas suffisamment élevé pour commenter, alors j'ajoute quelques pensées de départ ici). J'ai également rencontré une autre publication de blog avec des exemples spécifiques à PHP qui pourraient être utiles. La réponse à la construction de David, cependant, me fait penser à une approche différente. Merci David!

Il existe plusieurs façons, les deux plus évidents seraient:

  1. Créez un outil comme YUI qui crée une version unique et personnalisée basée sur les composants que vous avez cochés au besoin afin que vous puissiez toujours servir le fichier comme statique. MooTools et jQuery UI fournissent tous les compilateurs de paquets comme ceci lorsque vous téléchargez leur colis pour vous permettre de créer la bibliothèque la plus rationalisée et la plus efficace possible. Je suis sûr qu'un outil générique générique existe là-bas.
  2. Créez un simple script Perl / PHP / Python / Ruby qui sert une foule de fichiers JavaScript en fonction de la demande. Ainsi, "onerequest.js? Load = ui & load = effects" irait vers un script PHP qui charge dans les fichiers et les sert avec le type de contenu correct. Il y a beaucoup d'exemples, mais personnellement, je ne suis pas un fan.

Je préfère ne pas servir les fichiers statiques à travers n'importe quel type de script, mais j'aime aussi développer mon code avec 10 fichiers séparés de petite classe, sans le coût de 10 requêtes HTTP. J'ai donc élaboré un processus de construction personnalisé qui combine toutes les classes et fonctions les plus courantes, puis les minifie en un seul fichier comme project.min.js et ont une condition dans toutes mes vues / modèles qui incluent ce fichier sur la production.

Edit – Le "processus de génération personnalisé" est en fait un script perl extrêmement simple. Il lit dans chacun des fichiers que j'ai transmis en tant qu'arguments et les écris dans un nouveau fichier, en passant éventuellement le tout via JSMIN (disponible dans toutes vos langues préférées) automatiquement.

À la commande, il ressemble à:

perl build-project-master.pl core.js class1.js etc.js /path/to/live/js/file.js 

Il y a une bonne publication de blog sur ce http://www.hunlock.com/blogs/Supercharged_Javascript .

Ce que vous voulez, c'est Minify . Je viens d'écrire un guide pour la mise en place.

Capistrano est un outil de déploiement Web basé sur Ruby. Si vous l'envisagez ou l'utilisez déjà, il y a un grand bijou qui comprendra les dépendances CSS et Javascript, fusionnera et minifiera les fichiers.

gem install juicer

De la page Juicer GitHub , il peut déterminer les fichiers qui dépendent les uns des autres et les fusionner ensemble, réduisant le nombre de requêtes http par page, améliorant ainsi les performances.