ETAT DE L’ART:
                     SERVER-SIDE JAVASCRIPT




                              2012-01-16

mercredi 18 janvier 2012
PRESENTATION
                                      Alexandre Morgaut
                                  Web Architect / Community Manager
                                             Initiateur de @NantesJS



                                             @amorgaut




mercredi 18 janvier 2012
HISTOIRE

mercredi 18 janvier 2012
NAISSANCE
                                         Brendan Eich
   •   1995                               JavaScript creator
       Mocha > LiveScript > JavaScript

   •   1996
       Microsoft JScript (IE4)
       NetScape Enterprise Server 2
       aka LiveWire/iPlanet

   •   1997
       ECMAScript 1
       “DHTML”
       Windows IIS 3




mercredi 18 janvier 2012
MATURITÉ
     •   1998 - HTML/XML DOM, Sun/Mozilla Rhino
     •   1999 - ECMAScript 3, XMLHttpRequest, HTML 4
     •   2000 - ActionScript, Helma Hop
     •   2001 - JSON, Apple JavaScript OSA
     •   2002 - JSLint, Mozilla “Phoenix” > Firefox
     •   2003 - JavaScript Adobe Press, JScript .NET
     •   2004 - E4X , “Web 2.0”, JSDB
     •   2005 - Prototype.js, “Ajax”
     •   2006 - Firebug, jQuery, “Comet”, APE, “HTML5”
     •   2007 - SitePoint Persevere, Rhino on Rails


mercredi 18 janvier 2012
SSJS: LE RETOUR
          •    2008
               Aptana Jaxer
               CouchDB
               Acid Test 3

          •    2009
               Narwhal & Jack
               ServerJS > CommonJS
               Node.js
               v8cgi, GPSEE
               ECMAScript 5

          •    2010
               Helma NG > RingoJS
               Sun Phobos

          •    2011
               Wakanda
               CoffeeScript
               ECMAScript 5.1

mercredi 18 janvier 2012
+ DE 60 SOLUTIONS EXISTANTES




                           http://en.wikipedia.org/wiki/Comparison_of_server-side_JavaScript_solutions


mercredi 18 janvier 2012
ÉCOSYSTÈME

mercredi 18 janvier 2012
COMMUNAUTÉ

    • Nombreux                 Groupes d’utilisateurs

    • Nombreuses                 Conférences

    • Nombreux                 Blogs et livres

    • Large                documentation

    • Langage   aussi utilisé par les
        développeurs venant d’autres
        technologies

mercredi 18 janvier 2012
LIBRAIRIES & FRAMEWORKS

    • JavaScript  est le language le
        plus populaire sur GitHub

    • Nombreuses            librairies

    • Nombreux             framework



     https://github.com/languages/JavaScript
     http://javascriptlibraries.com/
mercredi 18 janvier 2012
ENVIRONNEMENT DE
                             DEVELOPEMENT
    • Visual               Studio
    • XCode
    • Eclipse
    • NetBeans




                           • Wakanda   Studio
                           • Cloud9


mercredi 18 janvier 2012
DÉBOGUEURS
   Client-side
          • Firebug          *

          • Web            Inspector *
          • Dragonfly


   Server-Side
          • Wakanda              Debugger *
          • Cloud9           Debugger *
        * via standard protocols, some debugger can debug JS code running anywhere (server, desktop, mobile, ...)

mercredi 18 janvier 2012
AUTRES OUTILS ET
                                 STANDARDS
    • JSLint               / JSHint / JavaScriptLint
    • JSON                 / JSON-Schema / JSON-RPC
    • JSDoc
    • HTTP                 Fox / JSON View
    • JSMin                / Packer / Closure / YUI Compressor / Dojo Shrinksafe
    • YUI Test                / QUnit / Jasmine
    • NPM



mercredi 18 janvier 2012
ENGINES

