Javascript : attention aux chargements

Vous avez surement remarqué depuis l’apparition des sites web 2.0 avec l’apparition d’Ajax, le code Javascript des sites a pris de l’embonpoint. Raison à cela : la multiplication des librairies javascript (prototype, script.aculo.us, dojo et autres librairies).

On se retrouve avec 5 / 6 voire 10 includes javascript au début de la page (sans compter les tags google analytics et autres).

Donc parfois la première page est souvent laborieuse à venir . Après je vous accorde que le navigateur fait son boulot et gère correctement le cache mais le chargement de la première page c’est aussi la première impression de l’internaute.

En fait le probleme est très simple, un navigateur ne parallelise pas le chargement des includes javascript, il les lit dans l’ordre car il interprete le code. On se retrouve donc avec une suite de requetes de chargements / interpretations de fichier javascript.

La solution est simple, vous pouvez développer avec une liste de fichiers javascript mais lors de la mise en production, concatenner tous vos fichiers javascript en 1 seul (plus gros mais unique donc un peu moins rapide à charger mais une seule requete et pas d’attente)

Economisez votre serveur : Triez en Javascript

Avec un peu de javascript, on peut assez facilement dimunuer le nombre de requetes vers le serveur et ainsi le soulager de travail inutil. En effet, il est toujours mieux de faire le travail sur le poste du client que sur le serveur !

Un exemple très simple est « les tris sur les tables HTML« , vous avez un tableau triable avec la possibilité de trier selon plusieurs colonnes. En php, c’est un peu long a mettre en place il faut gérer le « ORDER BY« , les différentes clés… pour la plupart du temps une petite liste.

Bien sûr, quand la requete renvoit 10000 élements c’est plus difficile de faire autrement mais est-ce vraiment le cas ?

Personnelement j’utilise une petite libriairies Javascript sortable, qui permet de rendre une table HTML toute simple en veritable petite tableau Excel.

Voici un exemple sur mon site Wanarun. Vous y verrez aussi une petite surprise pour la gestion des pages…

Youtube… en savoir plus

Depuis hier, vous avez commencer à mettre en place votre site de vidéo en ligne. Tout marche à la perfection mais avez-vous pensé à tout ? je ne sais pas…La référence en la matière est Youtube

Pour en savoir plus, sur l’architecture de Youtube, je vous propose de lire cet article High Scalability Youtube. Il donne un aperçu de l’architecture de ce site.

Il est important de penser dès le début à la montée en charge (redondance et multi-serveur). Il faut se poser les bonnes questions :

  • Ou est la limite de mon application ?
  • Quand mon serveur sera à saturation, comment inclure un deuxième serveur ?

Il vaut mieux avoir une idée dès le début sur ce genre de question, sinon il faudra complétement repenser l’application pour la montée en charge…. Souvent le fait de changer le serveur pour un plus puissant ne sera une solution qu’à court terme….

Web 2.0 : Construire son propre site de video

Dans le web 2.0, il faut de l’ajax mais il faut aussi pouvoir concurrencer les Youtube et autres Dailymotion

Pour ca, je vous propose de mettre en place uniquement avec des outils Open Source, votre propre site de vidéo. Vous aurez besoin de quelques connaissances :

  • Linux (Debian)
  • Shell
  • LightHttpd
  • PHP

Tous les détails dans cet article

Aprés à vous de mettre en place sur votre site Web.

Il vous restera plusieurs petites choses techniques à gérer :

  • Le formulaire d’upload, 3 pistes :
    1. Un formulaire classique
    2. Utilisation de JUploadr (Applet Java)
    3. Utilisation de la barre progressive PECL
  • La gestion du volume de vidéo (espace disque)



Check out our best movie collection. Latest CD, DVD, HQ DVD movie downloads. Buy and download movies instantly.