Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
SXSWi 2010<br />Kyle Simpson<br />@getify<br />http://getify.me<br />#frontandbackofit<br />#jsarch<br />JavaScript Archit...
UI Architecture<br />all the stuff that it takes to process, package, deliver, and communicate with the client (presentati...
UI Architecture<br />templating<br />url routing<br />data validation<br />ajax<br />data formatting<br />
UI Architecture<br />in between the FRONT end and the BACK end is…<br />the MIDDLE end<br />
traditional web architecture<br />
what‘s my motivation?<br />
1. performance<br />
2. MVC<br />
spaghetti code<br />move over, QBasic<br />
3.DRY<br />
4. role separation<br />
a new “view”<br />
CVC<br />clients views controllers<br />
clients<br />everything is a client of everything else<br />decoupled, modular, scalable<br />
templating, portable, DRY, platform agnostic, core web technology<br />views<br />
controllers<br />small, independent, powerful<br />
what i‘mNOT suggesting<br />another framework<br />ditch whole architecture<br />mvc is wrong/weak<br />
what iAM suggesting<br />it‘s ok to rethink!<br />CVC is an alternatepattern for thinking about UI architecture<br />
JavaScript<br />(on the server)<br />
node.js (V8)<br />narwhal<br />(rhino)<br />JavaScriptCore, SpiderMonkey, etc<br />
CommonJS<br />files<br />i/o<br />processes<br />networking<br />
BikechainJS<br />V8<br />“engine”<br />modules<br />
the power of UI architecture in the hands of front-end engineers<br />CVC + JavaScript<br />=<br />
but how????<br />
HandlebarJS<br />{  }<br />templating engine <br />text/html templates <br />JSON data input<br />
details, details…<br />100% JavaScript (browser or server)<br />application “state” selects templates<br />“compiles” temp...
Wrapping up<br />
More info<br />http://sxsw.getify.com<br />http://blog.getify.com<br />http://spkr8.com/talks/2518<br />please provide fe...
Prochain SlideShare
Chargement dans…5
×

JavaScript Architecture: The Front and the Back of It

6 324 vues

Publié le

Explore new ways to use JavaScript on the server and in the browser to achieve scalable, secure, robust, and maintainable UI architecture for web applications.

Publié dans : Technologie

JavaScript Architecture: The Front and the Back of It

  1. 1.
  2. 2. SXSWi 2010<br />Kyle Simpson<br />@getify<br />http://getify.me<br />#frontandbackofit<br />#jsarch<br />JavaScript Architecture:The Front and the Back of It<br />
  3. 3. UI Architecture<br />all the stuff that it takes to process, package, deliver, and communicate with the client (presentation layer)<br />
  4. 4. UI Architecture<br />templating<br />url routing<br />data validation<br />ajax<br />data formatting<br />
  5. 5. UI Architecture<br />in between the FRONT end and the BACK end is…<br />the MIDDLE end<br />
  6. 6. traditional web architecture<br />
  7. 7.
  8. 8. what‘s my motivation?<br />
  9. 9. 1. performance<br />
  10. 10. 2. MVC<br />
  11. 11. spaghetti code<br />move over, QBasic<br />
  12. 12. 3.DRY<br />
  13. 13. 4. role separation<br />
  14. 14. a new “view”<br />
  15. 15. CVC<br />clients views controllers<br />
  16. 16.
  17. 17. clients<br />everything is a client of everything else<br />decoupled, modular, scalable<br />
  18. 18. templating, portable, DRY, platform agnostic, core web technology<br />views<br />
  19. 19. controllers<br />small, independent, powerful<br />
  20. 20. what i‘mNOT suggesting<br />another framework<br />ditch whole architecture<br />mvc is wrong/weak<br />
  21. 21. what iAM suggesting<br />it‘s ok to rethink!<br />CVC is an alternatepattern for thinking about UI architecture<br />
  22. 22. JavaScript<br />(on the server)<br />
  23. 23. node.js (V8)<br />narwhal<br />(rhino)<br />JavaScriptCore, SpiderMonkey, etc<br />
  24. 24. CommonJS<br />files<br />i/o<br />processes<br />networking<br />
  25. 25. BikechainJS<br />V8<br />“engine”<br />modules<br />
  26. 26. the power of UI architecture in the hands of front-end engineers<br />CVC + JavaScript<br />=<br />
  27. 27. but how????<br />
  28. 28. HandlebarJS<br />{ }<br />templating engine <br />text/html templates <br />JSON data input<br />
  29. 29. details, details…<br />100% JavaScript (browser or server)<br />application “state” selects templates<br />“compiles” templates into JS<br />
  30. 30. Wrapping up<br />
  31. 31. More info<br />http://sxsw.getify.com<br />http://blog.getify.com<br />http://spkr8.com/talks/2518<br />please provide feedback!!!!<br />http://github.com/getify/BikechainJS<br />http://github.com/getify/HandlebarJS<br />Kyle Simpson<br />@getify<br />http://getify.me<br />#frontandbackofit<br />#jsarch<br />

×