mercredi 18 janvier 2012
ECMASCRIPT 5 & NEXT


           • ES5.1                           • ES.Next

                 • Mode    strict             • Typed Array

                 • Object   freeze            • Modules

                 • Read    only properties    • Destructuring

                 • Getter   / setter          • String   templates



mercredi 18 janvier 2012
C+
                                                  C                                                                                                        +
      SpiderMonkey                                                           webkit JavaScriptCore: JSC
                      3 JIT Compilers:                                                 SquirrelFish Extreme: SFX aka Nitro
                       TraceMonkey,                                                              (JIT Compiler inside)
                       JägerMonkey,
                         IonMonkey




                                           Jav                                                                               C+
                                              a                                                                                +
                      Rhino                                                                                        V8
         Interpreted or Compiled execution                                                                 JIT Compiler: CrankShaft




 Nashorn?                                                                                             C+
                                                                                                        +
                                                      Trident: MSHTML
                                                           Chakra
                                                      -> Classic JScript, Managed JScript, & JScript.NET


                                        C+                                                                                                 C+
                                          +                                                                                                  +
                      Tamarin                                                                                             Carakan
                 JIT Compiler: NanoJIT
               -> ActionScript / “ECMAScript 4”
                                                                                                               Previously: Linear A, Linear B, Futhark



mercredi 18 janvier 2012
CLIENT-SIDE

          SpiderMonkey                          JavaScriptCore



                           Rhino                      V8



                 Tamarin           Trident / Chakra   Carakan / Futhark



mercredi 18 janvier 2012
SERVER-SIDE

        SpiderMonkey                       JavaScriptCore




                     Rhino                      V8



                             Trident / Chakra


mercredi 18 janvier 2012
JAVASCRIPT EVERYWHERE




mercredi 18 janvier 2012
BENCHMARKS



                            and what they worth....

mercredi 18 janvier 2012
BROWSERS WAR II
                                                 (MAY 2009)




       http://www.maximumpc.com/article/features/browser_brouhaha_your_maximum_guide_browsers_today_and_tomorrow?page=0,6

mercredi 18 janvier 2012
PERSEVERE & JAVASCRIPTDB
                                                       (APRIL 2009)




                       http://www.sitepen.com/blog/2009/04/20/javascriptdb-perseveres-new-high-performance-storage-engine/

mercredi 18 janvier 2012
NODE VS THIN VS NARWHAL
                           (SEPTEMBER 2009)

                                                      300 concurrent clients

                                                      completed requests:
                                                      thin 36045
                                                      node 35668
                                                      narwhal 2921

                                                      > summary(node300$ttime)
                                                         Min. 1st Qu. Median      Mean 3rd Qu.    Max.
                                                         12.0    66.0   112.0    239.4   157.0 12200.0

                                                      > summary(thin300$ttime)
                                                         Min. 1st Qu. Median      Mean 3rd Qu.    Max.
                                                         71.0    84.0    87.0    208.7   107.0 23950.0

                                                      > summary(narwhal300$ttime)
                                                         Min. 1st Qu. Median      Mean 3rd Qu.    Max.
                                                          928    2837    2935     2921    3018    8759




                             http://four.livejournal.com/1019177.html


mercredi 18 janvier 2012
RINGOJS VS NODEJS
                              (SEPTEMBER 2010)




                              http://hns.github.com/2010/09/21/benchmark.html

mercredi 18 janvier 2012
SPIDERMONKEY


                                                                                        1.5 is ~ Firefox 2.0 (and ES-3)
                                                                                        1.7 is ~ Firefox 3.0
                                                                                        1.8 is ~ Firefox 3.6
                                                                                        1.8.5 + JITs is ~ Firefox 4




                           http://www.page.ca/~wes/SpiderMonkey/Perf/sunspider_history.png
