Webappok és offline működés
Download as PPTX, PDF0 likes1,347 views
Developing offline webapps - the method.
Webappok és offline működés
- 1. Web app és offline működés
- 2. Miért? ● állandó elérhetőség ● felhasználói élmény ● sebesség ● energiatakarékos :)
- 3. Mikor? ● webalkalmazások ● single-page weboldalak ● statikus oldalak
- 4. Mikor ne? ● tartalomközpontú oldalak ● realtime alkalmazások
- 6. Hogyan? ● statikus elemek letárolása (html, js, css, jpg) ● dinamikus elemek letárolása (json, xml, csv) ● offline működés biztosítása
- 7. Statikus elemek ● browser cache ● service workers ● appcache
- 8. Statikus elemek ● browser cache - inkább ne alapozzunk rá ● service workers - nem eléggé támogatott ● app cache
- 9. app cache <html manifest="my.appcache"> CACHE MANIFEST # 2015-06-30 v1.0.0 CACHE: index.html script.js style.css NETWORK: login.php FALLBACK: /user/*.jpg img/user.jpg
- 10. app cache ● mindig a cache-ből húzza a fájlokat! ● csak a manifest fájl változásakor frissít ● manuálisan kell törölni ( swapCache() )
- 11. Dinamikus elemek ● localStorage ● indexedDB ● webSQL
- 12. Dinamikus elemek ● localStorage ● indexedDB - hiányos támogatottság ● webSQL - DEPRECATED! localForage ( github.com/mozilla/localForage )
- 13. localForage ● aszinkron működés ● mindig a megfelelő driver-t használja ● localforage.setItem('key','value').then(...) ● localforage.getItem('key', function(err, value) { alert(value) });
- 14. Offline vs online ● szinkronizálás ● api hívások megfelelő elszeparálása ● navigator.onLine - nem optimális ● OnlineJS ( https://github.com/PixelsCommander/OnlineJS )
- 16. Tapasztalatok ● már tervezéskor is szem előtt kell tartani ● az utólagos átalakítás mindig körülményes ● a localstorage véges! ● http://offlinefirst.org