Muddling my way through real time

If your business deals with data on the web, then that data must be handled in real time, otherwise you're doing your user a disservice.

Transcript

1. View Slide

2. http://game.rem.io
   

   View Slide

3. Real time is easy,
   cheap, and expected.
   

   View Slide

4. Fast
   Self-updating
   

   View Slide

5. Instant
   Self-updating
   

   View Slide

6. View Slide

7. function updatePrices() {
   $.get('/prices?stock=MSFT', function (data) {
   renderPrices(data);
   setTimeout(updatePrices, 60 * 1000);
   });
   }
   

   View Slide

8. The server is the ultimate source of truth.
   We want the server to push the prices to
   the client.
   

   View Slide

9. "What is this magic..?" – Remy, 2002
   

   View Slide

10. View Slide

11. The real hurdle is that there's
    two parts to real time:
    client and the server.
    

    View Slide

12. View Slide

13. function main
    initialize()
    while message != quit
    message := get_next_message()
    process_message(message)
    end while
    end function
    

    View Slide

14. http://tick.rem.io
    doc.write('console.log("start of the stream...")');
    var timer = setInterval(function () {
    doc.write('console.log("and more...")');
    }, 2000);
    

    View Slide

15. http://tick.rem.io
    doc.write('console.log("start of the stream...")');
    var timer = setInterval(function () {
    doc.write('console.log("and more...")');
    }, 2000);
    

    View Slide

16. var http = require('http');
    var server = http.createServer(function (req, res) {
    res.writeHead(200, { 'content-type': 'text/html' });
    res.write('console.log("start of the stream...")');
    var timer = setInterval(function () {
    if (res.connection.writable) {
    // keep sending a script with logging
    res.write('console.log("and more...")');
    } else {
    // else connection has closed, and we can't write anymore
    // so clear this interval, and *attempt* to end the response
    clearInterval(timer);
    res.end();
    }
    }, 2000);
    });
    server.listen(8080);
    http://tick.rem.io
    

    View Slide

17. Codified into standards
    1. XHR2
    2. EventSource
    3. WebSockets
    

    View Slide

18. Codified into standards
    1. XHR2
    2. EventSource
    3. WebSockets
    

    View Slide

19. Consider only sending required data upstream.
    

    View Slide

20. View Slide

21. Mobile over SSL or long polling
    Authorisation & sessions
    Scaling client connections: alias CNAME
    Scaling server: HAProxy, node-proxy, nginx +
    forwarding & redis backed lookup table
    Details
    

    View Slide

22. 0314b28f43.example.com
    2c46ac0eab.example.com
    115885a3ea.example.com
    Socket server
    nginx
    catch all for
    example.com
    

    View Slide

23. $ npm install primus
    emit - named events
    metroplex - use redis to lookup servers & spark
    locations
    omega-supreme - allow broadcasting to server or
    sparks
    

    View Slide

24. client
    client
    client
    Server
    Server
    primus.metroplex.servers(function (e, serve
    servers.forEach(function (server) {
    primus.forward(server, {
    emit: [type, data]
    }, noop);
    });
    });
    Redis
    

    View Slide

25. Thanks.
    

    View Slide