Conventions de dénomination Javascript

Je viens de Java et je suis nouveau sur JavaScript. J'ai remarqué de nombreuses méthodes JavaScript utilisant des noms de paramètres à caractère unique, comme dans l'exemple suivant.

doSomething(a,b,c)

Je n'aime pas ça, mais un collègue développeur JavaScript m'a convaincu que cela est fait pour réduire la taille du fichier, notant que les fichiers JavaScript doivent être transférés vers le navigateur.

Ensuite, je me suis retrouvé à parler à un autre développeur. Il m'a montré comment Firefox tronquera les noms de variables pour charger la page plus rapidement. Est-ce une pratique standard pour les navigateurs Web?

Quelles sont les meilleures pratiques de conversion de noms à suivre lors de la programmation en JavaScript? La longueur de l'identifiant est-elle importante et, dans l'affirmative, dans quelle mesure?

Vous constaterez que les développeurs eux-mêmes n'utilisent pas de noms de variables courts. Lors du développement, ils utilisent des noms de variables significatifs et détaillés.

Ensuite , dans le processus de génération / publication, le code qu'ils ont écrit est exécuté à travers un minifieur / obfuscateur dans le but de minimiser la taille du fichier, comme meilleure pratique pour accélérer un site Web. Ceci est une option pas si vous vous souciez que beaucoup au sujet de la performance. La plupart des petits sites Web ne le font pas.

En tant que développeur, vous ne devriez pas vous soucier du processus de minification / obscurcissement; écrivez votre code afin qu'il soit lisible, significatif, bien documenté et bien structuré. Ensuite, si vous vous souciez tant des performances (facultatif, n'oubliez pas!), Introduisez un minifieur / obfuscateur dans votre processus de publication pour minimiser le code (supprimer les espaces blancs, les nouvelles lignes, les commentaires, etc.) et pour les obscurcir (par exemple, raccourcir la variable des noms). Un bon article qui explique l'obscurcissement vs la minification peut être trouvé ici .

De plus, Desktop FireFox ne tronquera pas la période des noms de variables . La troncature des noms de variables est là pour accélérer le téléchargement des pages. Au moment où FireFox obtient le fichier, il a déjà été téléchargé, il n'est donc pas nécessaire de le faire. Votre ami peut exécuter un plugin qui fait cela; dans ce cas, dites-lui de le désinstaller, car c'est inutile.

Pour terminer, certains navigateurs (mobiles) ont la possibilité d'utiliser des serveurs intermédiaires, qui interceptent les réponses des ressources que vous avez demandées, et les compressent pour vous (ce qui pourrait inclure la minification de fichiers JavaScript). Notez que la compression est effectuée sur le serveur (c'est-à-dire avant d'avoir téléchargé la page), d'où l'avantage potentiel de télécharger un fichier plus petit, plutôt que dans le navigateur une fois que vous avez déjà téléchargé le fichier (comme suggéré dans la question). Ces navigateurs mobiles incluent Opera Mini et les versions plus récentes de Google Chrome (sur iOS au moins; je ne suis pas sûr d'Android). Pour plus d'informations, voir ici .

Non, tous les navigateurs ne raccourciront pas automatiquement le JavaScript pour améliorer les performances.

Cependant, dans le cas de JavaScript, vous ne devez pas sacrifier la lisibilité / maintenabilité du code pour des gains de vitesse de traitement ou de sécurité car il existe des outils appelés obfuscateurs et d'autres outils appelés shinkers (ou compresseurs) qui ont été conçus à cet effet.

N'oubliez pas, ne pré-optimisez pas. Si votre page se charge assez rapidement et que vous n'avez pas de contenu trop sensible dans votre JavaScript, ne vous en faites pas. Nommez vos variables avec des noms significatifs. La lisibilité du code est très importante pour la maintenabilité et devrait rarement, voire jamais, être sacrifiée.

Si vous souhaitez une référence à quelques bonnes conventions de codage JavaScript, je recommande d' utiliser ceux - ci .

Ne vous inquiétez pas de la taille du fichier prématurément. Bien que ce soit toujours une préoccupation, la lisibilité et la maintenabilité sont plus importantes.

