JavaScript est l’un des langages les plus utilisés dans le développement Web. C'est simple, mais très puissant, et le nombre de façons de l'utiliser est presque illimité. C'est pourquoi il est si important de demander conseil à ceux qui vous ont précédé. Voici 10 conseils de développeurs Web respectés au sein de la communauté JavaScript..
Christophe Porteneuve a des projets sérieux. Il développe des sites Web depuis 1995, dirige le département de génie logiciel d’une grande école d’informatique et est maintenant le CTO de Ciblio.net. Il est tellement bon dans ce qu'il fait que l'équipe de A List Apart lui a donné de la publicité à l'écran pour partager certaines de ses idées..
Christophe aborde une facette très importante de javascript: les fixations.
Presque aucun langage majeur de programmation orientée objet (OOP) ne vous oblige à envisager la liaison. Autrement dit, ils ne vous obligent pas à qualifier explicitement l'accès aux membres (méthodes et propriétés) de l'objet actuel avec une référence telle que this ou self. Si vous appelez une méthode sur aucun objet en particulier, vous l'appelez généralement sur l'objet actuel. Il en va de même lorsque vous transmettez une méthode pour une invocation ultérieure: elle conservera son objet actuel. En bref, pour la plupart des langages POO, la liaison est implicite.
Christophe donne ensuite des exemples de liaison appropriée et explique comment reconnaître des modèles de liaison sensibles. Voici quatre points à retenir dans l'article de Christophe:
ce
.appliquer
et appel
.Dave Shea est un développeur et concepteur Web respecté, probablement mieux connu pour son excellent travail sur CSS Zen. Dave a démontré une capacité incroyable pour la conception d'interfaces utilisateur exceptionnelles et est un autre auteur pour l'excellent A List Apart..
Les bibliothèques JavaScript sont comme un couteau suisse du développeur Web. Il existe d'innombrables variétés de bibliothèques JavaScript et le nombre de développeurs développant des plug-ins pour ces bibliothèques augmente chaque jour. Vous pouvez utiliser les bibliothèques JavaScript pour presque toutes les fonctionnalités.
Prenez les sprites CSS, par exemple. Au lieu d'utiliser des mises en page flash lourdes pour obtenir un effet de survol, Dave Shea estime que vous devez utiliser de minuscules bibliothèques JavaScript comme jQuery pour bénéficier des mêmes fonctionnalités. Dave énumère certains des avantages de l’utilisation des bibliothèques JavaScript, notamment celles hébergées par Google..
Étant donné que de nombreux autres développeurs Web créeront un lien vers le code Google, il est possible que le code JavaScript se trouve déjà dans le cache du navigateur. L'utilisation de bibliothèques JavaScript vous permettra de consacrer plus de temps au développement et moins de temps à l'écriture de code JavaScript..
John Resig est l'un des développeurs JavaScript les plus populaires de la planète. Il a créé la très populaire bibliothèque JavaScript jQuery. Il a écrit un livre sur les techniques JavaScript professionnelles et partage même ses connaissances en matière de script sur son blog personnel..
John donne une méthode assez unique pour accélérer le temps de développement JavaScript avec l'utilisation de micro-modèles.
J'ai un petit utilitaire que je balaie depuis un certain temps maintenant que je trouve très utile dans mes efforts de création d'applications JavaScript. Il s'agit d'une fonction de création de modèles extrêmement simple, rapide, facile à utiliser et à mettre en cache. J'ai quelques astuces que j'utilise pour que ce soit vraiment amusant de jouer avec.
Bien que l’utilisation de micro-modèles ne soit pas une mission critique, elle peut vraiment accélérer le processus de développement. Découvrez quelques exemples de micro-modèles de John pour avoir une meilleure idée des avantages de la fonction de modèles..
Ayman Hourieh est diplômé en informatique, employé de Google et auteur sur le développement Web de Django. Ayman connaît son chemin avec une programmation élégante.
Dans son article présentant neuf astuces JavaScript, Ayman aborde un aspect légèrement plus avancé des méthodes de liaison aux objets..
Toute personne travaillant avec des événements JavaScript peut avoir rencontré une situation dans laquelle elle doit affecter une méthode d'objet à un gestionnaire d'événements. Le problème ici est que les gestionnaires d'événements sont appelés dans le contexte de leur élément HTML, même s'ils étaient liés à un autre objet. Pour surmonter cela, j'utilise une fonction qui lie une méthode à un objet. il prend un objet et une méthode et retourne une fonction qui appelle toujours la méthode dans le contexte de cet objet.
En utilisant Prototype et un peu de code personnalisé, Ayman fournit un excellent conseil pour la liaison de méthodes à des objets. Un petit tour simple et efficace.
Andrew Tetlaw développe des sites Web depuis 1997 et est l'éditeur technique de SitePoint. SitePoint n'embaucherait pas n'importe qui pour devenir son éditeur technique. Andrew écrit sur SitePoint en est la preuve.
L'utilisation de l'interactivité JavaScript dans vos mises en page peut être une tâche ardue. Mais Andrew a montré que l'utilisation de la délégation d'événements est non seulement plus facile que vous ne le pensez, mais offre également de nombreux avantages, tels que l'élimination des fuites de mémoire..
Les événements JavaScript sont le fondement de toute interactivité sur les pages Web (j'entends une interactivité sérieuse, pas ces menus déroulants dinky CSS). Dans la gestion d'événements traditionnelle, vous ajoutez ou supprimez des gestionnaires d'événements de chaque élément, selon vos besoins. Cependant, les gestionnaires d'événements peuvent potentiellement causer des fuites de mémoire et une dégradation des performances: «plus vous en avez, plus le risque est grand. La délégation d'événement JavaScript est une technique simple selon laquelle vous ajoutez un seul gestionnaire d'événement à un élément parent afin d'éviter d'avoir à ajouter des gestionnaires d'événement à plusieurs éléments enfants..
La plupart des principales bibliothèques JavaScript ont des exemples de délégation d'événements. Vous n'aurez donc pas à écrire votre propre script personnalisé..
Chris Heilmann est un évangéliste du développement international qui travaille pour le réseau de développeurs Yahoo. Chris a quelques commandes JavaScript importantes et vous pouvez voir de nombreuses présentations en direct sur son site Web personnel..
Chris a développé un excellent tutoriel qui montre les différences entre la délégation d'événements et la gestion d'événements..
La différence entre les deux d'entre eux réside dans le fait que l'exemple "Handlers" est plutôt lent lorsque la liste est très longue, tandis que l'exemple "Délégation" peut être étendu autant de fois que vous le souhaitez sans ajouter de temps système. Ce dernier exemple est aussi beaucoup plus facile à changer.
La délégation d'événements est mieux adaptée aux grandes applications, tandis que la gestion d'événements est beaucoup plus adaptée aux petits projets..
Pour les très petits efforts de gestion d’événements, la solution classique vous donne plus de contrôle et il est assez facile de la céder aux autres développeurs sans trop d’explication. Cependant, la délégation d'événements est probablement le seul moyen de conserver une application volumineuse avec un grand nombre d'éléments auxquels appliquer le traitement (ou des éléments chargés dynamiquement)..
Si jamais il y avait une équipe de "maîtres JavaScript", Yahoo! Le réseau de développeurs pourrait être ça. Le Yahoo! L’équipe de développeurs a fourni des atouts incroyables à la communauté des développeurs. Ils proposent de nombreux articles et des conseils de leurs propres développeurs, ce qui nous permet d’être assurés que chaque connaissance qu’ils partagent dépasse un niveau de qualité élevé..
Ajax peut être un outil formidable pour offrir une expérience utilisateur beaucoup plus riche à un site Web. Cependant, l'utilisation d'Ajax a pour inconvénient que son chargement est parfois plus lent qu'un site Web traditionnel. L'équipe de développement de Yahoo a développé quelques astuces pour travailler avec JavaScript et Ajax, en particulier avec la mise en cache d'Ajax afin que les temps de réponse soient beaucoup plus rapides..
Dans de nombreuses applications, le maintien de l’attente de l’utilisateur dépend de la manière dont Ajax est utilisé. Par exemple, dans un client de messagerie Web, l'utilisateur sera tenu d'attendre les résultats d'une demande Ajax pour rechercher tous les courriers électroniques correspondant à ses critères de recherche. Il est important de se rappeler que "asynchrone" n'implique pas "instantané".
Pour améliorer les performances, il est important d’optimiser ces réponses Ajax. Le moyen le plus important d'améliorer les performances d'Ajax est de rendre les réponses cachables…
La mise en cache d'appels Ajax avec des méthodes telles que l'ajout d'un périmètre de contrôle Expires ou Cache-Control accélère considérablement les temps de réponse de l'application..
Il n’est pas surprenant que l’équipe YUI fasse cette liste deux fois, avec sa vaste base de connaissances sur les astuces JavaScript.
Un aspect simple mais essentiel du développement avec JavaScript que beaucoup de développeurs oublient consiste à ajouter du JavaScript au bas de la page, par opposition au haut. En ajoutant JavaScript inclut en haut de la page, vous bloquez également les téléchargements parallèles d'autres éléments de la page, tels que les images..
Ce n'est pas toujours la meilleure idée d'ajouter JavaScript inclus en bas, mais vous pouvez le faire plusieurs fois, et vos performances augmenteront à cause de cela..
Julien Lecomte est encore un autre Yahoo! Employé du réseau de développeurs. C'est un homme très compétent en matière d'optimisation du code JavaScript, car il est l'auteur du compresseur YUI ainsi que du gestionnaire d'histoire de YUI..
Dans une conférence donnée par Julien, il donne d'excellents conseils sur l'optimisation de JavaScript. Au cours de la présentation, Julien a déclaré que les programmeurs JavaScript devraient rester aussi éloignés que possible du constructeur Eval. Sur la diapositive 19 du discours, vous verrez sa raison d'être..
- La chaîne transmise à Eval (et ses parents, le constructeur de fonctions et les fonctions setTimeout et setInterval) doit être compilée et interprétée. Extrêmement lent!
- Ne transmettez jamais une chaîne aux fonctions setTimeout et setInterval. Au lieu de passer une fonction anonyme.
- N'utilisez jamais Eval et le constructeur Function (sauf dans des cas extrêmement rares et uniquement dans des blocs de code où les performances ne sont pas critiques).
Peter-Paul Koch est un développeur Internet Apple populaire qui gère également le site Web Quirksmode, qui propose une foule de conseils sur JavaScript. Peter-Paul a également écrit ppk sur JavaScript, qui contient toutes sortes d'informations sur le bon développement de JavaScript..
PPK évoque un malentendu majeur (et commun) que de nouveaux rédacteurs de scripts Java pourraient rencontrer fréquemment: = ou == ?
Une erreur que les auteurs de JavaScript font fréquemment est de confondre les opérateurs d'affectation et d'égalité = et ==. Si vous souhaitez comparer deux valeurs, vous devez utiliser un double signe égal, car c'est ainsi que JavaScript fonctionne. Si vous utilisez accidentellement un seul signe égal, vous ne comparez pas de valeurs, mais vous affectez une valeur à une variable..
Bien qu'il ne s'agisse pas d'un concept bouleversant ou d'une petite information, c'est un rappel utile qui peut faire gagner de nombreuses heures au programmeur débutant.
Glen Stansberry est un développeur et blogueur Web qui a eu beaucoup de difficultés à admettre avec CSS. Vous pouvez lire plus de conseils sur le développement Web sur son blog Web Jackalope.
Si vous avez trouvé cet article utile, merci de remercier Digg: