OPTIMERA STHLM! Stefan Pettersson

Faster websites with
AJAX REST and

architecture
Optimera STHLM
2010-05-31

Stefan Pettersson
@stpe
stefpet@gmail.com
http://stpe.se

<a href=”#”
HTML onclick=”globalPollution();”
style=”font-size: 666px”>

CSS JavaScript

<a href=”#”

CSS JavaScript Ugly

<a href=”#”

CSS JavaScript Ugly

WebServer

DB

<a href=”#”

CSS JavaScript Ugly

WebServer HEAVY Java?

DB

<a href=”#”

CSS JavaScript Ugly

WebServer Weird .NET?

DB

<a href=”#”

CSS JavaScript Ugly

WebServer Chaotic PHP?

DB

<a href=”#”

CSS JavaScript Ugly

WebServer Maybe MVC...?

DB

View

Model

Controller

V V V V V V V V

C C C C C

V V V V V V V V

V

V

C C C C C

V V V V V V V V

M M V

M M
M M M V
M
M M

C C C C C

V V V V V V V V

DAO M
DAO M V

M M DAO
M M M V
DAO DAO
M
M DAO M
DAO
DAO
DAO DAO

C C C C C

V V V V V V V V
PM PM
PM
PM DAO M
DAO M V
PM PM
PM M M PM DAO
M M M V
DAO DAO
M PM
M DAO M
DAO PM DAO
DAO DAO

C C C C C

Presentationslogik i
browsern

HTML

CSS

JavaScript

RESTful
Web Web
Server Service
DB

HTML

CSS

JavaScript

Template

RESTful
Web Web
Server Service
DB

HTML

CSS

JavaScript

Template Data

RESTful
Web Web
Server Service
DB

<!DOCTYPE html>
<html>
<head>
<title>ThinServer</title>
<script src=”bootstrap.js”></script>
</head>
<body>
</body>
</html>

Representational State Transfer

XMLHttpRequest
// get XHR object (older IE needs workaround)
var xhr = new XMLHttpRequest();

xhr.open('GET', '/item/17/', true);
xhr.onreadystatechange = function(event) {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
console.log(xhr.responseText);
} else {
console.log("Fail");
}
}
};

// initiate request
xhr.send(null);

callback({“data”: [1, 2, 3]});

callback({“data”: [1, 2, 3]});

<script type=”text/javascript”
src=”http://d.com/item/17/?callback=callback”>
</script>

Browser

Data

RESTful
Web Service

Browser

Data

RESTful
Web Service

Database

Browser

Data

RESTful
Web Service

Enterprise SOA
Producers
Consumers
Queues Buses

Browser

Data

RESTful
Web Service

NoSQL

Internal System

Data

RESTful
Web Service

Web Server

Data

RESTful
Web Service

Mobile

Data

RESTful
Web Service

http://blogg.aftonbladet.se/dev/

Stefan Pettersson
CEO @ Expansive Worlds AB
http://www.expansiveworlds.com

OPTIMERA STHLM! Stefan Pettersson

Recommandé

Recommandé

Contenu connexe

Similaire à OPTIMERA STHLM! Stefan Pettersson

Similaire à OPTIMERA STHLM! Stefan Pettersson (20)

Plus de .SE (Stiftelsen för Internetinfrastruktur)

Plus de .SE (Stiftelsen för Internetinfrastruktur) (17)

Dernier

Dernier (20)

OPTIMERA STHLM! Stefan Pettersson

Notes de l'éditeur