
<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>onezerozeroone &#187; html</title>
	<atom:link href="http://www.onezerozeroone.com/tag/html/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.onezerozeroone.com</link>
	<description>javascript, web programming and other daily stuff</description>
	<lastBuildDate>Sat, 14 Jul 2012 09:33:59 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<item>
		<title>App-cache tips, tricks and thoughts</title>
		<link>http://www.onezerozeroone.com/javascript/app-cache-tips-tricks-and-thoughts/</link>
		<comments>http://www.onezerozeroone.com/javascript/app-cache-tips-tricks-and-thoughts/#comments</comments>
		<pubDate>Thu, 24 Mar 2011 22:26:51 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[html]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[app-cache]]></category>
		<category><![CDATA[manifest]]></category>

		<guid isPermaLink="false">http://www.onezerozeroone.com/?p=147</guid>
		<description><![CDATA[After working with a project where we had to make the entire site available offline with app-cache, we found couple of interesting things. These are things that are quite good to have in mind when you are planing to use app-cache, either for offline access or just to speed op loading time. Different browsers First [...]]]></description>
			<content:encoded><![CDATA[<p><a title="Offline" href="http://www.flickr.com/photos/89165847@N00/5110795452/" target="_blank"><img src="http://farm2.static.flickr.com/1426/5110795452_bcf5ebc576.jpg" border="0" alt="Offline" /></a><br />
After working with a project where we had to make the entire site available offline with app-cache, we found couple of interesting things. These are things that are quite good to have in mind when you are planing to use app-cache, either for offline access or just to speed op loading time.</p>
<h3>Different browsers</h3>
<ul>
<li>First of, as always, different browsers do different things. For example, Firefox comes with a default setting of 50MB of app-cache size. This<br />
is quite ok and its very easy to change. Chrome, on the contrary, comes with 5MB and no easy way to change the size.</li>
<li>This means that if you plan to have a complete site offline, with lots of media, Chrome (and Safari) will break if you try to load to much.</li>
<li>In our case we had to make a version that loaded swf and video files for Firefox and a version for Chrome without big files.</li>
</ul>
<h3>Error handling sucks</h3>
<ul>
<li>An event is triggered when an error occurs while checking or downloading the manifest or its content. But information on what error is another story. So if, for example, you suddenly are offline, the browser might try to get the manifest file and get an error when it cant download it. This error triggers the event error, but no info on what error it is.</li>
<li>Also, if one file isn’t available when the manifest links are downloaded to be cached, the complete caching process is stopped. This means that its quite important that you know that your manifest list is ok and all files respond. This happens at least in chrome (to help out, I created a small tool to check all files in a manifest file. check it our here (VERY BETA) <a href="http://www.onezerozeroone.com/manifest-o-checker/">http://www.onezerozeroone.com/manifest-o-checker/</a>)</li>
<li>If a site tries to download to much in Chrome, the cache process breaks. In Firefox you get a warning that its surpassing the limit, but nothing more.</li>
</ul>
<h3>Chrome gives you some progress info, Firefox doesn’t.</h3>
<ul>
<li>When Chrome is downloading the files to be cached, it gives you the number of files it has downloaded (event.loaded) as well as how many it is supposed to download (event.total).</li>
</ul>
<h3>Debugging is a little more tricky</h3>
<ul>
<li>Since your cached files won’t upload until you change the manifest, you need either to have some kind of auto update on the manifest file, or change something in it (remember that just a text change, even a comment, is enough to trigger an update). It makes debugging have one more step you have to do everytime you want to try something.</li>
<li>Also, you have to wait until all files are cached and then reload the page to mae the changes appear, which means you have one more step to take into account.</li>
</ul>
<p><br/><br/></p>
<p>
So there you have it. When you make it work, it’s amazing what you can do to speed up things, or make a complete site available offline. It also helps out if you are doing mobile apps and you want to have the complete interface cached, which makes the site become more app-like.
</p>
<p>Just remember the details above and it will make your programming life just a little easier.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.onezerozeroone.com/javascript/app-cache-tips-tricks-and-thoughts/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
