Depuis près d’ un an, les navigateurs comme Chrome, Firefox ou encore Safari redoublent d’efforts pour améliorer sensiblement la vitesse d’exécution du JavaScript, et ceci nous offre de nouvelles perspectives comme par exemple ajouter de la 3D dans nos pages.
Je vous propose de lire un article qui montre comment créer un petit moteur 3D en JavaScript et comment l’utiliser avec jQuery.
Ce moteur est composé de 3 classes:
La scène
La caméra
L’objet 3D (qui est un cube dans cet article)
Ce moteur n’utilise pas la nouvelle technologie WebGL qui gère la 3D avec des balises canvas, mais simule simplement le rendu 3D en convertissant les points 3D définis (X,Y,Z), en 2D (X,Y), la profondeur est simulée via la taille et l’opacité d’un objet.
Le moteur n’utilise pas entièrement jQuery puisque les calculs de conversions (3D => 2D) sont déjà lourds et l’ajout de fonction jQuery au milieu de ces calculs ne ferait que ralentir l’ animation 3D; les fonctions natives comme getElementById() ont donc été préférées pour le cœur du moteur.
Il y a quelques jours je vous parlais de WebGL qui permet de gérer nativement la 3D au sein d’un navigateur en se basant sur les balises canvas (Voir ici) et de son intégration dans la version de dev de Webkit .
Et aujourd’hui c’est au tour de Firefox de l’intégrer dans sa dernière Nightly Build!
Bon j’ espère vous dire la même chose pour internet explorer dans quelques jours…mais sincèrement je n’y crois pas…
WebGL vient d’être intégré au moteur de rendu Webkit (en version de Dev) qui est utilisé par Safari, Chrome ou en encore par l’Iphone, cette techno permet de gérer nativement la 3D au sein d’un navigateur, elle se base sur la nouvelle balise <canvas> (HTML5) et utilise OpenGL pour gérer la 3D.
FCKeditor souffrait d’un gros manque de rapidité lors de son chargement et cette nouvelle mouture est là pour combler ce manque, alors à vos mise à jour si vous utilisiez FCKeditor
La démo est ici, le téléchargement ici et la documentation ici.
Si comme moi vous avez une interface d’ administration réalisée avec le framework CSS jQuery UI, alors le Theme Switcher Widget est pour vous, il permet de passer d’un thème (officiel) à un autre en un clic !
Pour l’intégrer c’est encore très simple comme le montre cet exemple :
Animate est une fonction de jQuery qui permet d’animer un élément du DOM en modifiant son style (couleur, taille, bordures,police,opacité…etc) dans un temps donné.
Pour accéder à la liste des librairies hébergées c’est ici.
De plus cela permet aux navigateurs de ne pas télécharger inutilement plusieurs fois la même librairie sur chaque site qui l’utilise, puisqu’une fois jQuery téléchargé sur les serveur de google et mis en cache dans le navigateur, si un autre site utilise le même fichier jQuery hébergé par google, le navigateur n’aura plus à le retélécharger.
Puisque qu’une vidéo vaut mieux que de longs discours :
Pour résumer : utiliser les fichiers hébergés de Google est bon pour votre serveur(processeur et bande passante) et pour vos visiteurs (bande passante et temps de chargement).
Voici 3 outils qui permettent d’analyser le comportement de vos visiteurs sur vos pages, ils créent une animation ( ou vidéo ) qui reproduit les moindres fait et gestes de la souris de chaque visiteur.
Je vous rassure je ne pratique pas ces analyses sur ce blog
Clixpy :Service gratuit pour les 10 premières captures – Démo
Prix : 100 crédits : $10, 300 crédits : $20 ou 500 crédits: $30
Userfly – Service gratuit pour 10 captures /mois et payant ensuite – Prix – Démo
