1. JavaScript, ce n’est pas
(si) sale
Julien Jakubowski
Ch’ti JUG
Document sous license Creative Commons Attribution - Pas d’Utilisation Commerciale - Pas de Modification
2.0 France (CC BY-NC-ND 2.0) - http://creativecommons.org/licenses/by-nc-nd/2.0/fr/
mardi 25 septembre 2012
2. Qui suis-je ?
Julien Jakubowski - @jak78
Développeur Java et web depuis ~10 ans
mardi 25 septembre 2012
3. Qui ne suis-je pas ?
Un véritable expert JavaScript ;-)
John Resig - jQuery
Douglas Crockford - JSLint, JavaScript
the Good Parts
mardi 25 septembre 2012
4. On va parler de JavaScript
entre Javaïstes
mardi 25 septembre 2012
5. On va parler de JavaScript
entre Javaïstes
Java is to JavaScript as Ham is to Hamster
http://coding.smashingmagazine.com/2009/07/29/misunderstanding-markup-xhtml-2-comic-strip/
mardi 25 septembre 2012
6. On va aussi parler de :
Super-héros Bière Maroilles
mardi 25 septembre 2012
60. Architecturer son code
http://www.gettyimages.fr/detail/illustration/forklift-building-a-cube-with-smaller-illustration-libre-de-droits/109424118
mardi 25 septembre 2012
61. Diviser 100 000 lignes de
code en plusieurs fichiers
Temps de chargement Dépendances
mardi 25 septembre 2012
62. Diviser 100 000 lignes de
code en plusieurs fichiers
Temps de chargement Dépendances
mardi 25 septembre 2012
63. AMD
RequireJS, Curl...
mardi 25 septembre 2012
64. AMD
RequireJS, Curl...
√ Découper mes 100 000 lignes en sous-modules
mardi 25 septembre 2012
65. AMD
RequireJS, Curl...
√ Découper mes 100 000 lignes en sous-modules
√ Chaque module est dans son scope isolé
mardi 25 septembre 2012
66. AMD
RequireJS, Curl...
√ Découper mes 100 000 lignes en sous-modules
√ Chaque module est dans son scope isolé
√ Chargement asynchrone et à la demande
mardi 25 septembre 2012
67. AMD
RequireJS, Curl...
√ Découper mes 100 000 lignes en sous-modules
√ Chaque module est dans son scope isolé
√ Chargement asynchrone et à la demande
X Ordre du chargement et asynchronisme
mardi 25 septembre 2012
68. AMD
RequireJS, Curl...
√ Découper mes 100 000 lignes en sous-modules
√ Chaque module est dans son scope isolé
√ Chargement asynchrone et à la demande
X Ordre du chargement et asynchronisme
X Intégration avec librairies tierces
mardi 25 septembre 2012
69. Backbone.js
Sorte de SpringMVC / JSF
mardi 25 septembre 2012
70. Backbone.js
Sorte de SpringMVC / JSF
√ Structure votre code en MVC / MVP
mardi 25 septembre 2012
71. Backbone.js
Sorte de SpringMVC / JSF
√ Structure votre code en MVC / MVP
√ Maintenabilité d’applications de taille non-
triviale
mardi 25 septembre 2012
72. Backbone.js
Sorte de SpringMVC / JSF
√ Structure votre code en MVC / MVP
√ Maintenabilité d’applications de taille non-
triviale
X Coût d’entrée
mardi 25 septembre 2012
73. Backbone.js
Sorte de SpringMVC / JSF
√ Structure votre code en MVC / MVP
√ Maintenabilité d’applications de taille non-
triviale
X Coût d’entrée
X Maturité, pas de standards (AngularJS...)
mardi 25 septembre 2012
74. Tests automatisés
http://www.flickr.com/photos/horiavarlan/4747872021/sizes/l/in/photostream/
mardi 25 septembre 2012
75. Tests d’IHM
Selenium Windmill
Robotisent un navigateur qui attaque votre
application
mardi 25 septembre 2012
80. Eviter les parties sales
http://www.gettyimages.fr/detail/photo/hands-of-a-blacksmith-in-his-studio-image-libre-de-droits/109889293
mardi 25 septembre 2012
81. JsLint
Trouve les utilisations d’ugly parts
Sorte de CheckStyle / PMD / FindBugs
S’intègre à Eclipse
mardi 25 septembre 2012
92. Avec
Pas de pollution Concision, lisibilité
mardi 25 septembre 2012
93. Avec
Pas de pollution Concision, lisibilité Propre
mardi 25 septembre 2012
94. C’est surtout...
• Lisibilité du code - expressivité
• Simplifie ce qu’on utilise le plus fréquemment :
AJAX, manipulation du DOM...
mardi 25 septembre 2012
95. C’est aussi...
• Nombreux plugins tiers
• Structurer son application en plugins
• Incoutournable !
mardi 25 septembre 2012
99. Mustache
{
Templating JavaScript
Rendu HTML de façon lisible
mardi 25 septembre 2012
100. Mustache
{
A des concurrents (affaire de goûts...)
Avantage: existe aussi en Java !
➔ Même moteur côté client et serveur
mardi 25 septembre 2012
101. Contrôle qualité
automatisé
Build et intégration continue
mardi 25 septembre 2012
102. Je veux être alerté si :
• Test en échec
• Partie sale utilisée
• Erreur de syntaxe
mardi 25 septembre 2012
103. Je veux être alerté si :
• Test en échec Jasmine
• Partie sale utilisée JsLint
• Erreur de syntaxe Google Closure Compiler
mardi 25 septembre 2012
104. Je veux être alerté si :
• Test en échec Jasmine
• Partie sale utilisée JsLint
• Erreur de syntaxe Google Closure Compiler
S’intègrent à Maven, Jenkins, Sonar
mardi 25 septembre 2012
105. Compiler du
JavaScript ?
mardi 25 septembre 2012
106. Compiler du
JavaScript ?
JavaScript est un langage interprété
mardi 25 septembre 2012
107. Compiler du
JavaScript ?
JavaScript est un langage interprété
Apports de la « compilation » :
mardi 25 septembre 2012
108. Compiler du
JavaScript ?
JavaScript est un langage interprété
Apports de la « compilation » :
• Vérification de la syntaxe
mardi 25 septembre 2012
109. Compiler du
JavaScript ?
JavaScript est un langage interprété
Apports de la « compilation » :
• Vérification de la syntaxe
• Code optimisé
mardi 25 septembre 2012
115. Références
Eloquent JavaScript
http://eloquentjavascript.net/contents.html
JavaScript Garden
http://bonsaiden.github.com/JavaScript-Garden/
Learning Advanced JavaScript - J. Resig
http://ejohn.org/apps/learn/
mardi 25 septembre 2012
116. Références
Eloquent JavaScript
http://eloquentjavascript.net/contents.html
JavaScript Garden
http://bonsaiden.github.com/JavaScript-Garden/
Learning Advanced JavaScript - J. Resig
http://ejohn.org/apps/learn/
JavaScript: the Good Parts - D.
Crockford
mardi 25 septembre 2012
117. ROTI
http://www.flickr.com/photos/34943981@N00/202923614/
mardi 25 septembre 2012
