Realtime Web

realtime

pfleidi aka "der mit dem ..."

Realtime Web?

nyan tron

Well ... soft realtime

kittens

Hipster technology?

hipster dog

Nah. Fun stuff!

pleasures

For teh lulz!

for teh lulz

Instant updates!

Without having to reload websites!

y u want reaload

Connecting users!

Examples

Another example:
This presentation

http://roothausen.de:8080/

Join the party ...

y u want reaload

Demo chat

Welcome to the Demo Chat!

Client side

Example: Realtime chat

Tolkien

Ajax polling

function ajaxCall() {
  $.get('/newmessages', function onComplete(response) {
    addNewMessagesToChat(response);
    // polling
    setTimeout(ajaxCall, 1000);
  }, 'json');
}
  

Comet

function cometCall() {
  // get new messages from server
  $.get('/newmessages', function (response) {
      // instantly make new call
      cometCall();
      addNewMessagesToChat(response);
    }, 'json');
};
  

Suboptimal ....

skeptical

"But ... XHR works!"

leave xhr alone

Yes, but

Meh ... ;(

facepalm

HTML5 to the rescue!

HTML5 Logo

HTML5 WebSockets

WebSockets API

var connection = new WebSocket(
      'ws://socket.host.tld/chat'
    );

connection.onmessage = function (message) {
  addNewMessagesToChat(message.data);
};

$('#sendbutton').click(function () {
    var text = $('#chatInput').val();
    connection.send("message: " + text);
});
  

Unified API?

What about graceful degradation?

I got this

Socket.io

var socket = new io.Socket(hostname, {
    port: port
});
socket.connect();

socket.on('message', function (message) {
  addNewMessageToChat(message);
});
  

Server side

krebs

Paradigm shift

Load pattern

High I/O and low CPU consumption

problems

How do we scale?

Web scale?

Handling concurrency

[..] a folk definition of insanity is to do the same thing over and over again and to expect the results to be different. By this definition, we in fact require that programmers of multithreaded systems be insane.

-- The Problem with Threads, Edward A. Lee, UC Berkeley, 2006

trollfacw

Parallelism is not concurrency

The better solutions to this problem are lightweight and provide only high concurrency

Use the right tool

Haters gonna hate

Frameworks

Opportunities

Questions?

like a ross

Thank you!

Twitter

http://twitter.com/pfleidi

Github

http://github.com/pfleidi

My thesis

http://blog.roothausen.de/2011/03/22/my-bachelor-thesis-scale-the-realtime-web/