How To Make Ultra-Fast Online Store?

Answer is simple: Make it RIA! (Rich Internet Application)

 

Working on the latest project - a web-module for customer's CRM, I was looking for a way to quickly search and filter the data (which is not anticipated to increase by more than 500 per year). I made 10,000 demo records in the database and worked with them. The first thing we did - it's AJAX search - quickly, does not reload page canvas -, in general, suitable.

However, I've got another idea...

Why not to download the data as a JSON array and work with it on the Client-Side?

After testing - as a result, the weight of 10k entries - 1mb, but transfering size from server - just 80kb (gzip 9 nginx). Search & Filter speed through the array in cache (e.g. RAM) - less than 10-30ms. And another big plus - JSON files are cached by browser. It means when you reload webpage data is reading from the cache immediately, browser just a request if-Modified-Since header and receives the 304 response.

Simultaneously, I was looking for a new PC components in the online store, comparing prices etc. In most online stores, applying a filter reloads a webpage - that's very slow.

I decided to try to apply the concept of downloading and data processing (functionality) on the Client-Side.
Of course, preload all the data is not necessary :) But, as far as entering into sections - possible - as implemented in the Demo.

You can ask a question: What to do if one record changed? Reload all data? - Actually we can make data parts from frequent to rare changing.



Concept Demo

To "feel" the difference you need to do 2 steps:
1. Go to the original Online Store Newegg, play around with sorting, filters, etc. - Subjectively, remember the speed FROM response TO display data.
2. Compare speed with Demo of Online Store (RIA) with 1500+ Items
(functionality is implemented entirely on the Client-Side using Javascript+jQuery. Nginx serves only static. No php, apache, mysql, etc.).

Subjectively, the speed of the browsers from "ultra-fast" to "normal": Chrome, Opera 10.5, FF 3, IE8 / 7.

Unfortunaly, IEs Javascript Engine so slow, I recommend to do not use them to view the Demo.

Of course, this realization of RIA is not for large Online Stores and it's not a replacement for the standard model of request-response-generated pages, primarily because of the search engines and SEO, but it can be activated in case of using modern browser by visitors.

Conclusions

If you have a small / medium Online Store, you may well try to add Client-Side RIA-Functionality.

Yes, this additional workload, almost dub functional Server-Side dynamics on the Client-Side.

RIA-"Layer" is not a necessity, It's a demonstration of using cutting-edge technologies. If my favorite computer Online Store let me the ability to use them in the RIA-model, their shares would have grown greatly in my eyes :-)

As you can see, many mastodons of online business are making versions of their services for the iPhone and iPad - development under this platforms requires heavy investments (15-50k to 500k $$). So why not to do RIA-Layer for your progressive visitors? 

Is it worth it? I am sure your visitors answer - Absolutely!

This Demo - just a demonstration of the concept. A lot of things are NOT implemented, but can be implemented.