mercredi 18 janvier 2012
SUNSPIDER 0.9.1
                                                    (AUGUST 2011)

                              7
                              8
                              6
                              5
                              4
                              3
                              2
                              1
                      http://expansive-derivation.ossreleasefeed.com/2011/08/javascript-performance-test-results-with-sunspider/


mercredi 18 janvier 2012
MAIN CONCEPTS

mercredi 18 janvier 2012
COMMON JAVASCRIPT
           •    Working Groups:
                -     CommonJS
                -     WHATWG
                -     W3C
                -     ECMA TC39

           •    L’ubiquité au delà d’ECMAScript

           •    la spécification HTML5 se faisait aussi appeler:
                “Web Applications 1.0”
                http://www.whatwg.org/specs/web-apps/current-work/


           •    Asynchronous & Synchronous APIs


mercredi 18 janvier 2012
INTEGRATION-ORIENTED
                 •   Java environment
                      - using Rhino like with
                         - Helma, Persevere, Narwhal, RingoJS, Sun Phobos...



                 •   .Net environment
                      - using JScript.NET like with
                         - IronJS, Node.NET


                 •   Other environments
                      - C (GPSEE), PHP (J2PA), Ruby (Johnson), Perl (JE), …
mercredi 18 janvier 2012
ASYNC. EVENT-BASED
                                               Node.js like



           • Browser            Event-Loop on the Server

           • An            Event Loop in one single thread

           • Cooperative            («one at a time») with async. callbacks

           • Node.js           (V8), SpiderNode, RhiNodeII, Node.NET



mercredi 18 janvier 2012
SINGLE & MULTI THREADING
                                              One context per thread


         SINGLE                                                  MULTI
          •    Low memory usage                                  •   Vertical scalability (multi-core)
          •    Potentially handle lot of requests                •   Thread-safety for concurrent access
          •    Cooperative                                       •   Preemptive: Parallel code execution
          •    Shared context                                    •   Allow Synchronous APIs
          •    Use mostly one core*                              •   Uses easily all available cores


                Notes:
                - an event loop can generate some other threads which could use other cores
                - multi-thread architectures can run event loops in some of their threads
mercredi 18 janvier 2012
DATABASE-DRIVEN
                 •   Document Store
                      -    CouchDB, MongoDB

                 •   Key/value Store
                      -    Riak

                 •   Object Store
                      -    Wakanda

                 •   Push Store
                      -    APE

mercredi 18 janvier 2012
APIS - PACKAGES

mercredi 18 janvier 2012
COMMONJS

                     • Modules         • Packages                   • Promises



             •   System                 •   Binary                        •   JSGI

             •   Unit-Testing           •   File                          •   Stream




                                 http://wiki.commonjs.org/wiki/CommonJS
mercredi 18 janvier 2012
NODE
                                    ASYNC APIS

                     •     Buffer       •   Net                           •   Streams

                     •     Events       •   OS                            •   Timers

                     •     File         •   Process                       •   ...




                                     http://nodejs.org/docs/v0.5.5/api/

mercredi 18 janvier 2012
W3C / HTML5 / ES.NEXT
                     & OTHER STANDARDS
               •   Console             •   Structured clones

               •   Blob, Blob URL*     •   Typed Arrays*

               •   DataView*           •   Web Sockets

               •   File / FileSystem   •   Web Storage, Indexed DB

               •   Modules*            •   Web Workers

               •   Progress Events     •   XHR 2



mercredi 18 janvier 2012
PACKAGES & MODULES

        • github: CommonJS            modules in projects (Persevere, Narwhal, RingoJS, ...)

        • NPM: Node           Package Manager (thousands packages)

        • CPM: CommonJS            Package Manager (new)

        • PINF: Universal        module loader




mercredi 18 janvier 2012
CREDITS

                           Thanks for their contributions to

                                   Wesley Garland

                                     Ondrej Zara




