+ All Categories
Home > Documents > 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

Date post: 04-Apr-2015
Category:
Upload: clement-lefort
View: 103 times
Download: 0 times
Share this document with a friend
Popular Tags:
31
Transcript
Page 1: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.
Page 2: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

2

Javascript dans tous ses états

Bruno Michel Yann Schwartz

AF83 Polom@brmichel @abolibibelot

Page 3: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

3

Au menu

• Contexte

• Javascript serveur & asynchrone : node

• Javascript réactif : Reactive Extensions

• Javascript, the good parts : coffeescript

Page 4: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

4

Contexte

Page 5: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

5

Interlude

Javascript côté serveur

Page 6: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

6

Javascript serveur & asynchrone : node

Page 7: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

7

node.js

Un environnement JavaScript

Côté serveur

Avec un modèle asynchrone

Efficace pour les I/O

Plus simple que le C ;-)

Page 8: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

8

DémoHello World, version web

Page 9: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

9

DémoUn serveur de discussion en ligne

Page 10: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

10

Le modèle asynchrone

Le principe : déléguer à node.jsDès que l'on risque d'attendre

on demande à node.js :Fais ceci dès que tu peuxet quand c'est fait, reviens me voir

Une fonction de callbackAvec error en premier paramètre

• Un UNIQUE thread d’exécution (mais toutes les actions d’I/O sont asynchrones)

Page 11: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

11

Les avantages

• Node.js très efficace pour la concurrenceGère les I/O pour vous

Quasiment aussi rapide qu'un serveur HTTPBeaucoup de connexions en parallèle

• Mais reste simple à écrireSans les problèmes classiques des threads(synchronisation, ressources, etc.)

Page 12: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

12

L'écosystème

Un écosystème qui grandit rapidement

https://github.com/ry/node/wiki/

Quelques modules à connaîtreNPM – Node Package ManagerVows – Tester votre codeExpress – Un framework web légerFugue – Serveur avec plusieurs instances

Page 13: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

13

Javascript réactif : Reactive Extensions

Page 14: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

14

Reactive Extensions for JsSi on parlait de LINQ ?

Page 15: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

15

LINQ ?

• Une approche déclarative

• Evaluation paresseuse

• On enchaîne les opérateurs pour travailler sur un flux de données

• On compose ses traitements

Page 16: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

16

LINQ en une phrase

• Un pattern de manipulation de données, composable, et basé sur le pull.

Page 17: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

17

Revenons à nos moutons

• La programmation Javascript fait grand usage :

• Des événements• De l’asynchrone

• Gérer asynchrone et événements devient vite complexe• On pense encore synchrone et impératif• Gestion des erreurs• Synchronisation et combinaisons

• Et si on avait un « LINQ to events » ?• Mais en Javascript

Page 18: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

18

Reactive Extensions

• LINQ : IEnumerable<T>• Rx : Observable et Observer

• LINQ et Rx : évaluation paresseuse « just in time »

• LINQ et Rx : on compose des opérateurs

Page 19: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

19

Observable et Observer

• Un ObservableUne source à laquelle on s’abonne

• Un Observable n’est pas un événement• Abstraction facilement manipulable et

composable• Plus facile à tester

• Un Observer s’abonne à l’Observable• Consomme• Précise ce qui se passe en cas d’erreur ou de fin

Page 20: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

20

• Les observables permettent de manipuler une chronologie d’événements comme une séquence

• On applique des opérateurs à cette chronologie

• Et on exprime ainsi un workflow

Page 21: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

21

Quelques opérateurs

• « Classiques »Where, Select, Skip, TakeWhile, Zip, Range

• AgrégationsMin, Max, Sum, Aggregate, Scan, GroupBy

• Structures de contrôleIf, Then, While

• Spécifiques RxBufferWith* Amb Join ForkJoin

From*Event, ToAsync, XmlHttpRequest

Page 22: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

22

Exemple

Page 23: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

23

DémoRx Javascript

Page 24: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

24

Javascript, the good parts : coffeescript

Page 25: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

25

Coffeescript

Page 26: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

26

Javascript

• Ce qui est beau• First class functions• Closures• Prototypes et dynamisme• Objets littéraux

Page 27: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

27

The ugly parts

• Les variables globales• La portée• Les points virgule en folie• Les comparaisons• hasOwnProperty…• le mot clé with…• Les bonnes et moins bonnes manières de créer des

objets• Le bruit syntaxique des { ( et ;

Page 28: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

28

Coffeescript

• Et si on gardait les bons côtés…… en oubliant les autres ?

• Fonctions plus simples à écrire• Plus d’accolades• La bonne portée par défaut• Pas de mauvaises surprises sur la comparaison• Création simplifiée des classes• Quelques bonus

Page 29: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

29

Compilation

• Coffeescript se compile en Javascript standard et propre (performances comparables)

• Compilation en ligne de commande ou à la volée

• Compatible avec toutes les bibliothèques Javascript existantes (jquery, Rx, node ….)

Page 30: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

30

Ressources

Reactive ExtensionsHome : msdn.microsoft.com/data/gg577609Série sur RxJs : weblogs.asp.net/podwysocki/

NodeHome : github.com/ry/nodeBinaires windows : node-js.prcn.co.cc

CoffeescriptHome : jashkenas.github.com/coffee-script/Wrapper .NET : github.com/abolibibelot/coffeescript-dotnet

Démosgithub.com/abolibibelot/Techdays2011_Javascript

Page 31: 2 Javascript dans tous ses états Bruno MichelYann Schwartz AF83Polom @brmichel@abolibibelot.

31

MSDN et TechNet : l’essentiel des ressources techniques à portée de clic

http://technet.com http://msdn.com

Portail administration et infrastructure pour informaticiens

Portail de ressources technique pour développeurs


Recommended