Search jQuery

jQuery Forum

For better offline support, wrap the hijax call in changePage with a localStorage check

in jQuery Mobile • 11 years ago

I'm building an app in jQuery mobile, and I have a need for fairly robust offline support, with a good amount of data. What this means is that just adding page divs for all of the possible content is infeasible.

What I've implemented (in a messy fashion) is a wrapper around the ajax call in changePage that will look to see if a key exists in localStorage with the page URL we're about to retrieve (along with a key prefix). If it finds it, it uses that HTML rather than trying to fetch it.

While my implementation is pretty specific to my need, I think a generalized version of this could be useful in jQuery mobile. I came up with this solution after hitting storage limits with the HTML5 manifest file, which seems to be more for handling static assets than it is for actual HTML.

Any thoughts appreciated!

Replies(5)

rsaccon

Re: For better offline support, wrap the hijax call in changePage with a localStorage check

11 years ago

I am also experimenting with offline support, I have actually integrated with persistencejs (WebSQL wrapper), which provides even two-way sync. It is very alpha now, but there is a working demo at the github repo.

umbrae

Re: Re: For better offline support, wrap the hijax call in changePage with a localStorage check

11 years ago

Interesting! Thanks for the link.

arknoll

Re: For better offline support, wrap the hijax call in changePage with a localStorage check

11 years ago

Aren't there the same storage limits with localstorage as there is with the manifest file? (e.g., 5MB). I am generally doing the same thing as you except I am searching a JSON object (The key is the url), and then serving up the page like that.

This has a couple of benefits that I have seen.

1. You can create/update your JSON object either with a CRON job or when a specific event occurs on your server.

and

2. You don't have the overhead of creating a database/inserting rows as you would with WebSQL.

umbrae

Re: Re: For better offline support, wrap the hijax call in changePage with a localStorage check

11 years ago

Well, there are two things differences that I'm aware of:

1. When you reach the limit in localStorage, the browser (Mobile Safari, in my case), will ask to allocate more space. So there's no hard limit here - but that's not true with the manifest file. If it's greater than the limit, it just fails.

2. I'm already using manifest storage for static assets, so being able to utilize both means there's more space available overall.

I will say that I'm only aware of difference #1 second hand - I haven't seen it myself but I've heard that it's the case.

arknoll

Re: For better offline support, wrap the hijax call in changePage with a localStorage check

11 years ago

I've been trying to research (with no real luck) whether the cache size limits are cumulative over a domain between localStorage, sessionStorage, and the cache manifest. (I believe they are for the first two, not sure if using the manifest cuts into the quota for local/session storage).

But, as for your first point, in my situation, it would not be a tenable result to prompt a user to increase the local storage limit another 5MB. (too unpredictable which button they will push and severely degrades the user experience).

Note: I came to this conclusion after writing my application first using webSQL. There was both a noticeable delay when inserting the rows into the local db (especially with older iOS devices) and the size limit prompting was an issue. There is no such delay when using a json variable once the variable is loaded into the cache.

In addition, we tried to reconcile the issue of legacy support for localStorage on mobile devices and came to this conclusion. If the mobile device did not support localStorage the default would likely have to be the normal page lookup via ajax. So, you wouldn't get the speed increase between page change. However, even if the legacy mobile device didn't support localStorage (or cache manifest for that matter) they would still likely support javascript. If the pages are served up via the JSON variable you would still get the fast page change and would only give up the offline mode.

Top Reply

Response title

Attachments

jQuery Forum

For better offline support, wrap the hijax call in changePage with a localStorage check

Replies(5)

Re: For better offline support, wrap the hijax call in changePage with a localStorage check

Re: Re: For better offline support, wrap the hijax call in changePage with a localStorage check

Re: For better offline support, wrap the hijax call in changePage with a localStorage check

Re: Re: For better offline support, wrap the hijax call in changePage with a localStorage check

Re: For better offline support, wrap the hijax call in changePage with a localStorage check

Statistics

Tags

Actions