Best practice for offline website in iOS

Question

I'm building an app that requires downloading a lot of html5 content. Essentially it works similar to the magazine apps you see for iPad, except instead of using images, it will use UIWebViews and HTML.

My question is what would be the best method for storing this. I was thinking either a downloaded zip file that gets unzipped into the bundle and contains the html files, images, css, etc. or putting all the html in the database and just having the images, css, videos, etc. downloaded and put in the bundle.

Some considerations:

Many links will be local to the device, but some will be to outside sites.

I will need to be able to do full text search on all html content.

The size of the content will vary.

On a side note, I would love to be pointed in the right direction as far as setting up paging with UIWebViews. Potentially a lot of UIWebViews.

Thanks, Brandon

Answer 1

This question can be pretty easily answered by looking at the first and best HTML5 overview book out right now... And the best part it is published under the CC license.

http://diveintohtml5.ep.io/offline.html <- is a whole chapter on cacheing webapps and is a great jumping off point for your application.

It's not difficult, and it's cutting edge, what's cooler than that.

If you are really serious about getting this application to work offline well then it really shouldn't be summarized beyond the link.

Although I do have more resources that were at the bottom of that chapter

Standards:

• Offline web applications in the HTML5 specification

Browser vendor documentation:

• Offline resources in Firefox
• HTML5 offline application cache, part of the Safari client-side storage and offline applications programming guide

Tutorials and demos:

• Gmail for mobile HTML5 series: using appcache to launch offline - part 1
• Gmail for mobile HTML5 series: using appcache to launch offline - part 2
• Gmail for mobile HTML5 series: using appcache to launch offline - part 3
• Debugging HTML5 offline application cache
• an HTML5 offline image editor and uploader application
• 20 Things I Learned About Browsers and the Web, an advanced demo that uses the application cache and other HTML5 techniques

Answer 2

You could download first an file that reflects the structure of the website images, css, htmls.

Then you parse this file and start download each file and save them to documents directory (you don't save in database because you could have big images and that will be slow you could save the paths of them). Afther thad just do an request to the local html.

Edit: You can catch the request in the webView delegate and see if it is internal or external

webView:shouldStartLoadWithRequest:navigationType: Sent before a web view begins loading content.

• (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType

UIWebViewDelegate Protocol Reference

Answer 3

I haven't used it myself, but you may want to take a look at ASIHTTPRequest's ASIWebPageRequest class.