The document discusses the history and capabilities of websockets. It begins with a brief history of push technology in web browsers from the late 1980s to the introduction of websockets in HTML5 in 2009. It then provides an example of how websockets could enable grid computing by allowing a coordinating service to push code and data to clients. The document discusses some implications of building applications with websockets, including how it affects testing due to logic residing in both the client and server.
2. • Introductions
• So what are Websockets then?
• Interactions on the World Wide Web
• Implications for building application
• Recap
Monday, 24 May 2010
15. An Example
Grid computing
What do you need to create a grid?
Monday, 24 May 2010
16. An Example
Grid computing
What do you need to create a grid?
Clients that are capable of exectuting arbitrary algorithms
Monday, 24 May 2010
17. An Example
Grid computing
What do you need to create a grid?
Clients that are capable of exectuting arbitrary algorithms
A co-ordinating service to push code / data to clients and
assemble the results
Monday, 24 May 2010
20. OS
JVM
app
client - server
Anatomy of a traditional grid client
Monday, 24 May 2010
21. OS
JVM
app
<Publisher>
A co-ordinating
service to push
code / data and
assemble the results
client - server
Anatomy of a traditional grid client
Monday, 24 May 2010
22. OS
JVM
Clients that are
capable of exectuting
arbitrary algorithms app <Listener>
<Publisher>
A co-ordinating
service to push
code / data and
assemble the results
client - server
Anatomy of a traditional grid client
Monday, 24 May 2010
29. OS
JVM
app <Listener>
<Publisher>
client - server
Monday, 24 May 2010
30. OS Browser
JVM js engine
app <Listener> app
<Publisher>
client - server we-run-any-code.com
Monday, 24 May 2010
31. OS Browser
JVM js engine
app <Listener> app
Map
<Publisher>
client - server we-run-any-code.com
Monday, 24 May 2010
32. OS Browser
JVM js engine
app <Listener> app
Map
<Publisher> Reduce
client - server we-run-any-code.com
Monday, 24 May 2010
33. What do you need to create a grid?
Monday, 24 May 2010
34. What do you need to create a grid?
Execute arbitrary code
Co-ordinating service
Push code to client
Monday, 24 May 2010
35. What do you need to create a grid?
Execute arbitrary code eval(string)
Co-ordinating service
Push code to client
Monday, 24 May 2010
36. What do you need to create a grid?
Execute arbitrary code eval(string)
Co-ordinating service Umm, a web server?
Push code to client Any ideas?
Monday, 24 May 2010
37. “The HTML5 initiative introduced the Web
Socket interface -- now developed as an
independent specification -- which defines a
full-duplex communications channel that
operates over a single socket and is
exposed via a JavaScript interface in
compliant browsers. “
Source: websockets.org
Monday, 24 May 2010
38. [Constructor(in DOMString url, in optional DOMString protocol)]
interface WebSocket {
<snip>
// networking
attribute Function onopen;
attribute Function onmessage;
attribute Function onerror;
attribute Function onclose;
boolean send(in DOMString data);
void close();
};
<snip>
Monday, 24 May 2010
40. Interactions on the World Wide Web
Websockets
GET /nextJob HTTP/1.1
Host: werunanycode.com
Connection: Upgrade
Upgrade: WebSocket
Monday, 24 May 2010
41. Interactions on the World Wide Web
Websockets
GET /nextJob HTTP/1.1
Host: werunanycode.com HTTP/1.1 101 WebSocket Protocol
Connection: Upgrade Handshake
Upgrade: WebSocket Upgrade: WebSocket
Connection: Upgrade
Monday, 24 May 2010
43. Interactions on the World Wide Web
Websockets
websocket: function(url, s) {
<snip>
$(ws)
.bind('open', $.websocketSettings.open)
.bind('close', $.websocketSettings.close)
.bind('message', $.websocketSettings.message)
.bind('message', function(e){
var m = $.evalJSON(e.originalEvent.data);
var h = $.websocketSettings.events[m.type];
if (h) h.call(this, m);
});
<snip>
}
Monday, 24 May 2010
44. Interactions on the World Wide Web
Websockets
public class ClientMessageCallback implements WebSocket {
private Outbound outbound;
public void onConnect(Outbound outbound) {
}
public void onDisconnect() {
}
public void sendMessage(String message) {
try {
outbound.sendMessage(message);
} catch (IOException e) {
throw new RuntimeException(e);
}
}
}
Monday, 24 May 2010
52. What did we just see?
Raw TCP/IP based sockets
Monday, 24 May 2010
53. What did we just see?
Raw TCP/IP based sockets
Message exchange
Monday, 24 May 2010
54. What did we just see?
Raw TCP/IP based sockets
Message exchange
State transition logic in the client
Monday, 24 May 2010
55. What did we just see?
Raw TCP/IP based sockets
Message exchange
State transition logic in the client
The building blocks of the World Wide Web
Monday, 24 May 2010
56. What did we just see?
Raw TCP/IP based sockets
Message exchange
State transition logic in the client
hick c lients
t
The building blocks of the World Wide Web
^
Monday, 24 May 2010
57. OS Browser
JVM js engine
app <Listener>
<Listener>
app
<Publisher>
<Publisher>
See? It’s a thick client!
Monday, 24 May 2010
58. But that doesn’t break the internet does it?
Monday, 24 May 2010
59. But that doesn’t break the internet does it?
well, what is the internet?
Monday, 24 May 2010
62. Characteristics of the interwebernet
self-descriptive messages
identification of resources
manipulation of resources through representations
HATEOAS
layered system
Source: Fielding, Roy. 2000. Architectural Styles and the Design of Network-based Software Architectures.
PhD diss
Monday, 24 May 2010
63. Image of ISP Backbone Connectivity reflecting Skitter Path Data - 1998
http://www.caida.org/Tools/Skitter/viz9808.html
Monday, 24 May 2010
88. Feature #2 - availability
“The internet is not a five nines fabric”
Urs Hölzle
Monday, 24 May 2010
89. Feature #2 - availability
“The internet is not a five nines fabric”
Urs Hölzle
“If you are going to build an internet scale application
using push, you’d better not count on it’s availability”
Monday, 24 May 2010
90. Feature #2 - availability
“The internet is not a five nines fabric”
Urs Hölzle
“If you are going to build an internet scale application
using push, you’d better not count on it’s availability”
Me
Monday, 24 May 2010
92. 2005
Pakistan suffers a near complete Internet outage as a submarine cable
becomes defective (Jun)
Monday, 24 May 2010
93. 2005
Pakistan suffers a near complete Internet outage as a submarine cable
becomes defective (Jun)
2008
The Middle East, India, and other parts of Africa and Asia see a major
degradation in Internet service, including outages, after several undersea
cables carrying Internet traffic to the region are cut within 1 week (Jan-Feb)
YouTube becomes unreacheable for a couple of hours after Pakistan Telecom
starts an unauthorized announcement of YouTube's subnet prefix (24 Feb)
Source: Hobbes' Internet Timeline, www.zakon.org/robert/internet/timeline/
Monday, 24 May 2010
95. Other stuff you will
need to think about
Monday, 24 May 2010
96. Other stuff you will
need to think about
Testing
Monday, 24 May 2010
97. Other stuff you will
need to think about
Testing
Coupling
Monday, 24 May 2010
98. Other stuff you will
need to think about
Testing
Coupling
Domain models
Monday, 24 May 2010
99. How do you normally
test webapps?
...
<div id=”algorithm”>
<span>var x = [crazy complex prime stuff]</span>
<form action=”/jobs/asd2b234c598/answer” method=”POST”>
<input type=”text” name=”answer” value=”” />
</form>
</div>
...
Monday, 24 May 2010
100. How do you normally
test webapps?
...
<div id=”algorithm”>
<span>var x = [crazy complex prime stuff]</span>
<form action=”/jobs/asd2b234c598/answer” method=”POST”>
<input type=”text” name=”answer” value=”” />
</form>
</div>
...
unit tests integration tests
functional tests
acceptance tests
Monday, 24 May 2010
101. But now the logic is in
both client and server
unit tests integration tests
functional tests
acceptance tests
Monday, 24 May 2010
102. But now the logic is in
both client and server
unit tests integration tests
acceptance tests
functional tests
unit tests integration tests
functional tests
acceptance tests
Monday, 24 May 2010
103. But now the logic is in
both client and server
unit tests integration tests
acceptance tests
functional tests
unit tests integration tests
functional tests
acceptance tests
You don’t suck, so you are going to test both right?
Monday, 24 May 2010
104. And the asynchronous stuff? You’re
pretty good at testing multi-threaded
code are you?
Monday, 24 May 2010
105. And the asynchronous stuff? You’re
pretty good at testing multi-threaded
code are you?
Dan North and James’ first rule of concurrency
Monday, 24 May 2010
106. And the asynchronous stuff? You’re
pretty good at testing multi-threaded
code are you?
“Doug Lea does it better than you do...”
Dan North and James’ first rule of concurrency
Monday, 24 May 2010
108. Recap
Websockets are really cool!
Monday, 24 May 2010
109. Recap
Websockets are really cool!
And simple to use
Monday, 24 May 2010
110. Recap
Websockets are really cool!
And simple to use
http://code.google.com/p/jquery-websocket/
http://jetty.codehaus.org/jetty/
http://www.google.com/chrome
Monday, 24 May 2010
112. Recap
You can implement some really exciting
applications with them
Monday, 24 May 2010
113. Recap
You can implement some really exciting
applications with them
They are particularly well-suited to low-latency stuff
Trading applications for example
Monday, 24 May 2010
115. Recap
But you won’t be able to take advantage of the
stuff that makes the internet scale or
interoperate
You will have to learn how to do that yourself
Monday, 24 May 2010
121. Interactions on the World Wide Web
Traditional we-run-any-code.com
Monday, 24 May 2010
122. Interactions on the World Wide Web
Traditional we-run-any-code.com
classic HTTP request-response
Monday, 24 May 2010
123. Interactions on the World Wide Web
Traditional we-run-any-code.com
classic HTTP request-response
Monday, 24 May 2010
124. Interactions on the World Wide Web
Traditional we-run-any-code.com
Monday, 24 May 2010
125. Interactions on the World Wide Web
Traditional we-run-any-code.com
Monday, 24 May 2010
126. Interactions on the World Wide Web
Traditional we-run-any-code.com
Monday, 24 May 2010
127. Interactions on the World Wide Web
Traditional we-run-any-code.com
GET /index HTTP/1.1
Host: we-run-any-code.com
Monday, 24 May 2010
128. Interactions on the World Wide Web
Traditional we-run-any-code.com
GET /index HTTP/1.1
Host: we-run-any-code.com
HTTP/1.1 200 OK
<html>
...
<a rel=”nextjob” href=”/nextjob” />
...
</html>
Monday, 24 May 2010
129. Interactions on the World Wide Web
Traditional we-run-any-code.com
Monday, 24 May 2010
130. Interactions on the World Wide Web
Traditional we-run-any-code.com
GET /nextjob HTTP/1.1
Host: we-run-any-code.com
Monday, 24 May 2010
131. Interactions on the World Wide Web
Traditional we-run-any-code.com
GET /nextjob HTTP/1.1
Host: we-run-any-code.com HTTP/1.1 303 See Other
Location: /jobs/asd2b234c598
Monday, 24 May 2010
132. Interactions on the World Wide Web
Traditional we-run-any-code.com
GET /nextjob HTTP/1.1
Host: we-run-any-code.com HTTP/1.1 303 See Other
Location: /jobs/asd2b234c598
GET /jobs/asd2b234c598 HTTP/1.1
Host: we-run-any-code.com
Monday, 24 May 2010
133. Interactions on the World Wide Web
Traditional we-run-any-code.com
GET /nextjob HTTP/1.1
Host: we-run-any-code.com HTTP/1.1 303 See Other
Location: /jobs/asd2b234c598
GET /jobs/asd2b234c598 HTTP/1.1
Host: we-run-any-code.com
HTTP/1.1 200 OK
...
<div id=”algorithm”>
<span>var x = [crazy complex prime stuff]</span>
<form action=”/jobs/asd2b234c598/answer” method=”POST”>
<input type=”text” name=”answer” value=”” />
</form>
</div>
...
Monday, 24 May 2010
134. What did we just see?
HTTP verbs and status codes
Addressable resources
HATEOAS
This is how the internet has been able to grow to,
umm, internet-scale...
Monday, 24 May 2010
135. Closed set of operations, well-understood semantics
GET <resource-name> HTTP/1.1
PUT <resource-name> HTTP/1.1
POST <resource-name> HTTP/1.1
DELETE <resource-name> HTTP/1.1
OPTIONS <resource-name> HTTP/1.1
HEAD <resource-name> HTTP/1.1
Monday, 24 May 2010
138. Representations of resources
Addressable
self-contained
(there’s this thing with media types, but we won’t go into that)
Monday, 24 May 2010
139. Representations of resources
Addressable
...
<div id=”algorithm”>
<span>var x = [crazy complex prime stuff]</span>
self-contained <form action=”/jobs/asd2b234c598/answer” method=”POST”>
<input type=”text” name=”answer” value=”” />
</form>
</div>
...
(there’s this thing with media types, but we won’t go into that)
Monday, 24 May 2010
140. Representations of resources
HTTP/1.1 303 See Other
Location: /jobs/asd2b234c598 Addressable
...
<div id=”algorithm”>
<span>var x = [crazy complex prime stuff]</span>
self-contained <form action=”/jobs/asd2b234c598/answer” method=”POST”>
<input type=”text” name=”answer” value=”” />
</form>
</div>
...
(there’s this thing with media types, but we won’t go into that)
Monday, 24 May 2010
141. Hypermedia As The Engine Of
Application State
<html>
...
<a rel=”nextjob” href=”/nextjob” />
...
</html>
Monday, 24 May 2010
142. Hypermedia As The Engine Of
Application State
Starting
GET Grid GET Finding job
GET
Submitting
answer POST Running job
<html>
...
<a rel=”nextjob” href=”/nextjob” />
...
</html>
Monday, 24 May 2010