Upload
atwix
View
155
Download
3
Embed Size (px)
Citation preview
JSON Angular Magento
Vinci Rufuswww.neevtech.com
@areai51
Heart of any Web App
Web Server’s Workload
Web server
&Database
Pull up the Page
Read the XML
Query the
DatabaseBuild the page on the fly
Render the page
Serve Assets &
Media
Performance & Scaling Mantra
• Reduce stress on the Web server & DB
– Clones [Multiple App Servers & DB Master Slaves]
– Caching [Fullpage Caching / Memcache]
– Varnish
– Move the workload to the Client Side
Empower the Browser
• Browsers are Powerful but under utilized.
• Offload mundane tasks to the Client Side.
• Go Back to the Server only when needed.
De-Couple your App
• Server spits out JSON• Presentation Layer Sits on the Client Side. • JavaScript parses the JSON data and
populates the dynamic content blocks, images are pulled from S3 / Cloudfront.
In Magento’s Context
• JSON output contains Product Catalog along with necessary attributes.
• Layered Navigation, Filters, Sorting, keyword Search done 100% Client side on JSON data.
• Product Inventory check is an AJAX request to the server.
• Add to Cart, Checkout are direct requests to the server.
• For Recently Viewed Products, use Local Storage or IndexedDB.
Web App
Browser
Scalable Architecture
Magento
RESTWeb services
RDSS3
EC2
Web App
Web App
Browser
Insanely Scalable Architecture
Server
RDSS3
EC2
JSONJSON
Media / Images Folder
Web App
Performance Metrics
Webpagetest.org
Pingdom.com
YSlow
New Possibilities
• Windows 8 and Mac OS• Native Tablet Apps• Touch Screen Kiosks