Add self.queueMicrotask()

Closes #512.

Tests: web-platform-tests/wpt#6334

source

@@ -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>
@@ -89423,7 +89434,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>
@@ -89433,7 +89444,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>
@@ -90442,6 +90453,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);
@@ -91349,6 +91363,37 @@ scheduleWork(); // queues a task to do lots of work</code></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>
+
+
   <h3>User prompts</h3>
 
   <!--
@@ -120377,6 +120422,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>