The Whole Stack

The Whole In the Stack Beginning

Allen I. Holub Holub Associates

www.holub.com [email protected] @allenholub

1 2-1

In the In the Beginning Beginning

There was There was this big this big turtle turtle

2-2 2-3 Pages or Application? In the Beginning

There was this big turtle

It’s turtles all the way down

2-4 3

Web Server Firewall-Router Web Server

Traditional Traditional

4-1 4-2 Firewall-Router Web Server Firewall-Router Web Server

App Traditional RDBMS Traditional Server RDBMS

4-3 4-4

Firewall-Router Web Server Firewall-Router Web Server

ORM ORM Subsystem? Subsystem?

App Traditional Server RDBMS Traditional RDBMS

4-5 4-6 Firewall-Router Web Server Firewall-Router Web Server

ORM ORM Subsystem? Subsystem?

Traditional RDBMS Traditional RDBMS

4-7 4-8

Mongo (NoSQL), MySQL, … Node+ Java, Python, Java + Express C#, Ruby… Jetty

Firewall-Router Web Server Nginx/ Apache ORM Subsystem? Angular, Knockout, React Bootstrap JavaScript/Typescript HTML Css/Sass/Less

Traditional RDBMS

4-9 5-1 Mongo (NoSQL), MySQL, … Mongo (NoSQL), MySQL, … Node+ Java, Python, Java + Node+ Java, Python, Java + Express C#, Ruby… Jetty Express C#, Ruby… Jetty

Nginx/ Nginx/ Apache Apache Angular, Knockout, React Angular, Knockout, React Bootstrap JavaScript/Typescript Bootstrap JavaScript/Typescript HTML Css/Sass/Less HTML Css/Sass/Less

MEAN = Mongo/Express/Angular/Node

5-2 5-3

Web Web DBMS DBMS Web Pages (Web1) Server Web Pages (Web1) Server HTML / CSS Request Page Modernizr Database Access (JDBC, etc.) Build Build Complete Page Entire Fetch ORM: Hibernate, etc. Entire Fetch Page Page Submit Form (with error) Form Construction/Parsing: PHP Build Build Ruby/Rails Entire Entire Complete Page (showing error) Fetch Spring/Struts Fetch Page Page App Server? Submit Form (w/o error) EJB Build JBoss Build Complete Page Entire Fetch Etc. Entire Fetch Page Page

6-1 6-2 Web Web DBMS DBMS Web Pages (Web1) Server Web Pages (Web1) Server HTML / CSS HTML / CSS Modernizr Modernizr Database Access (JDBC, etc.) Database Access (JDBC, etc.) 74,600,000 Wordpress Sites!Build Build ORM: Hibernate, etc. Entire Fetch ORM: Hibernate, etc. Entire Fetch (~20% of all websites)Page Page Form Construction/Parsing: Form Construction/Parsing: PHP PHP Build Build Ruby/Rails Ruby/Rails LAMP (Linux/Apache/MySQL/Entire Entire Spring/Struts Fetch Spring/Struts Fetch Php) Page Page App Server? App Server? EJB EJB JBoss Build JBoss Build Etc. Entire Fetch Etc. Entire Fetch Page Page

6-3 6-4

Session Session

Store it on the page!

7-1 7-2 Cookies Session Cookies Session HTML5 key/value pairs

Store it on the page! Store it on the page!

7-3 7-4

Web DBMS Web Application Server

Request Page Complete Page Fetch Generic Cookies Session request customer info Page HTML5 key/value pairs Store/ Return user info as JSON Fetch JavaScript/ID Redraw Page

notify server of state change Store/ Store it on the page! JSON representing new state Fetch?

Redraw Page

7-5 8-1 Web Web Application DBMS Server AngularJS/KnockOut (binding)

HTML / CSS Fetch Database Access (JDBC, etc.) Generic ORM: Hibernate, etc. Page AJAX (w or w/o framework) Store/ JavaScript Fetch GWT/Dart JQuery AJAX (XMLHttpRequest()) ... WebSockets? WebSocket LightStreamer/SignalR Store/ Fetch? RPC Framework (GWT/WCF) ServerPush (Long Poll/Comet) JSON (JSON:PO(C/J)O: json.net, Jackson) © 2012. Allen I. Holub www.holub.com 8 © 2012. Allen I. Holub www.holub.com 9

8-2 9

The Browser is Single Threaded

Long Poll • User events (button pushes, etc) are: –Enqueued Start here –Processed sequentially • Ajax callbacks are: –Enqueued –Processed sequentially

10 11 MicroService MicroService

HTTP? HTTP? Web Server Web Server

Interface Interface

Database Service (nosql)

Messaging? Messaging?

12-1 12-2

MicroService REST HTTP? Web Server http://server/context/data_id Interface ?additionalDataId Database (nosql) C Put

Messaging? R Get Noun U Post D Delete Verb

12-3 13 RPC The RPC Process

• RPC == Remote Procedure Call –AJAX client (on browser) calls method (on server) • Marshalling: as if it were a local call. –Convert call to an ASCII representation. E.g. XML • Wraps XMLHttpRequest and support code • Send marshalled version via HTTP POST • Way easier than doing it manually. Easily • Return is marshalled, and implanted with REST transport. returned in HTTP response.

