Real time mobile apps with Titanium, Node.ACS and WebSockets


Published on

In this talk, given at First European Conference on Titanium (, we present an overview of the approaches to implement realtime apps over HTTP and introduce the benefit of WebSockets. Later we introduce Node.ACS and Socket.IO to demonstrate how we built a realtime survey system that works on iOS, Android and HTML5 browsers with Titanium.

Published in: Technology
1 Comment
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Real time mobile apps with Titanium, Node.ACS and WebSockets

  1. 1. Real time mobile apps with Titanium,Node.ACS and WebSockets Dr. Antonio Calanducci TiConf 2013, Valencia, February 23rd
  2. 2. OutlineApproaches for real time apps over HTTPHTML 5 WebSockets socket.ioNode.ACS overview MVC FrameworkDEMO (please download ) implement a real time survey system with Node.ACS and Titanium
  3. 3. About meFounder of first Italian Appcelerator Training Partner we run Titanium classes in 8 cities in ItalyTitanium and Apple Certified TrainerResearcher at the National Institute of NuclearPhysicsContact me :; @tcaland / @etnatraining
  4. 4. Problem: Real Time apps over HTTP Build (event-driven) web/mobile apps that communicates with the server Hard to implement with the HTTP protocol: HTTP is half duplex HTTP requires establishing a TCP connection latency, overhead sending a request / getting a response 800b ~ 1.5kb
  5. 5. AJAX pollingclient makes a request every n secondsserver returns immediately a response
  6. 6. COMET (long polling)aka reverse AJAX, AJAX push, HTTP server push client makes a request to server for updates wait at the server (held the connection) returns the response when the server event occurs
  7. 7. Other approchesJava AppletsSilverlight duplexFlash WebSockets requires a proprietary runtime installed not proxy and firewall friendly they use proprietary ports
  8. 8. Entering WebSocketsprovides a bidirectional and full-duplexcommunication channel servers and (web) clientsit works over a single TCP connection shares port with HTTP (80) and HTTPS (443) proxy and routers friendly / cross-origin API stardardized by W3C and IETF protocol (part of HTML5) lightweight (2bytes header per message exchange) only one connection is established (latency low)
  9. 9. WebSocket API
  10. 10. WebSockets browser support
  11. 11. Socket.ioNot all browsers support WebSockets (at least olderones)we could use javascript library that uses behind thescene different transport mechanisms: WebSocket Adobe Flash Socket AJAX long polling/multipart streaming Forever IFrame / JSONP Polling
  12. 12. Node.jsBuild Backends/Web Servers with JavaScriptBased on Google V8Asyncronous I/O non blocking event drivenLightweight and efficientWORKSHOP 2: “An introduction and primer toNode.JS” - by Dave Mackintosh
  13. 13. in Node.JSNode.js provides a moduleClient:
  14. 14. WebSockets/ in Titanium? Contributed open source Modules Both for iOS and Android: 2825?793640832 3158?365421049 support for pure WS events, and now.js
  15. 15. Introducing Node.ACSAppcelerator Node.JS hosting solution Build custom services to extend the existing Appcelerator Cloud Services (ACS) Host your existing node.js app/service on the Appcelerator Cloud Create Node.ACS apps directly from Titanium Studio or from CLIcan interact with ACS (see Javier presentation on ACS)Actually in Developer Preview state
  16. 16. Architecture
  17. 17. Development Flow
  18. 18. Node.ACS MVCExpress 3.x based provides a MVC framework like Sinatra/RubyOnRails you define routes, filters, websockets event handlers that map to controllers it takes care for you all the details of configuring the environment you focus on the app’s features
  19. 19. Node.ACS MVC: config.jsonpath: URL to map; method: [get | post | put | delete ..]callback: <controllers/filename.js>#<function_name>event: name of the event emitted
  20. 20. Node.MVC: controllers example/controllers/users.js/websockets/chat.js
  21. 21. DEMO TIME
  22. 22. Real time SurveyNode.ACS on the server side with socket.ioTitanium on the client side to build: iOS Android HTML5 Mobile App front-end yes, supported there too! Code Walkthrough
  23. 23. References