Real Time Applications for The Real World

(RTA FTWeb)

alejandroelinformatico.com/slideshows/en/real-time-applications

Alejandro El Informático(@ainformatico). 2014.

Licencia Creative Commons by-nc-sa.

About me

Alejandro El Informático, Web developer

How we code at Xing Barcelona

What is this about?

why Real Time?

Improve UX

Native apps to the Web

Real-time data

It's all about collaboration

Others

  • Voip
  • IM
  • Gamming
  • Radars
  • GPS
  • Telephone
  • etc...

Make the slides for Real(Time)

Real Time in Computer Science

In computer science, real-time computing (RTC), or reactive computing, is the study of hardware and software systems that are subject to a "real-time constraint"

Also

A system is said to be real-time if the total correctness of an operation depends not only upon its logical correctness, but also upon the time in which it is performed. Real-time systems, as well as their deadlines, are classified by the consequence of missing a deadline.

3 Types

Hard

Missing a deadline is a total system failure.

Firm

Infrequent deadline misses are tolerable, but may degrade the system's quality of service. The usefulness of a result is zero after its deadline.

Soft

The usefulness of a result degrades after its deadline, thereby degrading the system's quality of service.

Error

Real-time computing is sometimes misunderstood to be high-performance computing

Real-Time Discovery

BUT...

The Cake Is a Lie™

Perceived Real-Time

RTA + Async

  • non-blocking UI
    • render on the client
    • store state and data on the client
  • Validations on client
  • Asynchronous connections
  • Lie, lie and lie

network is always a bottleneck

Solutions

Past

  • comet
  • polling/jsonp polling
  • iframe
  • plugins, flash, java, silverlight
  • eventsource

Present

  • HTTP Server Push(Websockets)
  • Server Sent Events
  • Persistent HTTP connections(Pushlet)
  • Long polling

Websockets

              new WebSocket('ws://chat.example.com/games');
            

The Good Parts

  • HTML5 Standard
  • Bidirectional
  • Persistent
  • Lightweight
  • Fast
  • Origin rules

The Bad Parts

  • No cross-browser
  • Different implementations
  • 3G can break websockets
  • Sending invalid UTF-8 stops the connection
  • Non-standard ports(firewalls)

Finding the right tool

  • Browser support
  • Usable from our main programming language
  • Fast to develop/deploy
  • Websockets and fallbacks
  • Easy upgrade

Implementations

  • Node.js
  • Ruby
  • Python
  • php
  • Redis(pub/sub)

Node.js

Socket.io

Ruby

EventMachine + Websockets

Python

Twisted

PHP

Ratchet

Redis

Pub/Sub

Socket.io

Server

              
                var io = require('socket.io').listen(80);

                io.sockets.on('connection', function (socket) {
                  socket.emit('news', { hello: 'world' });
                  socket.on('my other event', function (data) {
                    console.log(data);
                  });
                });
              
            

Client

              
                <script src="/socket.io/socket.io.js"></script>
                <script>
                  var socket = io.connect('http://localhost');
                  socket.on('news', function (data) {
                    console.log(data);
                    socket.emit('my other event', { my: 'data' });
                  });
                </script>
              
            

Demo time

Source code

Some stats

The future present...

  • SPDY
  • HTTP 2.0
  • I/O
  • Browser wars
  • Standards

Maybe the future...

"This is in real time"

"I'll create a GUI interface using Visual Basic and see if I can track an IP address"

Conclusions

  • Do not use trends*
  • Choose the right tool
  • Test it before production
  • Add real time as an extra layer*
  • Know what plaforms you are targeting
No matter which tool you use, what matters is that the tool you choose fits all your needs. - @ainformatico

Q&A