Accélération de chargement HTML

Question

Je veux accélérer le chargement d'une page HTML. Je sais que je peux compresser le HTML, JS et CSS, mais je pensais aller un peu plus loin. Au lieu d'avoir des liens vers des fichiers CSS et JS, je voudrais (ou le serveur) simplement copier & coller directement leur contenu dans le HEAD. C'est essentiellement pour économiser quelques allers-retours TCP sur le serveur Web. Ce que je ne sais pas, c'est ... Est-ce que le navigateur fait une requête HTTP séparée pour chaque fichier JS et CSS?

Appréciera votre contribution

Merci! -Assaf

Answer 1

Oui, pour chacun des JS et CSS, il existe une requête HTTP séparée. Toutefois, la connexion TCP peut être identique et peut être différente selon l'en-tête Keep-Alive.

http://en.wikipedia.org/wiki/Keepalive

Avez-vous pensé que copier coller le juste JS et CSS dans la tête peut rendre votre site difficile à maintenir. Je garderais toujours mes CSS et JS à l'emplacement central même si cela ajoutait une petite surcharge à la performance.

Vous pouvez vérifier la technologie de compression fournie par votre serveur Web. Par exemple, si vous utilisez IIS, consultez la compression IIS

http://www.microsoft.com/technet/prodtechnol/windowsserver2003/library/iis/d52ff289-94d3-4085-bc4e-24eb4f312e0e.mspx

Answer 2

Oui. Vous pouvez regarder ces demandes en action avec un outil d'analyse d'en-tête, tel que LiveHTTP for Firefox.

http://developer.yahoo.com/performance/rules.html est un excellent résumé d'autres optimisations.

Answer 3

Oui et Non En général oui, mais vous pouvez arrêter les requêtes indésirables JS et CSS sur le retour des visites en permettant la mise en cache du navigateur. La mise en mémoire cache n'est toutefois utile que si une part importante des demandes provient des utilisateurs qui reviennent et si les fichiers JS et CSS ne sont pas souvent modifiés. Vous devez définir le temps de mise en cache dans les en-têtes de réponse en fonction de leur volatilité attendue. Cette Caching Tutorial explique l'utilisation des en-têtes de mise en cache.

Une autre approche pour éviter le cache obsolète consiste à renommer les fichiers JS et CSS et leurs références en HTML à chaque modification.

Si les mêmes fichiers JS et CSS sont référencés dans de nombreuses pages HTML, les conserver séparément des pages devrait être plus optimal pour les performances.