Pros and Cons of developing a Thick Clientside App
-
Upload
ravi-teja -
Category
Technology
-
view
5.133 -
download
2
description
Transcript of Pros and Cons of developing a Thick Clientside App
Thick Client-side AppPros and Cons of developing a
Raviteja DoddaCo-Founder, Pipal Tech Ventures/DelightCircle
[email protected], Facebook - @raviteja2007
www.DelightCircle.com
Sep 15th 2012
What is
Clientside
Templating ?
What is Clientside Templating?
• Server sends client templates, along with ‘application code’.
• Application code initializes the view
• As user interacts with the view, requests/responses happen between client and the server in JSON.
• Application code updates the view by applying data to the templates.
What are the downsides of Serverside
Rendering?
Coupling
Server-side Load
• Infrastructure• Caching• Dynamic-pages can be expensive.
A Post on Facebook + comment
9.1 KB of Markup
• Transfer of Data + markup for every request
Not Efficient
Leading to
• Dumb Clients
• Lag
• Unoptimal UX
• Ugly Clientside Code
Pros of a
Thick Client
Good Architecture
Decoupled Design
API’s
API based Multiplatform approach
API
Mobile App Web Mobile Web ????
Leading to
• Better Structure
• Separation of Responsibilities
• Modular caching
• More static assets
• Simplicity and Power
Template Engine benefits
• Readable
• Maintainable
• Usable
Cons of a Thick Client ?
• Complexity
• Performance varies with device
• A build process is generally required
• More state management
• Indexing pages to Search Engines.
What’s the sweet spot then ?
100% Serverside 100% Clientside
Serverside rendering+ AJAX HTML
Mostly Serverside rendering + JSON viaAJAX with Clientsidetemplates
Only render layoutwith client, everythingelse rendered with JS
Hybrid model
Twitter, Facebook, Google all render HTML server side for initial page load.
Reduces the number of requests
Shares rendering load between clientside/serverside
How did we develop DelightCircle webapp ?
UWSGI on AWS
Components
• API Platform approach – our webapp is just another client.
• Backbone.js – Clientside MVC – ProvenLinkedIn Mobile, Foursquare, Do.com,
Groupon, Basecamp mobile, etc.
• Mustache.js – for clientside templating
• JQuery – Of course for DOM manipulation, and ICanHaz.js – which works well with both JQuery and mustache.
Crossing Domains• How to communicate between delightcircle.com and api.delightcircle.com
• An iframe from api.delightcircle.com is embedded in delightcircle.com webpages.
• Through the magic of same-origin policy, this technique enables inter-frame communication, while still allowing the iframe to make AJAX requests to its original domain, api.delightcircle.com
• When we need to make api calls, we just need to use iframe’s XMLHttpRequest object from delightcircle.com pages
Download for your Mobile
Scan QR code
DelightCircle is available on Android, Blackberry and iPhone
Search for ‘DelightCircle’ in App Stores
Visit http://DelightCircle.com
Other Phones ? SMS ‘@delight’ to 92431-92431