Your SlideShare is downloading. ×
HTML5 Storage -Suggestions for Challenges    Client side storages, making  applications powerful, faster and             w...
Web Storage         Questions striking our mind??●   What is it?●   What we were using before it?●   Why should we use it ...
What is web storage?●   Client-side storag●   A standardized and native API that works    the same way on any browser.●   ...
What we were using before it?●   Cookies for client storage.●   Cookies sent in every HTTP request.●   Data sent unencrypt...
Why should we use it now?●   Data not included with every request, but    used only when asked for.●   Store large data(5M...
Types of Web Storage●   Local Storage    ○   Data stored is available to all scripts within        domain and persist even...
Are they sufficient enough for our                  application?●   Works fine with application with less client side data...
Browser Support for Web Storage●   IE 8.0 and 9.0●   Firefox 3.0, 3.5, 3.6 and 40●   Safari 4.0, 5.0 and 6.0●   Chrome 5.0...
What are its alternatives?●   Client side structured storage (database).●   WebSQL Database (Sqlite).●   Indexed DB.
Web SQL Database●   A real, relational database implementation    on the client(SQLite).●   No need to write browser depen...
Indexed DB●   Allows fast indexing and searching of objects.●   A NoSQL database works directly with    JavaScript Objects...
Browser Compatibility for both Databases●   WebSQL    ○   Chrome 4+    ○   Safari 4+    ○   Opera 11+    ○   iOs 5+    ○  ...
Application Cache??●   ApplicationCache- HTML5 interface for    caching.●   Offline browsing- users can navigate your    f...
Some details●   Works on one manifest file.●   Need to add mimetype to server.●   Three major sections    a. CACHE    b. N...
Browser Compatibility●   Application Cache (appCache)    ○   Chrome 4+    ○   Safari 4+    ○   Opera 11+    ○   Firefox 4+...
Discussion !!●   It seems that after using these things in    our application (as per required) we can    make application...
Experience sharing●   Offline Application requirement.●   Can be achieved.●   Required : no user dependency at all.●   Pro...
Experience sharing(Contd...)●   Ultimately "old is gold." Java Applet was    the solution for me.●   Still problem with so...
Some more problems.●   Theoretically speaking javascript works fine for    every browser.●   True, but sometimes behaviour...
Questions ?? Feel free to ask.
Thanks...
Upcoming SlideShare
Loading in...5
×

Html5 storage suggestions for challenges.pptx

351

Published on

HTML5 Storage - Suggestions for Challenges

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
351
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Html5 storage suggestions for challenges.pptx"

  1. 1. HTML5 Storage -Suggestions for Challenges Client side storages, making applications powerful, faster and work offline.
  2. 2. Web Storage Questions striking our mind??● What is it?● What we were using before it?● Why should we use it now?● Are they sufficient enough for our application?
  3. 3. What is web storage?● Client-side storag● A standardized and native API that works the same way on any browser.● Originally included in the Web Applications 1.0 specification, it has now its own specification called W3C Web Storage.
  4. 4. What we were using before it?● Cookies for client storage.● Cookies sent in every HTTP request.● Data sent unencrypted.● Size is very small (approximately 4KB).● Limited number of cookies stored per domain.
  5. 5. Why should we use it now?● Data not included with every request, but used only when asked for.● Store large data(5MB approx.), without affecting performance.● Data stored in key/value pairs and a page can only access data stored by itself.
  6. 6. Types of Web Storage● Local Storage ○ Data stored is available to all scripts within domain and persist even after browser is closed.● Session Storage ○ Data stored is available only to the script that stored the data and data is lost on closing of browser.
  7. 7. Are they sufficient enough for our application?● Works fine with application with less client side data storage and manipulation.● Complex to manipulate data using javaScript at client side when data is in bulk.● Due to manual manipulation, high chances of poor performance and browser compatibility
  8. 8. Browser Support for Web Storage● IE 8.0 and 9.0● Firefox 3.0, 3.5, 3.6 and 40● Safari 4.0, 5.0 and 6.0● Chrome 5.0, 6.0, 7.0, 8.0 and 9.0● Opera 10.5, 10.6 and 11.0● iOS Safari 3.2, 4.1 and 4.2● Android browser 2.2
  9. 9. What are its alternatives?● Client side structured storage (database).● WebSQL Database (Sqlite).● Indexed DB.
  10. 10. Web SQL Database● A real, relational database implementation on the client(SQLite).● No need to write browser dependent code.● Pure SQL Query.● But, the specification is depricated.● Need to transform JavaScript objects into relational schema.● Not object driven.
  11. 11. Indexed DB● Allows fast indexing and searching of objects.● A NoSQL database works directly with JavaScript Objects.● Works in asynchronous mode. This allows to work inside event driven module of JavaScript.● Cursor APIs, Key Range APIs, and Application Code for Query Mechanism● Need to write browser dependent code at some instance for smooth performance.
  12. 12. Browser Compatibility for both Databases● WebSQL ○ Chrome 4+ ○ Safari 4+ ○ Opera 11+ ○ iOs 5+ ○ Android 3+● Indexed DB ○ Chrome 11+ ○ Firefox 4+ ○ I.E 10
  13. 13. Application Cache??● ApplicationCache- HTML5 interface for caching.● Offline browsing- users can navigate your full site when theyre offline.● Speed-cached resources are local, and therefore load faster.● Reduced server load- the browser will only download resources from the server that have changed.
  14. 14. Some details● Works on one manifest file.● Need to add mimetype to server.● Three major sections a. CACHE b. NETWORK c. FALLBACK
  15. 15. Browser Compatibility● Application Cache (appCache) ○ Chrome 4+ ○ Safari 4+ ○ Opera 11+ ○ Firefox 4+ ○ I.E 10 ○ iOs 5+ ○ Android 3+ ○ Opera Mobile 11+
  16. 16. Discussion !!● It seems that after using these things in our application (as per required) we can make application work offline. ri8??● Your opinion ??
  17. 17. Experience sharing● Offline Application requirement.● Can be achieved.● Required : no user dependency at all.● Problem with the current technology !!
  18. 18. Experience sharing(Contd...)● Ultimately "old is gold." Java Applet was the solution for me.● Still problem with some cases.● Issue 1: registered as a bug in java official forum.● Issue 2: Cannot access the close of browser.
  19. 19. Some more problems.● Theoretically speaking javascript works fine for every browser.● True, but sometimes behaviour slightly differs.● Majority cases css issues with browsers.● Eg.Difference in look of gmail in chrome and firefox (have a look at scrollbar :) )
  20. 20. Questions ?? Feel free to ask.
  21. 21. Thanks...

×