mercredi 18 janvier 2012
Full-JS - 5 Trophées
    1. Interopérabilité: Interconnexion de systèmes
         hétérogènes,interopérabilité entre applications.
         Mise en œuvre, utilisation de connecteurs et/ou
         de standards ouverts (Open Data, CommonJS,
         W3C…).

    2. Innovation:  toute application présentant une
         innovation dans son usage, dans sa mise en
         œuvre, par son originalité…  Les thèmes de
         l’accessibilité et du développement durable sont
         les bienvenus.

    3. JS Embarqué: Toute application embarquée
         hors navigateur et qui soit à usage industriel,
         scientifique, médical… (internet des objets,
         NFC…).

    4. Application Desktop: Applications desktop
         end to end JavaScript (Chrome OS, Windows 8
         Metro, Mozilla WebRT…)

    5. Environnement de développement:
         Outils de développement / Traçabilité /
         Robustesse / Scalabilité…
                                                            full-js.org   @fulljs
mercredi 18 janvier 2012

Etat de l'art Server-Side JavaScript - JS Geneve

  • 1.
    ETAT DE L’ART: SERVER-SIDE JAVASCRIPT 2012-01-16 mercredi 18 janvier 2012
  • 2.
    PRESENTATION Alexandre Morgaut Web Architect / Community Manager Initiateur de @NantesJS @amorgaut mercredi 18 janvier 2012
  • 3.
  • 4.
    NAISSANCE Brendan Eich • 1995 JavaScript creator Mocha > LiveScript > JavaScript • 1996 Microsoft JScript (IE4) NetScape Enterprise Server 2 aka LiveWire/iPlanet • 1997 ECMAScript 1 “DHTML” Windows IIS 3 mercredi 18 janvier 2012
  • 5.
    MATURITÉ • 1998 - HTML/XML DOM, Sun/Mozilla Rhino • 1999 - ECMAScript 3, XMLHttpRequest, HTML 4 • 2000 - ActionScript, Helma Hop • 2001 - JSON, Apple JavaScript OSA • 2002 - JSLint, Mozilla “Phoenix” > Firefox • 2003 - JavaScript Adobe Press, JScript .NET • 2004 - E4X , “Web 2.0”, JSDB • 2005 - Prototype.js, “Ajax” • 2006 - Firebug, jQuery, “Comet”, APE, “HTML5” • 2007 - SitePoint Persevere, Rhino on Rails mercredi 18 janvier 2012
  • 6.
    SSJS: LE RETOUR • 2008 Aptana Jaxer CouchDB Acid Test 3 • 2009 Narwhal & Jack ServerJS > CommonJS Node.js v8cgi, GPSEE ECMAScript 5 • 2010 Helma NG > RingoJS Sun Phobos • 2011 Wakanda CoffeeScript ECMAScript 5.1 mercredi 18 janvier 2012
  • 7.
    + DE 60SOLUTIONS EXISTANTES http://en.wikipedia.org/wiki/Comparison_of_server-side_JavaScript_solutions mercredi 18 janvier 2012
  • 8.
  • 9.
    COMMUNAUTÉ • Nombreux Groupes d’utilisateurs • Nombreuses Conférences • Nombreux Blogs et livres • Large documentation • Langage aussi utilisé par les développeurs venant d’autres technologies mercredi 18 janvier 2012
  • 10.
    LIBRAIRIES & FRAMEWORKS • JavaScript est le language le plus populaire sur GitHub • Nombreuses librairies • Nombreux framework https://github.com/languages/JavaScript http://javascriptlibraries.com/ mercredi 18 janvier 2012
  • 11.
    ENVIRONNEMENT DE DEVELOPEMENT • Visual Studio • XCode • Eclipse • NetBeans • Wakanda Studio • Cloud9 mercredi 18 janvier 2012
  • 12.
    DÉBOGUEURS Client-side • Firebug * • Web Inspector * • Dragonfly Server-Side • Wakanda Debugger * • Cloud9 Debugger * * via standard protocols, some debugger can debug JS code running anywhere (server, desktop, mobile, ...) mercredi 18 janvier 2012
  • 13.
    AUTRES OUTILS ET STANDARDS • JSLint / JSHint / JavaScriptLint • JSON / JSON-Schema / JSON-RPC • JSDoc • HTTP Fox / JSON View • JSMin / Packer / Closure / YUI Compressor / Dojo Shrinksafe • YUI Test / QUnit / Jasmine • NPM mercredi 18 janvier 2012
  • 14.
  • 15.
    ECMASCRIPT 5 &NEXT • ES5.1 • ES.Next • Mode strict • Typed Array • Object freeze • Modules • Read only properties • Destructuring • Getter / setter • String templates mercredi 18 janvier 2012
  • 16.
    C+ C + SpiderMonkey webkit JavaScriptCore: JSC 3 JIT Compilers: SquirrelFish Extreme: SFX aka Nitro TraceMonkey, (JIT Compiler inside) JägerMonkey, IonMonkey Jav C+ a + Rhino V8 Interpreted or Compiled execution JIT Compiler: CrankShaft Nashorn? C+ + Trident: MSHTML Chakra -> Classic JScript, Managed JScript, & JScript.NET C+ C+ + + Tamarin Carakan JIT Compiler: NanoJIT -> ActionScript / “ECMAScript 4” Previously: Linear A, Linear B, Futhark mercredi 18 janvier 2012
  • 17.
    CLIENT-SIDE SpiderMonkey JavaScriptCore Rhino V8 Tamarin Trident / Chakra Carakan / Futhark mercredi 18 janvier 2012
  • 18.
    SERVER-SIDE SpiderMonkey JavaScriptCore Rhino V8 Trident / Chakra mercredi 18 janvier 2012
  • 19.
  • 20.
    BENCHMARKS and what they worth.... mercredi 18 janvier 2012
  • 21.
    BROWSERS WAR II (MAY 2009) http://www.maximumpc.com/article/features/browser_brouhaha_your_maximum_guide_browsers_today_and_tomorrow?page=0,6 mercredi 18 janvier 2012
  • 22.
    PERSEVERE & JAVASCRIPTDB (APRIL 2009) http://www.sitepen.com/blog/2009/04/20/javascriptdb-perseveres-new-high-performance-storage-engine/ mercredi 18 janvier 2012
  • 23.
    NODE VS THINVS NARWHAL (SEPTEMBER 2009) 300 concurrent clients completed requests: thin 36045 node 35668 narwhal 2921 > summary(node300$ttime) Min. 1st Qu. Median Mean 3rd Qu. Max. 12.0 66.0 112.0 239.4 157.0 12200.0 > summary(thin300$ttime) Min. 1st Qu. Median Mean 3rd Qu. Max. 71.0 84.0 87.0 208.7 107.0 23950.0 > summary(narwhal300$ttime) Min. 1st Qu. Median Mean 3rd Qu. Max. 928 2837 2935 2921 3018 8759 http://four.livejournal.com/1019177.html mercredi 18 janvier 2012
  • 24.
    RINGOJS VS NODEJS (SEPTEMBER 2010) http://hns.github.com/2010/09/21/benchmark.html mercredi 18 janvier 2012
  • 25.
    SPIDERMONKEY 1.5 is ~ Firefox 2.0 (and ES-3) 1.7 is ~ Firefox 3.0 1.8 is ~ Firefox 3.6 1.8.5 + JITs is ~ Firefox 4 http://www.page.ca/~wes/SpiderMonkey/Perf/sunspider_history.png mercredi 18 janvier 2012
  • 26.
    SUNSPIDER 0.9.1 (AUGUST 2011) 7 8 6 5 4 3 2 1 http://expansive-derivation.ossreleasefeed.com/2011/08/javascript-performance-test-results-with-sunspider/ mercredi 18 janvier 2012
  • 27.
  • 28.
    COMMON JAVASCRIPT • Working Groups: - CommonJS - WHATWG - W3C - ECMA TC39 • L’ubiquité au delà d’ECMAScript • la spécification HTML5 se faisait aussi appeler: “Web Applications 1.0” http://www.whatwg.org/specs/web-apps/current-work/ • Asynchronous & Synchronous APIs mercredi 18 janvier 2012
  • 29.
    INTEGRATION-ORIENTED • Java environment - using Rhino like with - Helma, Persevere, Narwhal, RingoJS, Sun Phobos... • .Net environment - using JScript.NET like with - IronJS, Node.NET • Other environments - C (GPSEE), PHP (J2PA), Ruby (Johnson), Perl (JE), … mercredi 18 janvier 2012
  • 30.
    ASYNC. EVENT-BASED Node.js like • Browser Event-Loop on the Server • An Event Loop in one single thread • Cooperative («one at a time») with async. callbacks • Node.js (V8), SpiderNode, RhiNodeII, Node.NET mercredi 18 janvier 2012
  • 31.
    SINGLE & MULTITHREADING One context per thread SINGLE MULTI • Low memory usage • Vertical scalability (multi-core) • Potentially handle lot of requests • Thread-safety for concurrent access • Cooperative • Preemptive: Parallel code execution • Shared context • Allow Synchronous APIs • Use mostly one core* • Uses easily all available cores Notes: - an event loop can generate some other threads which could use other cores - multi-thread architectures can run event loops in some of their threads mercredi 18 janvier 2012
  • 32.
    DATABASE-DRIVEN • Document Store - CouchDB, MongoDB • Key/value Store - Riak • Object Store - Wakanda • Push Store - APE mercredi 18 janvier 2012
  • 33.
    APIS - PACKAGES mercredi18 janvier 2012
  • 34.
    COMMONJS • Modules • Packages • Promises • System • Binary • JSGI • Unit-Testing • File • Stream http://wiki.commonjs.org/wiki/CommonJS mercredi 18 janvier 2012
  • 35.
    NODE ASYNC APIS • Buffer • Net • Streams • Events • OS • Timers • File • Process • ... http://nodejs.org/docs/v0.5.5/api/ mercredi 18 janvier 2012
  • 36.
    W3C / HTML5/ ES.NEXT & OTHER STANDARDS • Console • Structured clones • Blob, Blob URL* • Typed Arrays* • DataView* • Web Sockets • File / FileSystem • Web Storage, Indexed DB • Modules* • Web Workers • Progress Events • XHR 2 mercredi 18 janvier 2012
  • 37.
    PACKAGES & MODULES • github: CommonJS modules in projects (Persevere, Narwhal, RingoJS, ...) • NPM: Node Package Manager (thousands packages) • CPM: CommonJS Package Manager (new) • PINF: Universal module loader mercredi 18 janvier 2012
  • 38.
    CREDITS Thanks for their contributions to Wesley Garland Ondrej Zara mercredi 18 janvier 2012
  • 39.
    Full-JS - 5Trophées 1. Interopérabilité: Interconnexion de systèmes hétérogènes,interopérabilité entre applications. Mise en œuvre, utilisation de connecteurs et/ou de standards ouverts (Open Data, CommonJS, W3C…). 2. Innovation:  toute application présentant une innovation dans son usage, dans sa mise en œuvre, par son originalité…  Les thèmes de l’accessibilité et du développement durable sont les bienvenus. 3. JS Embarqué: Toute application embarquée hors navigateur et qui soit à usage industriel, scientifique, médical… (internet des objets, NFC…). 4. Application Desktop: Applications desktop end to end JavaScript (Chrome OS, Windows 8 Metro, Mozilla WebRT…) 5. Environnement de développement: Outils de développement / Traçabilité / Robustesse / Scalabilité… full-js.org @fulljs mercredi 18 janvier 2012