Dude, That's Some Strange UI Architecture

34
Dude, That’s Some Strange UI Architecture Kyle Simpson @getify [email protected] om http:// getify.me #strange ui

description

Exploring CVC (Clients-Views-Controllers) pattern (instead of MVC) for Middle-End UI Architecture, using server-side JavaScript for DRY code that can be used both on the server and in the browser.

Transcript of Dude, That's Some Strange UI Architecture

Page 1: Dude, That's Some Strange UI Architecture

Dude, That’s Some Strange UI Architecture

Kyle Simpson@getify

[email protected]

http://getify.me

#strangeui

Page 2: Dude, That's Some Strange UI Architecture

document.write()

Must Die

Page 3: Dude, That's Some Strange UI Architecture

— Agnieszka Gasparska

Page 4: Dude, That's Some Strange UI Architecture
Page 5: Dude, That's Some Strange UI Architecture

Every block of stone has a statue inside it and it is the task of the sculptor to discover it.

— Michelangelo

Page 6: Dude, That's Some Strange UI Architecture

Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.

— Antoine de Saint-Exupery

Page 7: Dude, That's Some Strange UI Architecture
Page 8: Dude, That's Some Strange UI Architecture
Page 9: Dude, That's Some Strange UI Architecture
Page 10: Dude, That's Some Strange UI Architecture
Page 11: Dude, That's Some Strange UI Architecture

UI Architecture

how you process, package, deliver to, and communicate with the client/presentation layer

Page 12: Dude, That's Some Strange UI Architecture

UI Architecture

in between the FRONT end and the BACK end is…

the MIDDLE end

Page 13: Dude, That's Some Strange UI Architecture

UI Architecture

url routing

data validation

data formatting

templating

ajax

cookies/headerscaching

Page 14: Dude, That's Some Strange UI Architecture
Page 15: Dude, That's Some Strange UI Architecture

ui architecture

Page 16: Dude, That's Some Strange UI Architecture

MVC

Page 17: Dude, That's Some Strange UI Architecture
Page 18: Dude, That's Some Strange UI Architecture

performance anxiety

optimization

Page 19: Dude, That's Some Strange UI Architecture

spaghetti code

Page 20: Dude, That's Some Strange UI Architecture

i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY. i will not repeat myself. DRY.

Page 21: Dude, That's Some Strange UI Architecture

CVCclients views controllers

Page 22: Dude, That's Some Strange UI Architecture
Page 23: Dude, That's Some Strange UI Architecture

ui architecture

Page 24: Dude, That's Some Strange UI Architecture

Result Set Pagination

Page 25: Dude, That's Some Strange UI Architecture

Atomic Operation Caching

Page 26: Dude, That's Some Strange UI Architecture

Independent Tier Scaling

Page 27: Dude, That's Some Strange UI Architecture

clients

everything is a client of everything else

decoupled, modular, scalable

Page 28: Dude, That's Some Strange UI Architecture

views

templating, portable, DRY, platform agnostic,

core web technology

Page 29: Dude, That's Some Strange UI Architecture

controllers

small, independent, powerful

Page 30: Dude, That's Some Strange UI Architecture

JavaScript

(on the server)

Page 31: Dude, That's Some Strange UI Architecture

BikechainJS

V8 “engine” modules

Page 32: Dude, That's Some Strange UI Architecture

HandlebarJS{ }

templating engine text/html templates

JSON data input

Page 33: Dude, That's Some Strange UI Architecture

demo

code

Page 34: Dude, That's Some Strange UI Architecture

More info

http://spkr8.com/t/4821

http://github.com/getify/shortie.me

please provide feedback!!!!

Kyle Simpson@[email protected]://getify.me

#strangeui

http://shortie.me/!strange

http://MiddleEnd.com