El presente y futuro del desarrollo web y APIs RESTFlisol, ITToluca, Abril 2013
Web development
PHP
Ruby
Python
.NET
Java
Typical web development approach
Server side framework
The framework handles all the incoming http request and process them
Extract data from request and generates response to the user
The framework generates data representation mostly in html
We can use the framework to generate only data (JSON, XML)
Pros
Very simple to develop
All the app code in a single place
Unique development model
Well know patterns
Tons of libraries and framewoks out there
ConsThe server needs to handle several things
database connection
Failure and recovery
User session
render all the time the response to the users
frameworks limitations (user interface, scaling, adopting new technologies, support lacking)
Modern featuresMobile support
Asynchronous processing (server side & client side)
Content negotiation (JSON, XML, html, SOAP?)
View technologies independence (JavaScript, Template engines)
NoSql support (MongoDB, Redis, Cassandra, etc)
Development
Full stack
Specific stack
Cloud deployment
Is your framework friendly?
Beware ‘Full stack frameworks’
Do you really need a ‘full stack’ framework?
Are you using all the features provided by the full stack framework?
Sometimes we don’t need a full stack framework
ex. Simple app or service (REST)
Real life webapp, web traffic
Real life web system
• API: WebServices REST for information exchange
• Admin. Web application for internal use
• WebSite. A totally static HTML application built with Chaplin and several JavaScript microframewoks
WebApps architecture
Built your complete solution using several logical components
Each component has a single responsability
Built each component with the right tech stack
Apps
• API
• Typical Grails application, with no GSPs.
• Speaks only JSON
• Used by partners (remote services) and HipStore
• Admin
• Typical Grails application
Development enhancements
• Increased test cases in both Grails apps
• Spock
• Jasmine for JavaScript code
• Introduced Jenkins
• Jenkins Jobs to deploy automatically to QA & Production environments
• Bash shell scripts
HipStore
• Static HTML application built with Chaplin
• Chaplin is an architecture for JavaScript applications using the Backbone.js library
HipStore• Developed in CoffeeScript
• Uses PushState
• RequireJS (AMD Support)
• HandleBars (Template Engine)
• JQuery
• Underscore
• Twitter Bootstrap
• Build and packaged with Jake
HipStore
• Single Page Application
• Chaplin consumes JSON from the API to render the store items.
• Uses PushState to update the URL in the browser. Very useful for bookmarking and social media sharing, even for SEO.
Our approach
• Write to disk all the possible links in HipStore. Crazy?
• We use ZombieJS to navigate the website and then write to disk the generated HTML
• Put those static files (HTML) in the webserver document root
• The best cache ever
Why do this?
• When the user visit our website, the webserver will respond with completely static HTML, CSS, JavaScript files
• Very fast
• The user never hits the Tomcats, we reduce the load in the app servers.
• The webserver always responds very fast
ZombieJS
HTML harvesting
• The Node app receives the JSON message
• Navigates to HipStore with ZombieJS
• Executes the JavaScript (Chaplin app)
• Extracts the generated HTML with jQuery
• Saves to disk in the web server document root
Things to consider
• When an item in the Store is modified, we need to regenerate the appropriate HTML file only once.
• Then all the users will receive the same file
• The user only hits the Tomcat when really need it (CheckOut, Registration)
• When the user click in some action in the app, the interaction is handled by Chaplin controller if the browser supports JavaScript
• Remember in our website the content is almost static?
Results
• The load in our Web Servers was reduce a lot.
• The load in the database reduced a lot.
• The users can share the links.
• Store becomes very search engine friendly
Photo credits
http://flic.kr/p/7gerV8
http://flic.kr/p/5yZGvb
Recommended