14 15

HTTP Transport HTTP Transport! Rest string oldVal= string oldVal= Verb obj.modify(string newVal); obj.modify(string newVal);

POST http://holub.com/api/modify POST http://holub.com/api/modify ?objID=123&newVal=abcd ?objID=123&newVal=abcd { “success”:true; { “success”:true; “oldVal” : “abcd” “oldVal” : “abcd” } } Noun (Could be in payload) ©2011 Allen I Holub www.holub.com ©2011 Allen I Holub www.holub.com 16 16

16-1 16-2 Messaging

{ "action" : "myServiceMethod" "args" : [ "arg1" : 1024, "Arg2" : "another value" ] }

{ "status" : "success" "result" : { … } }

Easily accommodate new requirements.

19-1 19-2

Why Messaging? Why Messaging?

Easily accommodate new requirements. Easily accommodate new requirements. Painless (hot) scalability/updates Painless (hot) scalability/updates Easy background/foreground processing

19-3 19-4 Why Messaging? Why Messaging?

19-5 19-6

Why Messaging? Why Messaging?

Easily accommodate new requirements. Easily accommodate new requirements. Painless (hot) scalability/updates Painless (hot) scalability/updates Easy background/foreground processing Easy background/foreground processing Distributed development Distributed development Polyglot applications (e.g. different languages) Polyglot applications (e.g. different languages) Promotes inter-module independence Promotes inter-module independence More efficient than DB for sharing info.

19-7 19-8 Why Messaging? Why Messaging?

Easily accommodate new requirements. Easily accommodate new requirements. Painless (hot) scalability/updates Painless (hot) scalability/updates Easy background/foreground processing Easy background/foreground processing DistributedSpeed development development DistributedImproves development flexibility Polyglot applications (e.g. different languages) Polyglot applications (e.g. different languages) Promotes inter-module independence Promotes inter-module independence More efficient than DB for sharing info. More efficient than DB for sharing info.

19-9 19-10

Why Messaging? Why Messaging?

Easily accommodate new requirements. Easily accommodate new requirements. Painless (hot) scalability/updates PainlessScalability (hot) scalability/updates Easy background/foreground processing Easy background/foreground processing Distributed developmentGet product Distributed developmentGet product Polyglot applicationsout the (e.g. door. different languages) Polyglot applicationsout the (e.g. door. different languages) Promotes inter-module independence Promotes inter-module independence More efficient than DB for sharing info. More efficient than DB for sharing info.

19-11 19-12 Queues Queues

20-1 20-2

Queues Queues

Producer Consumer Producer Consumer

21-1 21-2 Queues Queues

Producer Consumer Producer Consumer

21-3 21-4

Queues Queues

Producer Consumer Producer Consumer

Server

22-1 22-2 Queues Queues

Producer Consumer Producer Consumer

22-3 22-4

Queues Consumer Queues Consumer

Broker Broker Producer Producer

23-1 23-2 Queues Consumer Queues Consumer

Broker Broker Producer Producer

24-1 24-2

Queues Consumer Queues Consumer Broker Broker Producer Producer

25-1 25-2 Consumer Consumer

Broker Broker Producer Producer

26-1 26-2 Bus Consumer Rabbit Producer AMQP based Guaranteed delivery Heavweight

27 28 Very Lightweight No Conﬁguration Point-to-point (No brokers/clustering) Pub/Sub Only

29 30

Rabbit Rabbit Slow, heavyweight (AMQP), complex Slow, heavyweight (AMQP), complex configuration. configuration. Supports guaranteed delivery, Supports guaranteed delivery, Can integrate with heavyweight enterprise Can integrate with heavyweight enterprise middleware systems. middleware systems. Kafka PUB/SUB only, complex configuration, centralized server (clustering).

Puppet

round }robin

Direct Routing

32 33

CI Tool (Jenkins?) watches all branches and tests on each checkin. GIT

Production Developer Engineering

Pull Merge Team

Integration/Test

Release Periodically deploy this branch

34 35 Dynamo LAMP EC2 S3 MEAN uService

x=f(a) LAMP Docker EC2 MEAN Container ! uService LAMP Docker MEAN Container uService

AWS

36 37

http://www.cyberghostvpn.com/en_us Do not rely on stickiness.

38 39-1 http://www.cyberghostvpn.com/en_us http://www.cyberghostvpn.com/en_us Apache IIS comfortable/ Fast static-page slow. delivery, but .net stack is VERY slow.

lighttpd/node.js/nginx (YouTube, Wikimedia, PirateBay [>1K hits/ sec, 52 torrents/sec], servlets via AJP connector.

39-2 39-3

Cassandra

NoSQL (MongoDB, BerkeleyDB, etc.)

Distributed Eventual Consistency

40 41 Takes requests from the internet and forwards to internal server.

Forward Reverse Proxy Proxy

Server

Forwards requests from an internal network to the internet.

42 43

? Allen Holub www.holub.com [email protected]

44 45