Django and the Real-time Web

The modern Web—indeed, the modern user—demands that we write applications that work faster than the traditional request/response cycle. But how relevant is Django in the age of pjax, node.js and WebSockets? I believe Django remains a powerful utility in the new Web, and in this talk I'll share some techniques and tools for reducing the complexity of real-time applications. I'll explain how I manage code duplication when key business logic is split between the client and the server, and demonstrate ways to preserve a RESTful and accessible design whilst providing a more responsive experience to clients who support it.

Transcript

1. Django and the Real-Time Web Zachary Voase DjangoCon Europe 2012 
2. WWW: A Changelog IE Chrome 0% 35.0% 70.0% Jul 2008 Apr 2009 Jan 2010 Oct 2010 Jul 2011 Apr 2012 gs.statcounter.com WebSocket Backbone #NewTwitter Google Instant Basecamp Next NodeJS pjax Google Wave Facebook socket.io Chrome Nitro JägerMonkey Trello
3. “Now, here, you see, it takes all the running you can do, to keep in the same place. If you want to get somewhere else, you must run at least twice as fast as that!”
4. • UI before technology • Proactive, not reactive • Synchronized with the ‘real world’ What I Talk About When I Talk About Real-Time
5. Three Stories
6. MVC
7. MVC • Trygve Reenskaug et al. @ PARC, ’78/79 • Originally a part of Smalltalk-80 • Now the dominant UI design pattern
8. MVC Controller View Model
9. Multi-MVC C V M C V M C V M
10. MVC • Start application • Within event loop: • Receive user and network events • Dispatch to controller • Read/write to models • Render views to display • Shut down application
11. MVC on the Web Controller View Model Server Browser
12. MVC on the Web • Listen for requests: • Load session state for this user: • Process forms & user input • Read/write to/from database • Render views (HTML, XML, JSON) • Return response • Persist session state, clean up objects
13. REST
14. REST • REpresentational State Transfer • Roy T. Fielding, 2000 (§5) • Descriptive, not prescriptive
15. REST / /login /about-us /home Invalid Valid Click Click
16. REST • Client-server • Stateless • Cacheable • Layered • Code-on-demand (optional) • Uniform
17. WebSocket(s) • Real TCP connection • ‘Magic’ HTTP request to port 80 • Reduces latency • Enables real-time push
18. REST & WebSockets • Full-duplex communication: client-server • Long-running connections: stateless • Direct TCP connection: layered, cacheable • Ad hoc protocols over WS: uniform
19. FYI: #! belongs in 1 place:
20. #!/bin/sh
21. Version Control
22. Centralised VCS Server Alice Bob
23. Distributed VCS Carol Alice Bob
24. Synthesis
25. Controller View Model Server Browser
26. Controller Alice Model Bob Carol Server
27. C V M C V M C V M Server Bob Alice
28. IMAP SMTP
29. IMAP SMTP
30. C V M C V M C V M Server Bob Alice PUT /polls/123 PUT /polls/123
31. C V M C V M C V M Server Bob Alice PUT /polls/123 PUT /polls/123
32. C V M C V M C V M Server Bob Alice PUT /polls/123 PUT /polls/123
33. { "method": "PUT", "resource": "/polls/123", "content": { "name": "Favourite Beer", "created": "2012-06-04T10:50:00" } }
34. • Read RFC 2616 • Seriously. • Etags • Cache-Control Caching
35. Conflict Resolution
36. (uri, etag, dirty?) Conflict Resolution
37. Conflict Resolution if not uri: CREATE elif is_dirty: # I've made local changes if local_etag == remote_etag: OK else: CONFLICT else: if local_etag == remote_etag: NOOP else: REDOWNLOAD
38. Implications • Assumption of orthogonality • Lossless representations • Authn & authz • Pub/sub • Resource-oriented client
39. Pub/sub • AMQP • ØMQ • Django signals
40. Barriers • Django ORM • Content negotiation • JavaScript • Proxies & middleware
41. Questions? @zacharyvoase