Cela dit, vous devriez probablement utiliser les versions minifiées (par exemple, via YUI Compressor ) de vos scripts de toute façon.

Si vous êtes intéressé par les meilleures pratiques pour le développement Web en général, je vous suggère de lire Qu'est-ce que chaque programmeur doit savoir sur le développement Web?

J'ai travaillé en JavaScript pendant très longtemps.

Nous avions une norme de dénomination que vous deviez utiliser la notation hongroise pour toutes les variables.

Cela semblait bien fonctionner. Je sais qu'il y a des cas contre l'utilisation de cela, mais cela a bien fonctionné pour nous. Surtout lorsque vous avez des fichiers JavaScript massifs où vous devez trouver des trucs.

Je mets en garde contre une optimisation prématurée. Vous êtes très susceptible de vous retrouver avec du code en désordre qui ne fonctionne pas vraiment beaucoup plus rapidement.

La longueur de l'identifiant n'a pas d'importance. Comme d'autres l'ont dit, en production, la minification peut être utilisée pour réduire le temps de téléchargement des scripts. En fait, une convention de codage / dénomination acceptable doit être suivie, en particulier parce que JavaScript est un langage original et pendant si longtemps, JavaScript a été négligé comme une simple chose pour faire le travail. Si vous recherchez un lieu pour la convention de dénomination, le guide de style Google JavaScript est un bon endroit. Ça suggère,

• functionNamesLikeThis, par exemple, getCashbackData () {}
• variableNamesLikeThis, par exemple, var alertInterval = 10;
• ClassNamesLikeThis, par exemple, var CustomerOrder = {getOrderLines: function () {}}
• EnumNamesLikeThis, par exemple, var ColorOfChoice = {White: "#FFFFFF"}
• methodNamesLikeThis, par exemple, var CustomerOrder = {getOrderLine: function () {}}
• SYMBOLIC_CONSTANTS_LIKE_THIS, par exemple, var EPOCH_UNIX = "01011970"

Furieux par la philosophie du "développeur de code propre" (et étant donné que vous savez maintenant des messages ci-dessus qu'avec la réduction de la taille de vos noms de variable, cela n'aura aucun impact sur les performances), je ne peux que conseiller:

1. Trouvez le meilleur IDE pour vos besoins de développement personnel qui possède des fonctionnalités d'auto-complétion et d'intellisense décentes, telles qu'aptana, netbeans, eclipse (tous gratuits) ou l'un des nombreux produits commerciaux (si j'avais un jeu gratuit, je regarder dans les produits JetBrains)

2. Écrivez votre code d'une manière qui rend tout commentaire superflu. Cela signifie, au lieu d'écrire

   getXy(e) { return [e.pageX, e.pageY ] }

   ce qui pourrait signifier vraiment n'importe quoi (surtout dans un langage fou typé lâche comme js;) vous faites s'exprimer le code

   getPageCoordinatesFromEvent(event) { 
       return [event.pageX, event.pageY ];
   }

   Dans un bon IDE, vous ne tapez généralement jamais de nom de variable aussi long - deux fois que vous tapez quelques lettres et appuyez simplement sur Entrée à partir de la saisie semi-automatique. Si vous insistez pour taper chaque caractère vous-même, un bon IDE vous remarquera quand même une faute de frappe. Ceci est juste un exemple très superficiel, donc je suggère fortement (non pas comme une forme de critique mais comme une recommandation honnête) que vous

3. Obtenez les livres "Clean Code" de Robert C.Martin et ou "Pragmatic Programmer" de Hunt / Thomas et ne vous posez plus jamais ce genre de questions - vous serez beaucoup trop occupé à travailler sur un serveur d'intégration continue pour automatiser le test ennuyeux -, & construisez des parties du processus de développement (y compris la minification) et concentrez-vous sur la partie amusante, en écrivant du code clairement compréhensible qui fait du bon travail!

PS Si vous avez besoin de vous familiariser avec le développement de code javascript à la pointe de la technologie, jetez un œil au livre de John "Mr. jQuery" Resig sur les "Techniques Javascript Pro" juste après ou avec ce qui précède.