mardi 22 décembre 2015

Petit exercice pour bien comprendre la programmation en javascript


Connaitre la syntaxe du javascript est une chose mais en saisir les subtilités (asynchrone, callback, programmation fonctionnelle)  en est une autre.


L'exercice suivant est synthèse de ce qu'il faut comprendre de la programmation asynchrone.

Prenons l'exemple d'une boucle 'for'


for (var a = 0 ;a < 5 ; a++)
 { console.log("valeur de a sync:" , a); }

L'affichage donnera

valeur de a sync: 0
valeur de a sync: 1
valeur de a sync: 2
valeur de a sync: 3
valeur de a sync: 4

Pas de surprise , ici toutes instructions sont synchrones

Si on introduit la notion d'asynchronisme par le biais d'une temporisation:
(avec une délais de 100 ms et 1 ms)

for (var a = 0 ;a < 5 ; a++)
 { setTimeout(function(){ console.log("valeur de a async 100:" , a);}, 100); }

for (var a = 0 ;a < 5 ; a++) { setTimeout(function()
 { console.log("valeur de a async 1:" , a);}, 1); }

Le résultat sera cette fois plus étonnant:
(extrait)
valeur de a async 1: 5
valeur de a async 1: 5
valeur de a async 1: 5
valeur de a async 1: 5
valeur de a async 1: 5
valeur de a async 100: 5
valeur de a async 100: 5
valeur de a async 100: 5
valeur de a async 100: 5
valeur de a async 100: 5

Deux phénomènes:  un normal (a) et un moins intuitif (b).
a) Les lignes relative à la temporisation la plus faible se présentent en premieres alors qu'elles sont les dernières invoquées.
C'est le principe de l'asynchronisme: Le système n'attend pas le retour de l'instruction (appel de fonction)  pour passer à la suivante.

b) La valeur du compteur est bloqué à 5. 
Dans la cause se niche toute la subtilité d'un système asynchrone: l'appel de la fonction  embarquée dans le timer se fera avec le contexte du moment de l'exécution. A la sortie de la boucle 'for' la valeur de 'a' est 5 et donc les 5 appels de fonction déclenchées par le timer se feront avec un même contexte 'a=5'  

Comment obtenir une sortie conforme à nos  attentes : en utilisant les closures (fermetures).
Une closure permet de conserver le contexte au moment de l'appel de la fonction.

exemple ici :

for (var a = 0 ;a < 5 ; a++)  { 
  setTimeout(function(){ 
    var i = a;
    console.log("valeur de a async 100  avec param :" , i);}, 100);    
}

La variable 'a' est bien déclaré au niveau du 'FOR' et appelée dans le corps d'une fonction imbriquée dans la boucle. Mais le résultat n'est pas probant:

valeur de a async 100  avec param : 5
valeur de a async 100  avec param : 5
valeur de a async 100  avec param : 5
valeur de a async 100  avec param : 5
valeur de a async 100  avec param : 5

Pourquoi ? :  Pour 2 raisons :

a) Les 5 closures partagent le même contexte donc il 'est normal d'avoir 5 fois la même valeur.
b) La fonction est littéralement appelée après la boucle 'for' : il est trop tard, le contexte a été perdu.

La solution: appeler la closure dans le 'for' et avec les 5 contextes 
Pour cela le programme est modifié comme ceci:

for (var a = 0 ;a < 5 ; a++)
 { setTimeout(function(a){ 
   console.log("j appelle le constructeur de fonction avec",a);
   return function () { 
                       var i = a;
                        console.log("valeur de a async 1000 avec closure :" , i);}
    }(a), 1000);
 }
En plus de la closure, on ajout un constructeur de fonction.
Dans le 'for' , on passe en paremètre au timer , non pas une fonction à executer mais une fonction qui retourne une fonction à exécuter. C'est le point fort de ce type de langage de considérer les fonctions comme des données (entier, chaine etc) .

Pour que le contexte soit conservé en l'état pour les 5 itération, la fonction de construction est appelée immédiatement par l'utilisation des  doubles parenthèses et d'un paramètre  à la fin de sa définition " }(a), 1000);".

Le résultat est maintenant correct 

j appelle le constructeur de fonction avec 0
j appelle le constructeur de fonction avec 1
j appelle le constructeur de fonction avec 2
j appelle le constructeur de fonction avec 3
j appelle le constructeur de fonction avec 4
valeur de a async 1000  avec closure : 0
valeur de a async 1000  avec closure : 1
valeur de a async 1000  avec closure : 2
valeur de a async 1000  avec closure : 3

valeur de a async 1000  avec closure : 4

Ce mécanisme est couramment utilisé par jquery, c'est la base d'une programmation correcte en javascript.

Pour aller plus loin :  La magie des closures.

dimanche 25 janvier 2015

Vos programmes sont gangrénés par les librairies des autres

