fowa2013: the rise of single page applications

50
#FOWA

Upload: caridy-patino

Post on 25-Dec-2014

7.393 views

Category:

Technology


2 download

DESCRIPTION

In the last couple of years we have seen an explosion of single-page applications beyond the traditional complex applications, making its way into the mainstream and the consequent appearance of frameworks to facilitate the creation of these apps. In this session we will cover the motivations and implications of creating single-page apps, as well as the current state of the industry, the trends that are starting to arise in the field and the role of nodejs to facilitate the initial render process on the server side before handing over the control to the browser, as a way to speed up the initial rendering on mobile devices.

TRANSCRIPT

Page 1: FOWA2013: The rise of single page applications

#FOWA

Page 3: FOWA2013: The rise of single page applications
Page 4: FOWA2013: The rise of single page applications
Page 5: FOWA2013: The rise of single page applications

The Time Machine (2002)

Page 6: FOWA2013: The rise of single page applications

Safety Not Guaranteed (2012)

Page 7: FOWA2013: The rise of single page applications
Page 8: FOWA2013: The rise of single page applications

The rise ofsingle-page applications

Page 11: FOWA2013: The rise of single page applications

from web applicationsto single-page applications

Page 12: FOWA2013: The rise of single page applications

evolution of web applications

Page 13: FOWA2013: The rise of single page applications

urls

Page 14: FOWA2013: The rise of single page applications

url fragments

Page 15: FOWA2013: The rise of single page applications

websites

Page 16: FOWA2013: The rise of single page applications

ajax

Page 17: FOWA2013: The rise of single page applications

complex apps became popular

Page 18: FOWA2013: The rise of single page applications

our amazing big brains

http://www.flickr.com/photos/pennstatelive/8972110324/

Page 20: FOWA2013: The rise of single page applications

back/forward buttons were patchedusing fragments to improve usability

Page 21: FOWA2013: The rise of single page applications

the broken webwas eventually fixed

Page 22: FOWA2013: The rise of single page applications

performance

Page 23: FOWA2013: The rise of single page applications

we hack things to avoiddisrupting the workflow witha full page reload to fulfill anaction as a consequence of a

user interaction

Page 24: FOWA2013: The rise of single page applications

single-page applications

Page 25: FOWA2013: The rise of single page applications

support for multiple statesto react to user interaction

Page 26: FOWA2013: The rise of single page applications
Page 27: FOWA2013: The rise of single page applications

users can switch betweendifferent states in no time

Page 28: FOWA2013: The rise of single page applications

... and doing so without breakingany of the core features of the web

(history, url, openness)

Page 29: FOWA2013: The rise of single page applications

building single-pageapplications today

Page 30: FOWA2013: The rise of single page applications

Mojito

EmberJS

AngularJSRendr

BackboneMeteor

DerbyJS

YAF

React

Page 31: FOWA2013: The rise of single page applications

support a chain of user interactionsto fulfill an operation without

a full page refresh

Page 32: FOWA2013: The rise of single page applications

patterns

Page 33: FOWA2013: The rise of single page applications

MV* for the win

Page 34: FOWA2013: The rise of single page applications

url driven web applications

Page 35: FOWA2013: The rise of single page applications

conventions over configurations

Page 36: FOWA2013: The rise of single page applications

libraries over frameworks

Page 37: FOWA2013: The rise of single page applications

UI data bindings

Page 38: FOWA2013: The rise of single page applications

the /#!/ugly/ url is fading out

Page 39: FOWA2013: The rise of single page applications

initial rendering on the server

Page 40: FOWA2013: The rise of single page applications

nodejs as the server runtime

Page 41: FOWA2013: The rise of single page applications

server produces the initial state of the application, then passing the control to the browser to continue function

as a single page application

Page 42: FOWA2013: The rise of single page applications
Page 43: FOWA2013: The rise of single page applications

progressive enhancement,graceful degradation,

and performance as a feature

Page 44: FOWA2013: The rise of single page applications

performance as a way toenhance user experience

Page 45: FOWA2013: The rise of single page applications

only seconds of our users’ attention

Page 46: FOWA2013: The rise of single page applications
Page 47: FOWA2013: The rise of single page applications

modown is a set of libraries and components to powersingle page applications

Page 48: FOWA2013: The rise of single page applications

modown is coming soon!

Page 49: FOWA2013: The rise of single page applications

npmjs.org/search?q=modowngithub.com/yui/

github.com/yahoo/

Page 50: FOWA2013: The rise of single page applications

Thanks

@caridy