Upload
caridy-patino
View
7.393
Download
2
Embed Size (px)
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.
Citation preview
#FOWA
Caridy PatiñoPrincipal Frontend Engineer at Yahoo!
[email protected]@caridy
The Time Machine (2002)
Safety Not Guaranteed (2012)
The rise ofsingle-page applications
http://www.flickr.com/photos/roddh/7998107606/
http://www.flickr.com/photos/diverkeith/379540273/
from web applicationsto single-page applications
evolution of web applications
urls
url fragments
websites
ajax
complex apps became popular
our amazing big brains
http://www.flickr.com/photos/pennstatelive/8972110324/
http://www.flickr.com/photos/indigotimbre/66258903/
back/forward buttons were patchedusing fragments to improve usability
the broken webwas eventually fixed
performance
we hack things to avoiddisrupting the workflow witha full page reload to fulfill anaction as a consequence of a
user interaction
single-page applications
support for multiple statesto react to user interaction
users can switch betweendifferent states in no time
... and doing so without breakingany of the core features of the web
(history, url, openness)
building single-pageapplications today
Mojito
EmberJS
AngularJSRendr
BackboneMeteor
DerbyJS
YAF
React
support a chain of user interactionsto fulfill an operation without
a full page refresh
patterns
MV* for the win
url driven web applications
conventions over configurations
libraries over frameworks
UI data bindings
the /#!/ugly/ url is fading out
initial rendering on the server
nodejs as the server runtime
server produces the initial state of the application, then passing the control to the browser to continue function
as a single page application
progressive enhancement,graceful degradation,
and performance as a feature
performance as a way toenhance user experience
only seconds of our users’ attention
modown is a set of libraries and components to powersingle page applications
modown is coming soon!
npmjs.org/search?q=modowngithub.com/yui/
github.com/yahoo/
Thanks
@caridy