[html5] r7454 - [e] (0) Add an intro section that describes the 'prefer-online' feature a bit. F [...]
whatwg at whatwg.org
whatwg at whatwg.org
Thu Oct 11 16:02:10 PDT 2012
Author: ianh
Date: 2012-10-11 16:02:08 -0700 (Thu, 11 Oct 2012)
New Revision: 7454
Modified:
complete.html
index
source
Log:
[e] (0) Add an intro section that describes the 'prefer-online' feature a bit.
Fixing https://www.w3.org/Bugs/Public/show_bug.cgi?id=17651
Affected topics: HTML, Offline Web Applications
Modified: complete.html
===================================================================
--- complete.html 2012-10-11 19:55:47 UTC (rev 7453)
+++ complete.html 2012-10-11 23:02:08 UTC (rev 7454)
@@ -922,7 +922,8 @@
<ol>
<li><a href=#introduction-5><span class=secno>6.7.1 </span>Introduction</a>
<ol>
- <li><a href=#appcacheevents><span class=secno>6.7.1.1 </span>Event summary</a></ol></li>
+ <li><a href=#supporting-offline-caching-for-legacy-applications><span class=secno>6.7.1.1 </span>Supporting offline caching for legacy applications</a></li>
+ <li><a href=#appcacheevents><span class=secno>6.7.1.2 </span>Event summary</a></ol></li>
<li><a href=#appcache><span class=secno>6.7.2 </span>Application caches</a></li>
<li><a href=#manifests><span class=secno>6.7.3 </span>The cache manifest syntax</a>
<ol>
@@ -70770,7 +70771,6 @@
</li>
-<!--FORK--><!--APPCACHE-PREFER-ONLINE-->
<li>
<p>If the resource was not fetched from an <a href=#application-cache>application
@@ -72179,7 +72179,7 @@
<pre>/* clock.css */
output { font: 2em sans-serif; }</pre>
<pre>/* clock.js */
-setTimeout(function () {
+setInterval(function () {
document.getElementById('clock').value = new Date();
}, 1000);</pre>
@@ -72193,7 +72193,8 @@
<pre>CACHE MANIFEST
clock.html
clock.css
-clock.js</pre>
+clock.js
+</pre>
<p>With a small change to the HTML file, the manifest (served as
<code><a href=#text/cache-manifest>text/cache-manifest</a></code>) is linked to the application:</p>
@@ -72226,14 +72227,61 @@
before the user agent has updated it, and even applications served
over TLS can be made to work offline.</p>
-<!--(doesn't currently function)
- <p><a href="http://www.whatwg.org/demos/offline/clock/clock2.html">View this example online</a>.</p>
--->
+ <p><a href=http://www.whatwg.org/demos/offline/clock/live-demo/clock.html>View this example online</a>.</p>
- <h5 id=appcacheevents><span class=secno>6.7.1.1 </span>Event summary</h5>
+ <h5 id=supporting-offline-caching-for-legacy-applications><span class=secno>6.7.1.1 </span>Supporting offline caching for legacy applications</h5>
+ <p>The application cache feature works best if the application logic is separate from the
+ application and user data, with the logic (markup, scripts, style sheets, images, etc) listed in
+ the manifest and stored in the application cache, with a finite number of static HTML pages for
+ the application, and with the application and user data stored in Web Storage or a client-side
+ Indexed Database, updated dynamically using Web Sockets, <code>XMLHttpRequest</code>, server-sent
+ events, or some other similar mechanism.</p>
+
+ <p>This model results in a fast experience for the user: the application immediately loads, and
+ fresh data is obtained as fast as the network will allow it (possibly while stale data shows).</p>
+
+ <p>Legacy applications, however, tend to be designed so that the user data and the logic are mixed
+ together in the HTML, with each operation resulting in a new HTML page from the server.</p>
+
+ <div class=example>
+
+ <p>For example, consider a news application. The typical architecture of such an application,
+ when not using the application cache feature, is that the user fetches the main page, and the
+ server returns a dynamically-generated page with the current headlines and the user interface
+ logic mixed together.</p>
+
+ <p>A news application designed for the application cache feature, however, would instead have the
+ main page just consist of the logic, and would then have the main page fetch the data separately
+ from the server, e.g. using <code>XMLHttpRequest</code>.</p>
+
+ </div>
+
+ <p>The mixed-content model does not work well with the application cache feature: since the
+ content is cached, it would result in the user always seeing the stale data from the previous time
+ the cache was updated.</p>
+
+ <p>While there is no way to make the legacy model work as fast as the separated model, it
+ <em>can</em> at least be retrofitted for offline use using the <a href=#concept-appcache-mode-prefer-online title=concept-appcache-mode-prefer-online>prefer-online</a> <a href=#concept-appcache-mode title=concept-appcache-mode>application cache mode</a>. To do so, list all the static
+ resources used by the HTML page you want to have work offline in an <a href=#concept-appcache-manifest title=concept-appcache-manifest>application cache manifest</a>, use the <code title=attr-html-manifest><a href=#attr-html-manifest>manifest</a></code> attribute to select that manifest from the HTML file,
+ and then add the following line at the bottom of the manifest:</p>
+
+ <pre>SETTINGS:
+prefer-online
+NETWORK:
+*</pre>
+
+ <p>This causes the <a href=#application-cache>application cache</a> to only be used for <a href=#concept-appcache-master title=concept-appcache-master>master entries</a> when the user is offline, and causes the
+ application cache to be used as an atomic HTTP cache (essentially pinning resources listed in the
+ manifest), while allowing all resources not listed in the manifest to be accessed normally when
+ the user is online.</p>
+
+
+
+ <h5 id=appcacheevents><span class=secno>6.7.1.2 </span>Event summary</h5>
+
<p><i>This section is non-normative.</i></p>
<p>When the user visits a page that declares a manifest, the browser
Modified: index
===================================================================
--- index 2012-10-11 19:55:47 UTC (rev 7453)
+++ index 2012-10-11 23:02:08 UTC (rev 7454)
@@ -922,7 +922,8 @@
<ol>
<li><a href=#introduction-5><span class=secno>6.7.1 </span>Introduction</a>
<ol>
- <li><a href=#appcacheevents><span class=secno>6.7.1.1 </span>Event summary</a></ol></li>
+ <li><a href=#supporting-offline-caching-for-legacy-applications><span class=secno>6.7.1.1 </span>Supporting offline caching for legacy applications</a></li>
+ <li><a href=#appcacheevents><span class=secno>6.7.1.2 </span>Event summary</a></ol></li>
<li><a href=#appcache><span class=secno>6.7.2 </span>Application caches</a></li>
<li><a href=#manifests><span class=secno>6.7.3 </span>The cache manifest syntax</a>
<ol>
@@ -70770,7 +70771,6 @@
</li>
-<!--FORK--><!--APPCACHE-PREFER-ONLINE-->
<li>
<p>If the resource was not fetched from an <a href=#application-cache>application
@@ -72179,7 +72179,7 @@
<pre>/* clock.css */
output { font: 2em sans-serif; }</pre>
<pre>/* clock.js */
-setTimeout(function () {
+setInterval(function () {
document.getElementById('clock').value = new Date();
}, 1000);</pre>
@@ -72193,7 +72193,8 @@
<pre>CACHE MANIFEST
clock.html
clock.css
-clock.js</pre>
+clock.js
+</pre>
<p>With a small change to the HTML file, the manifest (served as
<code><a href=#text/cache-manifest>text/cache-manifest</a></code>) is linked to the application:</p>
@@ -72226,14 +72227,61 @@
before the user agent has updated it, and even applications served
over TLS can be made to work offline.</p>
-<!--(doesn't currently function)
- <p><a href="http://www.whatwg.org/demos/offline/clock/clock2.html">View this example online</a>.</p>
--->
+ <p><a href=http://www.whatwg.org/demos/offline/clock/live-demo/clock.html>View this example online</a>.</p>
- <h5 id=appcacheevents><span class=secno>6.7.1.1 </span>Event summary</h5>
+ <h5 id=supporting-offline-caching-for-legacy-applications><span class=secno>6.7.1.1 </span>Supporting offline caching for legacy applications</h5>
+ <p>The application cache feature works best if the application logic is separate from the
+ application and user data, with the logic (markup, scripts, style sheets, images, etc) listed in
+ the manifest and stored in the application cache, with a finite number of static HTML pages for
+ the application, and with the application and user data stored in Web Storage or a client-side
+ Indexed Database, updated dynamically using Web Sockets, <code>XMLHttpRequest</code>, server-sent
+ events, or some other similar mechanism.</p>
+
+ <p>This model results in a fast experience for the user: the application immediately loads, and
+ fresh data is obtained as fast as the network will allow it (possibly while stale data shows).</p>
+
+ <p>Legacy applications, however, tend to be designed so that the user data and the logic are mixed
+ together in the HTML, with each operation resulting in a new HTML page from the server.</p>
+
+ <div class=example>
+
+ <p>For example, consider a news application. The typical architecture of such an application,
+ when not using the application cache feature, is that the user fetches the main page, and the
+ server returns a dynamically-generated page with the current headlines and the user interface
+ logic mixed together.</p>
+
+ <p>A news application designed for the application cache feature, however, would instead have the
+ main page just consist of the logic, and would then have the main page fetch the data separately
+ from the server, e.g. using <code>XMLHttpRequest</code>.</p>
+
+ </div>
+
+ <p>The mixed-content model does not work well with the application cache feature: since the
+ content is cached, it would result in the user always seeing the stale data from the previous time
+ the cache was updated.</p>
+
+ <p>While there is no way to make the legacy model work as fast as the separated model, it
+ <em>can</em> at least be retrofitted for offline use using the <a href=#concept-appcache-mode-prefer-online title=concept-appcache-mode-prefer-online>prefer-online</a> <a href=#concept-appcache-mode title=concept-appcache-mode>application cache mode</a>. To do so, list all the static
+ resources used by the HTML page you want to have work offline in an <a href=#concept-appcache-manifest title=concept-appcache-manifest>application cache manifest</a>, use the <code title=attr-html-manifest><a href=#attr-html-manifest>manifest</a></code> attribute to select that manifest from the HTML file,
+ and then add the following line at the bottom of the manifest:</p>
+
+ <pre>SETTINGS:
+prefer-online
+NETWORK:
+*</pre>
+
+ <p>This causes the <a href=#application-cache>application cache</a> to only be used for <a href=#concept-appcache-master title=concept-appcache-master>master entries</a> when the user is offline, and causes the
+ application cache to be used as an atomic HTTP cache (essentially pinning resources listed in the
+ manifest), while allowing all resources not listed in the manifest to be accessed normally when
+ the user is online.</p>
+
+
+
+ <h5 id=appcacheevents><span class=secno>6.7.1.2 </span>Event summary</h5>
+
<p><i>This section is non-normative.</i></p>
<p>When the user visits a page that declares a manifest, the browser
Modified: source
===================================================================
--- source 2012-10-11 19:55:47 UTC (rev 7453)
+++ source 2012-10-11 23:02:08 UTC (rev 7454)
@@ -82834,7 +82834,6 @@
</li>
-<!--END w3c-html--><!--FORK--><!--APPCACHE-PREFER-ONLINE-->
<li>
<p>If the resource was not fetched from an <span>application
@@ -84497,12 +84496,64 @@
before the user agent has updated it, and even applications served
over TLS can be made to work offline.</p>
-<!--(doesn't currently function)
- <p><a href="http://www.whatwg.org/demos/offline/clock/clock2.html">View this example online</a>.</p>
--->
+ <p><a href="http://www.whatwg.org/demos/offline/clock/live-demo/clock.html">View this example online</a>.</p>
+ <h5>Supporting offline caching for legacy applications</h5>
+
+ <p>The application cache feature works best if the application logic is separate from the
+ application and user data, with the logic (markup, scripts, style sheets, images, etc) listed in
+ the manifest and stored in the application cache, with a finite number of static HTML pages for
+ the application, and with the application and user data stored in Web Storage or a client-side
+ Indexed Database, updated dynamically using Web Sockets, <code>XMLHttpRequest</code>, server-sent
+ events, or some other similar mechanism.</p>
+
+ <p>This model results in a fast experience for the user: the application immediately loads, and
+ fresh data is obtained as fast as the network will allow it (possibly while stale data shows).</p>
+
+ <p>Legacy applications, however, tend to be designed so that the user data and the logic are mixed
+ together in the HTML, with each operation resulting in a new HTML page from the server.</p>
+
+ <div class="example">
+
+ <p>For example, consider a news application. The typical architecture of such an application,
+ when not using the application cache feature, is that the user fetches the main page, and the
+ server returns a dynamically-generated page with the current headlines and the user interface
+ logic mixed together.</p>
+
+ <p>A news application designed for the application cache feature, however, would instead have the
+ main page just consist of the logic, and would then have the main page fetch the data separately
+ from the server, e.g. using <code>XMLHttpRequest</code>.</p>
+
+ </div>
+
+ <p>The mixed-content model does not work well with the application cache feature: since the
+ content is cached, it would result in the user always seeing the stale data from the previous time
+ the cache was updated.</p>
+
+ <p>While there is no way to make the legacy model work as fast as the separated model, it
+ <em>can</em> at least be retrofitted for offline use using the <span
+ title="concept-appcache-mode-prefer-online">prefer-online</span> <span
+ title="concept-appcache-mode">application cache mode</span>. To do so, list all the static
+ resources used by the HTML page you want to have work offline in an <span
+ title="concept-appcache-manifest">application cache manifest</span>, use the <code
+ title="attr-html-manifest">manifest</code> attribute to select that manifest from the HTML file,
+ and then add the following line at the bottom of the manifest:</p>
+
+ <pre>SETTINGS:
+prefer-online
+NETWORK:
+*</pre>
+
+ <p>This causes the <span>application cache</span> to only be used for <span
+ title="concept-appcache-master">master entries</span> when the user is offline, and causes the
+ application cache to be used as an atomic HTTP cache (essentially pinning resources listed in the
+ manifest), while allowing all resources not listed in the manifest to be accessed normally when
+ the user is online.</p>
+
+
+
<h5 id="appcacheevents">Event summary</h5>
<!--END dev-html--><p><i>This section is non-normative.</i></p><!--START dev-html-->
More information about the Commit-Watchers
mailing list