Skip to content

Commit

Permalink
[giow] (2) Flesh out how rendering happens in the event loop. This al…
Browse files Browse the repository at this point in the history
…so defines requestAnimationFrame() and obsoletes the 'Timing control for script-based animations' spec (by request of that spec's editors)

Fixing https://www.w3.org/Bugs/Public/show_bug.cgi?id=26839
Affected topics: DOM APIs, HTML

git-svn-id: https://svn.whatwg.org/webapps@8849 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
Hixie committed Nov 19, 2014
1 parent 0f7d1b0 commit 6808d54
Show file tree
Hide file tree
Showing 3 changed files with 384 additions and 97 deletions.
162 changes: 119 additions & 43 deletions complete.html

Large diffs are not rendered by default.

162 changes: 119 additions & 43 deletions index

Large diffs are not rendered by default.

157 changes: 146 additions & 11 deletions source
Expand Up @@ -3131,6 +3131,11 @@ a.setAttribute('href', 'http://example.com/'); // change the content attribute d
<li>The <dfn>fully exit fullscreen</dfn> algorithm</li>
</ul>

<p>The <cite>High Resolution Time</cite> specification provides the
<dfn><code>Performance</code></dfn> object's <dfn><code data-x="dom-Performance-now"
data-x-href="http://www.w3.org/TR/hr-time/#dom-performance-now">now()</code></dfn> method. <ref
spec=HRT></p>

</dd>


Expand Down Expand Up @@ -77719,6 +77724,9 @@ dictionary <dfn>DragEventInit</dfn> : <span>MouseEventInit</span> {
void <span data-x="dom-print">print</span>();
any <span data-x="dom-showModalDialog">showModalDialog</span>(DOMString url, optional any argument<!--, optional DOMString features-->); // deprecated

long <span data-x="dom-window-requestAnimationFrame">requestAnimationFrame</span>(<span>FrameRequestCallback</span> callback);
void <span data-x="dom-window-cancelAnimationFrame">cancelAnimationFrame</span>(long handle);

void <span data-x="dom-window-postMessage">postMessage</span>(any message, DOMString targetOrigin, optional sequence&lt;<span>Transferable</span>&gt; transfer);
};
<span>Window</span> implements <span>GlobalEventHandlers</span>;
Expand Down Expand Up @@ -85102,14 +85110,17 @@ interface <dfn>NavigatorOnLine</dfn> {

<h6>Runtime script errors in documents</h6>

<p>Whenever an uncaught runtime script error occurs in one of the scripts associated with a
<code>Document</code>, the user agent must <span>report the error</span> for the relevant <span
<p>When the user agent is to <dfn data-x="report the exception">report an exception</dfn>
<var>E</var>, the user agent must <span>report the error</span> for the relevant <span
data-x="concept-script">script</span>, with the problematic position (line number and column
number) in the resource containing the script, using the <span>global object</span> specified by
the script's <span>settings object</span> as the target. If the error is still <i
data-x="concept-error-nothandled">not handled</i> after this, then the error may be reported to
the user.</p>

<p>When an exception is thrown during the execution of one of the scripts associated with a
<code>Document</code>, and the exception is not caught, the user agent must <span>report the
exception</span>.</p>


<h6>The <code>ErrorEvent</code> interface</h6>
Expand Down Expand Up @@ -85296,7 +85307,7 @@ dictionary <dfn>ErrorEventInit</dfn> : <span>EventInit</span> {
agent must release the <span>storage mutex</span>.</p>


<h5>Processing model</h5>
<h5>Processing model</h5> <!-- EVENT LOOP -->

<p>An <span>event loop</span> must continually run through the following steps for as long as it
exists:</p>
Expand Down Expand Up @@ -85337,19 +85348,75 @@ dictionary <dfn>ErrorEventInit</dfn> : <span>EventInit</span> {

<p><i>Update the rendering</i>: If this <span>event loop</span> is a <span>browsing
context</span> <span>event loop</span> (as opposed to a <a href="#workers">worker</a>
<span>event loop</span>), then, if necessary, run the following steps.</p>
<span>event loop</span>), then, if necessary, run the following substeps.</p>

<p class="note">Whether these steps are necessary depends on the update frequency. For example,
if the browser is attempting to achieve a 60 Hz refresh rate, then these steps are only
necessary every 60th of a second (about 16.7ms). If the browser finds that the page is not able
to sustain this rate, it might drop to a more sustainable 30Hz, rather than occasionally
dropping frames. This specification does not mandate any particular model for when to update the
rendering.</p>

<ol>

<li><p>Update the rendering or user interface of any <code>Document</code> or <span>browsing
context</span> to reflect the current state.</p></li>
<li><p>Let <var>now</var> be the value that would be returned by the <code>Performance</code>
object's <code data-x="dom-Performance-now">now()</code> method. <ref spec=HRT></p>

</ol>
<li>

<p class="note">Whether these steps are necessary depends on the update frequency. For example,
if the browser is attempting to achieve a 60 Hz refresh rate, then these steps are only
necessary every 60th of a second (about 16.7ms). This specification does not mandate any
particular model for when to update the rendering.</p>
<p>Let <var>docs</var> be the list of <code>Document</code> objects associated with the
<span>event loop</span> in question, sorted arbitrarily except that the following conditions
must be met:</p>

<ul>

<li><p>Any <code>Document</code> <var>B</var> that is <span>nested through</span> a
<code>Document</code> <var>A</var> must be listed after <var>A</var> in the list.</p></li>

<li><p>If there are two documents <var>A</var> and <var>B</var> whose <span data-x="browsing
context">browsing contexts</span> are both <span data-x="nested browsing context">nested
browsing contexts</span> and their <span data-x="browsing context container">browsing context
containers</span> are both elements in the same <code>Document</code> <var>C</var>, then the
order of <var>A</var> and <var>B</var> in the list must match the relative <span>tree
order</span> of their respective <span data-x="browsing context container">browsing context
containers</span> in <var>C</var>.</p></li>

</ul>

<p>In the steps below that iterate over <var>docs</var>, each <code>Document</code> must be
processed in the order it is found in the list.</p>

</li>

<li><p>For each <code>Document</code> in <var>docs</var>, <dfn>run the resize steps</dfn> for
that <code>Document</code>, passing in <var>now</var> as the timestamp. <ref
spec="CSSOMVIEW"/></p></li>

<li><p>For each <code>Document</code> in <var>docs</var>, <dfn>run the scroll steps</dfn> for
that <code>Document</code>, passing in <var>now</var> as the timestamp. <ref
spec="CSSOMVIEW"/></p></li>

<li><p>For each <code>Document</code> in <var>docs</var>, <dfn>evaluate media queries and
report changes</dfn> for that <code>Document</code>, passing in <var>now</var> as the
timestamp. <ref spec="CSSOMVIEW"/></p></li>

<li><p>For each <code>Document</code> in <var>docs</var>, <dfn>run CSS animations and send
events</dfn> for that <code>Document</code>, passing in <var>now</var> as the timestamp. <ref
spec="CSSANIMATIONS"/></p></li>

<li><p>For each <code>Document</code> in <var>docs</var>, <dfn>run the fullscreen rendering
steps</dfn> for that <code>Document</code>, passing in <var>now</var> as the timestamp. <ref
spec="FULLSCREEN"/></p></li>

<li><p>For each <code>Document</code> in <var>docs</var>, <span>run the animation frame
callbacks</span> for that <code>Document</code>, passing in <var>now</var> as the
timestamp.</p></li>

<li><p>For each <code>Document</code> in <var>docs</var>, update the rendering or user
interface of that <code>Document</code> and its <span>browsing context</span> to reflect the
current state.</p></li>

</ol>

</li>

Expand Down Expand Up @@ -89860,6 +89927,70 @@ loadMySprites().then(runDemo);</pre>

<!--TOPIC:DOM APIs-->

<h3>Animation Frames</h3>

<p>Each <code>Document</code> has a <dfn>list of animation frame callbacks</dfn>, which must be
initially empty, and an <dfn>animation frame callback identifier</dfn>, which is a number which
must initially be zero.</p>

<p>When the <dfn><code
data-x="dom-window-requestAnimationFrame">requestAnimationFrame()</code></dfn> method is called,
the user agent must run the following steps:</p>

<ol>

<li><p>Let <var>document</var> be <span data-x="concept-document-window">the
<code>Window</code> object's <code>Document</code> object</span>.</p></li>

<li><p>Increment <var>document</var>'s <span>animation frame callback identifier</span> by
one.</p></li>

<li><p>Append the method's argument to <var>document</var>'s <span>list of animation frame
callbacks</span>, associated with <var>document</var>'s <span>animation frame callback
identifier</span>'s current value.</p></li>

<li><p>Return <var>document</var>'s <span>animation frame callback identifier</span>'s current
value.</p></li>

</ol>

<p>When the <dfn><code
data-x="dom-window-cancelAnimationFrame">cancelAnimationFrame()</code></dfn> method is called,
the user agent must run the following steps:</p>

<ol>

<li><p>Let <var>document</var> be <span data-x="concept-document-window">the
<code>Window</code> object's <code>Document</code> object</span>.</p></li>

<li><p>Find the entry in <var>document</var>'s <span>list of animation frame callbacks</span>
that is associated with the value given by the method's argument.</p></li>

<li><p>If there is such an entry, remove it from <var>document</var>'s <span>list of animation
frame callbacks</span>.</p></li>

</ol>

<p>When the user agent is to <dfn>run the animation frame callbacks</dfn> for a
<code>Document</code> <var>doc</var> with a timestamp <var>now</var>, it must run the following
steps:</p>

<ol>

<li><p>Let <var>callbacks</var> be a list of the entries in <var>doc</var>'s <span>list of
animation frame callbacks</span>, in the order in which they were added to the list.</p></li>

<li><p>Set <var>doc</var>'s <span>list of animation frame callbacks</span> to the empty
list.</p></li>

<li><p>For each entry in <var>callbacks</var>, in order: invoke the callback, passing
<var>now</var> as the only argument, and if an exception is thrown, <span>report the
exception</span>. <ref spec=WEBIDL></p></li>

</ol>



<h2 split-filename="comms" id="comms">Communication</h2>

<h3>The <code>MessageEvent</code> interfaces</h3>
Expand Down Expand Up @@ -115862,6 +115993,10 @@ INSERT INTERFACES HERE
<dt id="refsHPAAIG">[HPAAIG]</dt>
<dd><cite><a href="http://dev.w3.org/html5/html-api-map/overview.html">HTML to Platform Accessibility APIs Implementation Guide</a></cite>. W3C.</dd>

<dt id="refsHRT">[HRT]</dt>
<dd><cite><a href="https://dvcs.w3.org/hg/webperf/raw-file/tip/specs/HighResolutionTime/Overview.html">High Resolution Time</a></cite>, J. Mann. W3C.</dd>
<!-- or http://www.w3.org/TR/hr-time/ ? it's highly unclear what URL is the one that would have the latest changes -->

<dt id="refsHTML">[HTML]</dt>
<dd><cite><a href="https://html.spec.whatwg.org/">HTML</a></cite>, I. Hickson. WHATWG.</dd>

Expand Down

0 comments on commit 6808d54

Please sign in to comment.