Connect with us
Bouygues

Internet

Accélerer les choses

Il y a

le

Derrière ce titre assez global se cache un débat qui concerne tous les webmasters (ou presque) : celui de la rapidité et de la fluidité des sites Internet. L’exemple de Facebook est révélateur je trouve, car bien que de nombreuses fonctionnalités soient implémentées chaque jour, le réseau social est souvent lent.

digg_opti

C’est loin d’être le seul à avoir ce problème car rappelez-vous, il y a quelques mois de cela, Twitter affichait des temps d’indisponibilité pour les moins préoccupants. En effet, il devenait parfois difficile de charger une page sans avoir un message d’erreur. Désormais, on voit que rarement cette page, beaucoup moins qu’avant en tout cas. Le débat est aujourd’hui lancé par le célèbre Digg, qui consacre un temps important à l’optimisation de son site pour que la navigation soit plus rapide, au lieu d’implémenter sans cesse de nouvelles fonctionnalités.

De petites modifications parfois anodines peuvent se révéler payantes. Car les sites tels que Facebook ou Twitter consacrent un budget colossal aux serveurs, alors même un petit gain de bande passante est toujours bénéfique.

Sur le blog officiel de Digg, John Quinn parle justement des diverses optimisations que Digg est en train de faire pour rendre le site plus fluide. Dans un premier temps, les ressources statiques (fichiers CSS / JavaScript) sont déplacées sur un CDN (Content Delivery Network).

Le site a fait une autre modification : retirer les avatars 16×16 des membres sur la page d’accueil. Cette modification peut paraître mineure mais elle réduit considérablement le nombre de requêtes HTTP, et les performances le montrent. Selon le blog officiel, ils réduisent « les requêtes HTTP à Digg pour une charge de cache d’environ 75% ».

L’avatar de l’auteur est par contre visible sur la page du lien en taille normale. Digg affirme que c’est une modification parmi d’autres, qui se dérouleront au cours des prochains mois.

À ce propos, j’avais lu un article sur l’infrastructure de Wikipédia (et de ses serveurs) et ça m’avait assez étonné : il s’agit tout bêtement de LAMP (Linux Apache MySQL PHP) avec différents systèmes pour optimiser (load balancing, cache, memcached, etc.). Je fais cette remarque car Wikipédia est un des sites les plus visités au monde et reste très fluide.

Au passage, pour réduire le nombre de requêtes HTTP et votre bande passante, une des solutions est de fusionner et compresser vos fichiers CSS / JavaScript.

17 Commentaires

