Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
[giow] (2) Flesh out how rendering happens in the event loop. This al…
…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.