Ne pas ré-inventer la roue. Cette formule est érigée en dogme dans l'informatique.
C'est oublier un peu vite que la finalité d'une roue est de tourner... tout simplement... Tourner pour avancer.
On revient de plus en plus à la notion d'artisan développeur, mise en avant par le mouvement devops.

Ce changement repose sur  par 3  idées:

1) Les libraires mettent en danger votre système d'information.
C'est vrai qu'il est dans un premier temps plus simple et moins couteux d'utiliser des librairies et d'assembler des composants externes.
Mais, ces librairies rendent dépendant vos projets de l'évolution de ces portions de code externes.
Dans le monde opensource, une constante mise à niveau est nécessaire sous peine de fragiliser l'ensemble du code. Ce phénomène de course à l'échalote est maitrisé dans les systèmes propriétaires comme les mainframes ou le '.NET'.
L'exemple de la librairie openssl est le plus frappant. Des dispositifs ouverts sur Internet, utilisant cette librairie sont des proies faciles. En clair: une porte blindée ne sert à rien si on laisse la fenêtre de la cuisine ouverte.

2) Les nouvelles infrastructures.
Les plateformes d'accueil sur un cloud, ne permettent pas toujours d'utiliser des librairies externes. Le développeur ne dispose que d'un cadre réduit et ne peut  utiliser qu'un système de dépendance simple. Pour cela , je vous conseille la lecture de la charte des 12 facteurs (principes) à respecter pour écrire une application web prête pour le cloud.
Avec  2 règles fortes:
a) Maitrise des dépendances par l'isolation des librairies.
b) L'application doit ouvrir son port d'écoute (aurevoir apache, tomcat, bonjour node.js)

3) Dilution des connaissances.

A force d'utiliser des librairies toutes faites, les développeurs s'éloignent des fondamentaux.  Tout le monde utilise des librairies XML peu de personnes connaissent vraiment le XML et comment le parser (traduire). La manipulation du JSON est à mettre dans le même pannier. Je ne parlerai pas de la perte de connaissance du SQL due à l'usage hors de propos d'Hibernate.

Les développeurs se retrouvent au centre de la révolution numérique. Car finalement c'est eux qui détiennent la clé des futures applications de demain.
Je vous conseille la lecture du rapport de Tarik Krim (lien ici) qui rend hommage au talent des développeurs français.

En conclusion: pour comprendre la roue, il est bon parfois de la réinventer.
L'exercice s'appelle le ghetto développement, c'est à dire repartir de zéro et faire tout, tout seul.
C'est ce que fait la société spaceX pour construire ses fusées: pas de sous traitant, tout est de fabrication interne. Comme un clin d'oeil aux ingénieurs de la Nasa  et l'equipage d'Apollo XIII obligés de  réparer la capsule avec les moyens du bord.







 
 

samedi 10 janvier 2015

Liens semaine 2-2015

Quoi de neuf cette semaine. ?

  • Vive les développeurs 

Dans la lignée de du rapport de tarik Krim   lien ici, la liste des 100 développeurs français  qui comptent: lien ici.
Le phénomène marque une rupture et remet le développeur au centre de la révolution numérique.

Retour sur les conférences DEVOXX france. série de lien à explorer.
Avec ici la keynote de l'intervention de Tarik Krim.
C'est l'age d'or des développeurs qui commencent.

  • Business intelligence: 

Mathématiques et recommendations (ce que pretique amazon pour pour inciter à commander plus).
Lien ici.
Le projet de tableau de bord grafana (lien ici).


Le big data appliqué au football: lien ici


  • Stratégie IT: 

Les technologies qui vont transformer le travail.


  • Projets.

Flynn : surcouche de docker qui respecte les 12 facteurs applicatifs : 12 règles que doivent respecter les applications modernes.lien flynn ici.

Hood.ie : un projet similaire à meteor.

Remplacer PHP par node.js: lien ici vers un module javascript.

  • Articles.

Outils pour tester la performance d'un site web. lien ici.

samedi 3 janvier 2015

Liens de la semaine 1-2015

A découvrir pour la nouvelle année:
  • Les nouveaux barbares: Ils n'ont pas peur de secouer les institutions
Start-up : ces "barbares" qui veulent débloquer la France, lien ici.


  • Les origines de la balise HTML   : lien ici
  • Langage: La suprématie  du langage 'DART'  de google n'est pas assuré 

Lien ici. A noter la  bonne visibilité du langage coffeescript.








Management:  Un livre : éloge du Carburateur (lien amazon ici) 


  • Projet : API REST  pour postgresql : lien github ici.
  • Langage: mini polémique sur l'industrialisation des tests dans la réalisation d'une nouvelle version de Ruby. lien ici.  (parmi les commentaires,  j'ai bien aimé celui ci: arrêtez vos discussions stériles , je suis passé à Node.js et javascript)