17 Commentaires

  1. Simonvd

    9 octobre 2009 at 10 h 55 min

    Même si le contenu de wikipedia est éditable il est globalement très statique (je dirais que au moins 90% de gens ne font que consulter le contenu), du coup sa cache est rarement mise à jour. Facebook ou twitter sont beaucoup plus dynamique (leur concept est basé sur le changement des données permanentes), ça devient moins évidant au niveau de la gestion de cache, donc les ressources serveur sont beaucoup plus solliciter je pense…

  2. Tortue facile

    9 octobre 2009 at 11 h 21 min

    C’est vrai que malgré le haut débit ça rame toujours autant sur les gros sites. Pour Wikipédia une bonne partie des requêtes sont pour la lecture des articles donc il y a une bonne couche de cache derrière.

    Sinon pour tous ceux qui veulent en savoir plus sur l’optimisation du chargement des pages, y’a un site incontournable : http://performance.survol.fr/

  3. Jean-Sébastien Mansart

    9 octobre 2009 at 11 h 22 min

    J’avais écrit il y a quelques temps un article sur les performances web, qui synthétise les bonne pratiques et les conseils pour optimiser les temps de chargements :
    http://www.jsmansart.com/post/performances-d-un-site-web

  4. Damien

    9 octobre 2009 at 11 h 46 min

    Apparemment pour Wikipedia, ce n’est pas LAMP puisque le serveur http utilisé est Lighttpd…

  5. labilbe

    9 octobre 2009 at 11 h 51 min

    Je rajouterai à cette liste d’optimisations 2 choses :
    – la compression GZip (lorsque les navigateurs proposent la fonctionnalité) (http://www.websiteoptimization.com/speed/tweak/compress/)
    – le CSS Sprite afin de fusionner plusieurs images en une et travailler sur les coordonnées CSS (http://www.pompage.net/pompe/sprites/)

  6. labilbe

    9 octobre 2009 at 11 h 53 min

    Enfin je conseillerai 2 add-ons Firefox importants (les 2 add-ons nécessitent Firebug) pour l’optimisation :
    – YSlow http://developer.yahoo.com/yslow/
    – Page Speed http://code.google.com/speed/page-speed/

  7. Tortue facile

    9 octobre 2009 at 12 h 05 min

    @Damien : ils utilisent Lighttpd pour les serveurs d’images (comme Facebook aussi), sinon c’est Apache pour le serveurs web principaux.

  8. Vince

    9 octobre 2009 at 12 h 25 min

    Je plussoie sur Yslow, cette extension attribue une note aux pages web en suivant les best practices de Yahoo et indique les axes d’améliorationà suivre.

    Les best practices en question sont visibles sur http://developer.yahoo.com/performance/rules.html

  9. Floby

    9 octobre 2009 at 12 h 53 min

    Comme le de labilde, on peut utiliser ces deux plugin firebug très utiles. (j’utilise Google Page speed, mais c’est équivalent).

    Le plus intéressant est qu’ils sont basés sur cet article de Yahoo! http://developer.yahoo.com/performance/rules.html qui fait référence dans le milieu.

    Il parle notamment de la fusion et compression (gzip) des CSS/Javascript, un nom de domaine spécifique pour les ressources statiques, la gestion du cache navigateur, etc.

  10. info

    9 octobre 2009 at 13 h 59 min

    Même si certains sites sont lents, le haut débit a considérablement bouleversé les choses. Il est parfois bon de se souvenir des modem 56K….

  11. bigbabou

    9 octobre 2009 at 14 h 26 min

    On peut également corréler optimisation et SEO. Cet article illustre bien la chose avec une réduction du bounce rate en réduisant le temps de chargement de la page.
    http://www.compassdesigns.net/joomla-blog/improve-your-seo-with-this-one-easy-tip

    et puis si certaines personnes peuvent être intéressé par tout ce qui est architecture, performance et haute dispo ce blog est assez intéressant sur le sujet :
    http://www.haute-disponibilite.net/

  12. JaXX

    9 octobre 2009 at 14 h 35 min

    Elle a quoi de pas jolie ma box? Fuzz s’y sent très bien, tout est stable, je bougerais le site si nécéssaire 🙂

  13. SIko

    9 octobre 2009 at 14 h 35 min

    Y’a une chose que je trouve hallucinante.. les optimisation qu’il sont entrain de faire sur digg c’est ni plus ni moins que les bases de l’optimisation.

    Utiliser un cdn ? c’est vrai que c’est pas permis a tout le monde mais ce n’est pas l’idée du siècle..

  14. Anonym

    9 octobre 2009 at 15 h 43 min

    Mais lol , manquerait plus que Wikipedia Rame, la plupart des pages n’ont meme pas une image en jpeg dessus, ce serait malheureux que ça prenne du temps pour charger 1 page ou 2 de texte…

    rien à voir avec des sites + ou – socialo-communautaires genre FaceBook ou Digg où c’est à celui qui aura l’avatar et la signature la plus grosse , lourde et flashy…

  15. labilbe

    9 octobre 2009 at 15 h 49 min

    Y’a aussi le fait que Facebook a beaucoup plus d’intéractions que Wikipedia qui reste somme toute assez statique.
    Par conséquent, je pense il est plus difficile de gérer un cache sur Facebook (où les utilisateurs attendent de la nouvelle « fraîche »).

  16. Rosebud

    10 octobre 2009 at 17 h 35 min

    Y’a des sites qui sont un bordel monstreux plein de JS et compagnie… Les sites du coup en sont ralentis et ça devient affreux de naviguer dessus… Franchement les sites optimisés et agréable comme presse-citron se font rares…

  17. batelier59

    16 octobre 2009 at 15 h 08 min

    Merçi Eric d’éclairer chaque jour un peu plus ma lanterne de novice sur le web par tes précieux conseils !

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Dernières news

Les bons plans

Les tests