End-to-end HTML5 APIs - The Geek Gathering 2013

REST seven’s rule was “Code on Demand,” meaning the ability for the server to deliver code able to run on the client, and the recommended language was JavaScript. Some, to use the same code everywhere, tried to do it with Java, or .NET (ActiveX). None of them had long life success in browsers. HTML5 and offline support contributed in the creation of a bunch of APIs which only made sense on server-side in first place: File/FileSystem, Workers, Sockets, Storage/Session, Blob, ImageData. Almost all those APIs, including the not that young XMLHttpRequest, have been designed to be usable via either synchronous or asynchronous APIs. We have today the opportunity to write code really able to either on the server and on the client and then have consistent behaviors and security rules. We can expect interoperable code/libraries/modules, save a lot of developing and debugging time, get more people involved in code we need. Discover already existing opportunities, see some of them working, and envision what the future can come with.
of 41
All materials on our website are shared by users. If you have any questions about copyright issues, please report us to resolve them. We are always happy to assist you.
Related Documents
  • 1. End-to-end HTML5 APIs Alexandre Morgaut Osijek, Croatia October 12th, 2013
  • 2. Presentation W3C AC member Web Architect JS Expert REST Lover NoSQL Fanboy W3C “jseverywhere“ community group @amorgaut
  • 3. Agenda The Web & JavaScript Web standards Server-Side JavaScript HTML5 Remote Debugging Present & Future
  • 4. The Web & JavaScript
  • 5. The Web WWW: WorldWideWeb (Hypertext Project) UDI: Uniform Document Identifier ➡ URL: Uniform Resource Locator HTML: Hypertext Markup Language HTTP: Hypertext Transfer Protocol designed in 1989 by Tim Berners-Lee at the CERN 1st website on Christmas 1990 created on NeXT
  • 6. REST Representational State Transfer 1. Null 2. Client-Server 3. Stateless 4. Cache 5. Uniform Interface 6. Layered System 7. Code on Demand: JavaScript defined in 2000 by Roy Thomas Fielding in its dissertation “Architectural Styles and the Design of Network-based Software Architectures”
  • 7. Web Standards
  • 8. W3C Created at the MIT in 1994 ➡ Led by Tim Berners-Lee and Dr. Jeffrey Jaffe Joint agreement among three "Host Institutions" ➡ MIT - ERCIM - Keio University Working Groups ➡ HTML, MathML, RDF, SVG, CSS, Audio, Device...
  • 9. ECMA European Computer Manufacturers Association Standards: CD-ROM, ECMAScript, C#, Office Open XML File Formats JavaScript ECMA-262: ECMAScript (see also ISO/IEC 16262) ➡ ➡ TC39-TG1 managed by Mr. J. Neumann Test262 ECMA-357: E4X: ECMAScript for XML ECMA-402: ECMAScript Internationalization API ECMA-404: The JSON Data Interchange Format (was RFC 4627)
  • 10. CommonJS created in 2009 by Kevin Dangoor as ServerJS on Mozilla Wiki ➡ standards for JavaScript on the server ➡ Narwhal, Helma NG, v8CGI, GPSEE, chiron, Persevere, flusspferd Renamed CommonJS ➡ command line tools, desktop, addon, or browser implementations ➡ joined by CouchDB, Wakanda, Sproutcore, node.js, RequireJS... Modules, Packages, and Promises Binary, FileSystem, System, I/O stream, Socket I/O Browser like APIs: worker, console, HTTP client
  • 11. W3C on Server-Side ? Really?
  • 12. DOM Java JavaScript .NET PHP python ..;
  • 13. But also XSL-FO SOAP XSLT WSDL XPath SVG XQuery RDF XML Schema SPARQL
  • 14. Server-Side JavaScript
  • 15. Engines SpiderMonkey 3 JIT Compilers: TraceMonkey, JägerMonkey, IonMonkey webkit JavaScriptCore: JSC SquirrelFish Extreme: SFX aka Nitro (JIT Compiler inside) V8 Rhino JIT Compiler: CrankShaft Tamarin Carakan Interpreted or Compiled execution JIT Compiler: NanoJIT -> ActionScript / “ECMAScript 4” Trident: MSHTML / Chakra -> Classic JScript, Managed JScript, & JScript.NET Linear A, Linear B, Futhark
  • 16. Standards • ECMAScript • CommonJS More than 60 SSJS implementations
  • 17. Servers SpiderMonkey: GPSee, APE Rhino: RingoJS, Persevere, AppJet, Glassfish JavaScriptCore: wakanda Trident / Chakra: IronJS, .NET V8: node.js, SilkJS, TeaJS, Akshell
  • 18. NoSQL Databases SpiderMonkey: riak, CouchDB Rhino: OrientDB JavaScriptCore: WakandaDB V8: ArangoDB, MongoDB, CouchBase
  • 19. Web Application “1.0”
  • 20. HTML5 APIs XMLHttpRequest 2 Web Cryptography Blob ImageData File / FileSystem Typed Arrays Web SQL Storage Quota Web Storage System Information Web Workers URL Web Sockets WebCL
  • 21. WebCL “This section proposes mechanisms for transferring pixel data between WebCL memory objects and HTML media elements. Server-side or Web Worker based implementations of WebCL will not be required to support these features.”
  • 22. Web SQL “This document was on the W3C Recommendation track but specification work has stopped.The specification reached an impasse: all interested implementors have used the same SQL backend (Sqlite), but we need multiple independent implementations to proceed along a standardisation path.”
  • 23. Async “and” Sync XMLHttpRequest(method, url, async) FileReaderSync() requestFileSystemSync() openDatabaseSync() localStorage.getItem()
  • 24. IndexedDB “The synchronous database API methods provide a blocking access pattern to IndexedDB databases. Since they block the calling thread they are only available from workers.”
  • 25. Web Workers Dedicated or Shared No Window, No Document WorkerGlobal, WorkerUtils, WorkerNavigator, WorkerLocation postMessage(), onmessage(), onerror() importScripts()
  • 26. Concept Server JS contexts == JS Workers ➡ multi-threaded Dedicated Workers ➡ Shared Worker EventLoop
  • 27. Remote Debugging
  • 28. Protocols Firebug Crossfire Crossfire for Internet Explorer V8 Debugger Protocol Opera Scope Protocol Webkit “Remote Debugging Protocol 1.0” Mozilla Debugging Protocol
  • 29. Purpose Original ➡ Debug JS code running in mobiles Implicit ➡ Debug JS code running on servers
  • 30. Concept Server JS contexts === Remote JS Workers
  • 31. Present & Future
  • 32. caniuse “SS-HTML5” node.js wakanda RingoJS SilkJS Timers YES YES Base64 module module module XHR module module YES ? YES Blob YES ? ? Storage YES* ? ? Workers module YES** YES ? Sockets module WAK7 ? ? YES ? ? ? ? FileSystem SSE module DOM module SQL module WebCL module module APE YES
  • 33. RingoJS HTML5 ➡ Web Worker CommonJS ➡ Modules ➡ System, fs, binary, IO, Unit Test Other ➡ console
  • 34. node.js HTML5 via modules ➡ XMLHttpRequest (node-xmlhttprequest) ➡ Web Sockets (node-websocket-client) ➡ DOM (jsdom), ➡ IndexedDB (perstore), Web SQL (node-sqlite) CommonJS ➡ Modules*, Packages Other: console*
  • 35. Wakanda HTML5 ➡ XMLHttpRequest, WindowTimer, ➡ Web Storages* ➡ Web Workers** ➡ File, FileSystem, Blob, ... CommonJS ➡ Modules, Packages, System, Unit Test Other: console
  • 36. Wakanda * Web Storages ➡ sessionStorage, “”, “” ➡ lock(), tryLock(), unlock() ➡ no localStorage but easy to polyfil ➡ “storage” event planned ** Web Workers ➡ Worker, SharedWorker, “SystemWorker”
  • 37. Wakanda Server-side JS context ➡ CommonJS (, require, ...) ➡ Worker (importScripts, WindowTimer, ...)
  • 38. CommonNode HTML5 via modules ➡ ➡ ➡ ➡ XMLHttpRequest (node-xmlhttprequest) Web Sockets (node-websocket-client) DOM (jsdom) IndexedDB (perstore), Web SQL (node-sqlite) CommonJS ➡ Modules, Packages ➡ System, fs, binary, IO, Unit Test Other: console
  • 39. Summary ECMAScript is already everywhere Modules ➡ CommonJS already standard ➡ AMD (Asynchronous Module Definition) ➡ ECMAScript 6 Many W3C APIs already applicable server-side Same APIs means ➡ better learning curve ➡ more shared libraries / modules ➡ DRY -> shared Model work Offline
  • 40. Client and Server JavaScript APIs W3C Community Group Let’s start!
  • 41. Q&A Wakanda @wakandasoft San Francisco, CA - Oct. 25th @jseverywhere Client and Server JavaScript APIs Community Group
  • Search
    Related Search
    We Need Your Support
    Thank you for visiting our website and your interest in our free products and services. We are nonprofit website to share and download documents. To the running of this website, we need your help to support us.

    Thanks to everyone for your continued support.

    No, Thanks