Menu
I'm working on a web application, which acts pretty much like a native application for both iOS and Android. However the Javascript files (jQuery + my own) and the css file together are pretty large for mobile use, which make the app slow to load if the user doesn't have 3G enabled.
I therefore started to think about storing these files offline. However aside from the cache.manifest (which in my knowledge only kicks in when there is no internet connection to enable offline use) I have found no way to this. What I ideally would like to have is to check if the files are already cached/stored and if not, use them and then store them for the next time.
Is this possible? This would reduce the time to load my app a lot as the index file itself is very small. I'm still working on slimming down the files by optimizing but this would help a lot in the meantime.
Just to provide a bit more detail, sorry if I was unclear before.
I've started building this webapp using the HTML5 boilerplate, and my .htaccess file has all JS and CSS file headers with an expiration date of 1 year.
But it seems that opening the app from the iOS Home Screen loads the .js and .css files each time, as was the case for when they are not cached. Opening the website on a desktop or even the iOS Safari web browser does seem to cache the files the right way, as changes in the Javascript and CSS are only displayed after manually refreshing the page.
It seems like opening and closing and opening the web-app from the home screen is acting as a refresh, therefore loading the files each time, even though they are stored through a cache.manifest for offline use, and the files' expiration dates are set far into the future.
Thought I'd include cache headers for the files. These seem to be alright.
Cache-Control max-age=31536000, public
Expires Fri, 18 May 2012 17:34:20 GMT
Vary Accept-Encoding,User-Agent
Content-Encoding gzip Keep-Alive timeout=2, max=98
908
LocalStorage is a data storage type of web storage. This allows the JavaScript sites and apps to store and access the data without any expiration date. This means that the data will always be persisted and will not expire. So, data stored in the browser will be available even after closing the browser window.
In basic terms, local storage enables developers to store and retrieve data in the browser. It is critical to understand, though, that using localStorage as a database for your project is not a good practice, since data will be lost when the user clears the cache, among other things.
The localStorage mechanism provides a type of web storage object that lets you store and retrieve data in the browser. You can store and access data without expiration; the data will be available even after a visitor closes your site. You'll normally access localStorage using JavaScript.
You should investigate this option then: https://developer.apple.com/library/archive/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/OfflineApplicationCache/OfflineApplicationCache.html
145
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
