Creating Data Driven HTML5 Applications
Download as PPTX, PDF1 like4,176 views
Gil Fink gave a presentation on creating data-driven HTML5 applications. He discussed storing data in the client-side using HTML5 technologies like Web Storage, AppCache, and IndexedDB. He demonstrated how to use these storage APIs and emphasized that they allow creating offline web applications and decrease server load. Fink concluded that developers can start relying on client-side storages and highlighted resources for learning more about these HTML5 APIs.
Creating Data Driven HTML5 Applications
- 1. Gil Fink Senior Architect SELA Creating Data- Driven HTML5 Applications
- 2. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS AGENDA HTML5: Recap Storing Data in the Client-Side Q&A Summary
- 3. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS HTML5: RECAP HTML5 ~= HTML + CSS3 + JavaScript API The future of the web Still under development Supposed to be ready at ~2014
- 4. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WHAT’S UNDER THE HTML5 UMBRELLA?
- 5. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS STORING DATA IN THE CLIENT-SIDE
- 6. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS DEMO Using HTML5 Storages and AppCache
- 7. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WEB STORAGE Key/value storage Simple API sessionStorage Data is accessible to any page from the same site opened in that window localStorage Data spans multiple windows and lasts beyond the current session
- 8. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS APPCACHE Create offline web applications Use a manifest file to configure the cache Introduces API to interact with cache events and the navigator.onLine property
- 9. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS INDEXEDDB Advanced key/value data management Made of records holding simple values and hierarchical objects Enables Storage of large numbers of objects locally in the browser Fast insertion and extraction from the store Asynchronous/Synchronous API
- 10. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WEB APPLICATION APIS SUPPORT – WEB STORAGE http://caniuse.com
- 11. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WEB APPLICATION APIS SUPPORT – OFFLINE WEB APPLICATIONS http://caniuse.com
- 12. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WEB APPLICATION APIS SUPPORT – INDEXEDDB http://caniuse.com
- 13. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WHAT WE SAW Web Storage AppCache IndexedDB We didn’t cover other storage APIs such as File API FileSystem API
- 14. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS QUESTIONS
- 15. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS SUMMARY You can start depending on client-side storages Will help you: To decrease the load on server-side and databases To create offline web apps
- 16. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS RESOURCES Session slide deck and demos – http://sdrv.ms/1ekp929 API specs – http://www.w3.org/TR/webstorage/ http://www.w3.org/TR/IndexedDB/ http://dev.w3.org/html5/spec/offline.html My Website – http://www.gilfink.net Follow me on Twitter – @gilfink
- 17. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS THANK YOU Gil Fink Senior Architect gilf@sela.co.il @gilfink http://www.gilfink.net