Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add self.queueMicrotask() #2789

Merged
merged 2 commits into from
Aug 1, 2018
Merged

Add self.queueMicrotask() #2789

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f6f9f9e
Add self.queueMicrotask()
domenic Jun 23, 2017
f2b6ae3
should -> ought to
domenic Jul 23, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
52 changes: 50 additions & 2 deletions source
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4110,6 +4110,17 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
</ul>
</dd>

<dt>Cooperative Scheduling of Background Tasks</dt>

<dd>
<p>The following feature is defined in the <cite>Cooperative Scheduling of Background
Tasks</cite> specification: <ref spec=REQUESTIDLECALLBACK></p>

<ul class="brief">
<li><dfn data-x-href="https://w3c.github.io/requestidlecallback/#the-requestidlecallback-method"><code>requestIdleCallback()</code></dfn></li>
</ul>
</dd>

</dl>

<hr>
Expand Down Expand Up @@ -89356,7 +89367,7 @@ dictionary <dfn>PromiseRejectionEventInit</dfn> : <span>EventInit</span> {
<p>To affect the world of observable JavaScript objects, then, you must <span>queue a task</span>
to perform any such manipulations. This ensures your steps are properly interleaved with respect
to other things happening on the <span>event loop</span>. Furthermore, you must choose a
<span>task source</span> when <span data-x="queue a task">queueing a task</span>; this governs the
<span>task source</span> when <span data-x="queue a task">queuing a task</span>; this governs the
relative order of your steps versus others. If you are unsure which <span>task source</span> to
use, pick one of the <a href="#generic-task-sources">generic task sources</a> that sounds most
applicable.</p>
Expand All @@ -89366,7 +89377,7 @@ dictionary <dfn>PromiseRejectionEventInit</dfn> : <span>EventInit</span> {
algorithms to be invoked in contexts involving multiple event loops. (Unlike contexts involving
multiple global objects, which happen all the time!) So unless you are writing a specification
which, e.g., deals with manipulating <a href="#workers">workers</a>, you can omit this argument
when <span data-x="queue a task">queueing a task</span>.</p>
when <span data-x="queue a task">queuing a task</span>.</p>

<p>Putting this all together, we can provide a template for a typical algorithm that needs to do
work asynchronously:</p>
Expand Down Expand Up @@ -90375,6 +90386,9 @@ interface mixin <dfn>WindowOrWorkerGlobalScope</dfn> {
long <span data-x="dom-setInterval">setInterval</span>(<span>TimerHandler</span> handler, optional long timeout = 0, any... arguments);
void <span data-x="dom-clearInterval">clearInterval</span>(optional long handle = 0);

// microtask queuing
void <span data-x="dom-queueMicrotask">queueMicrotask</span>(<span data-x="idl-Function">Function</span> <var>callback</var>);

// ImageBitmap
Promise&lt;<span>ImageBitmap</span>&gt; <span data-x="dom-createImageBitmap">createImageBitmap</span>(<span>ImageBitmapSource</span> image, optional <span>ImageBitmapOptions</span> options);
Promise&lt;<span>ImageBitmap</span>&gt; <span data-x="dom-createImageBitmap">createImageBitmap</span>(<span>ImageBitmapSource</span> image, long sx, long sy, long sw, long sh, optional <span>ImageBitmapOptions</span> options);
Expand Down Expand Up @@ -91291,6 +91305,37 @@ scheduleWork(); // queues a task to do lots of work</pre>
</div>


<h3>Microtask queuing</h3>

<p>The <code data-x="dom-queueMicrotask">queueMicrotask()</code> method allows authors to schedule
a callback on the <span>microtask queue</span>. This allows their code to run after the
currently-executing <span data-x="concept-task">task</span> has run to completion and the
<span>JavaScript execution context stack</span> is empty, but without yielding control back to the
browser's <span>event loop</span>, as would be the case when using, for example, <code
data-x="dom-setTimeout">setTimeout(<var>f</var>,&nbsp;0)</code>.</p>

<p>Authors ought to be aware that scheduling a lot of microtasks has the same performance
downsides as running a lot of synchronous code. Both will prevent the browser from doing its own
work, such as rendering or scrolling. In many cases, <code
data-x="dom-window-requestAnimationFrame">requestAnimationFrame()</code> or
<code>requestIdleCallback()</code> is a better choice. In particular, if the goal is to run code
before the next rendering cycle, that is the purpose of <code
data-x="dom-window-requestAnimationFrame">requestAnimationFrame()</code>.</p>

<dl class="domintro">
<dt><var>self</var> . <code subdfn
data-x="dom-queueMicrotask">queueMicrotask</code>(<var>callback</var>)</dt>
<dd><p><span data-x="queue a microtask">Queues</span> a <span>microtask</span> to run the given
<var>callback</var>.</p></dd>
</dl>

<p w-nodev>The <dfn><code
data-x="dom-queueMicrotask">queueMicrotask(<var>callback</var>)</code></dfn> method must
<span>queue a microtask</span> to <span data-x="es-invoking-callback-functions">invoke</span>
<var>callback</var>, and if <var>callback</var> throws an exception, <span>report the
exception</span>.</p>


Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Technically it's at the end of the task, no?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd call step 6 "after" step 3 in https://html.spec.whatwg.org/#event-loop-processing-model

<h3>User prompts</h3>

<!--
Expand Down Expand Up @@ -120327,6 +120372,9 @@ INSERT INTERFACES HERE
<dt id="refsREFERRERPOLICY">[REFERRERPOLICY]</dt>
<dd><cite><a href="https://w3c.github.io/webappsec-referrer-policy/">Referrer Policy</a></cite>, J. Eisinger, E. Stark. W3C.</dd>

<dt id="refsREQUESTIDLECALLBACK">[REQUESTIDLECALLBACK]</dt>
<dd>(Non-normative) <cite><a href="https://w3c.github.io/requestidlecallback/">Cooperative Scheduling of Background Tasks</a></cite>, R. McIlry, I. Grigorik. W3C.</dd>

<dt id="refsRESOURCEHINTS">[RESOURCEHINTS]</dt>
<dd><cite><a href="https://w3c.github.io/resource-hints/">Resource Hints</a></cite>, I. Grigorik. W3C.</dd>

Expand Down