Skip to content

Don't queue a microtask from parallel in update the image data #11815

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

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Don't queue a microtask from parallel in update the image data #11815

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
84 changes: 50 additions & 34 deletions source
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32202,8 +32202,9 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code

<div algorithm>
<p>When obtaining images immediately, the user agent must synchronously <span>update the image
data</span> of the <code>img</code> element, with the <i>restart animation</i> flag set if so
stated, whenever that element is created or has experienced <span>relevant mutations</span>.</p>
data</span> of the <code>img</code> element, with <var>restartAnimation</var> set to true if so
stated, and with <var>maybeOmitEvents</var> set to true if so stated, whenever that element is
created or has experienced <span>relevant mutations</span>.</p>
</div>

<div algorithm>
Expand All @@ -32227,8 +32228,9 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
data-x="attr-img-srcset">srcset</code>, <code data-x="attr-dim-width">width</code>, or <code
data-x="attr-img-sizes">sizes</code> attributes are set, changed, or removed.</p></li>

<li><p>The element's <code data-x="attr-img-src">src</code> attribute is set to the same value as the previous value.
This must set the <i>restart animation</i> flag for the <span>update the image data</span> algorithm.</p></li>
<li><p>The element's <code data-x="attr-img-src">src</code> attribute is set to the same value as
the previous value. This must set <var>restartAnimation</var> to true for the <span>update the
image data</span> algorithm.</p></li>

<li><p>The element's <code data-x="attr-img-crossorigin">crossorigin</code> attribute's state is changed.</p></li>

Expand All @@ -32248,8 +32250,8 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
<li><p>The element's <span data-x="concept-node-adopt-ext">adopting steps</span> are run.</p></li>

<li><p>If the element <span>allows auto-sizes</span>: the element starts or stops <span>being
rendered</span>, or its <span>concrete object size</span> width changes. This must set the
<i>maybe omit events</i> flag for the <span>update the image data</span> algorithm.</p></li>
rendered</span>, or its <span>concrete object size</span> width changes. This must set
<var>maybeOmitEvents</var> to true for the <span>update the image data</span> algorithm.</p></li>

<!-- NOT when the base URL changes (except for when adopted into a new doc) -->
</ul>
Expand Down Expand Up @@ -32362,31 +32364,43 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
<span data-x="queue a task">queue</span> a task to do so.</p>

<div algorithm>
<p>When the user agent is to <dfn>update the image data</dfn> of an <code>img</code> element,
optionally with the <i>restart animations</i> flag set, optionally with the <i>maybe omit
events</i> flag set, it must run the following steps:</p>
<p>When the user agent is to <dfn>update the image data</dfn> given an <code>img</code> element
<var>img</var>, optionally a boolean <var>restartAnimations</var> (default false), optionally a
boolean <var>maybeOmitEvents</var> (default false), it must run the following steps:</p>

<ol>
<li>
<p>If the element's <span>node document</span> is not <span>fully active</span>, then:</p>
<p>If <var>img</var>'s <span>node document</span> is not <span>fully active</span>, then run
these steps <span>in parallel</span>:</p>

<ol>
<li><p>Continue running this algorithm <span>in parallel</span>.</p></li>

<li><p>Wait until the element's <span>node document</span> is <span>fully
<li><p>Wait until <var>img</var>'s <span>node document</span> is <span>fully
active</span>.</p></li>

<li><p>If another instance of this algorithm for this <code>img</code> element was started after this instance
<li><p>If another instance of this algorithm for <var>img</var> was started after this instance
(even if it aborted and is no longer running), then return.</p></li>

<li><p><span>Queue a microtask</span> to continue this algorithm.</p></li>
<li><p><span>Queue an element task</span> on the <span>DOM manipulation task source</span>
given <var>img</var> element to run the <span>internal update the image data steps</span> given
<var>img</var>, <var>restartAnimations</var>, and <var>maybeOmitEvents</var>.</p></li>
</ol>
</li>

<li><p>Otherwise, run the <span>internal update the image data steps</span> given <var>img</var>,
<var>restartAnimations</var>, and <var>maybeOmitEvents</var>.</p></li>
</ol>
</div>

<div algorithm>
<p>The <dfn>internal update the image data steps</dfn> given an <code>img</code> element
<var>img</var>, a boolean <var>restartAnimations</var>, and a boolean <var>maybeOmitEvents</var>
are as follows:</p>

<ol>
<li><p>If the user agent cannot support images, or its support for images has been disabled, then
<span>abort the image request</span> for the <span>current request</span> and the <span>pending
request</span>, set the <span>current request</span>'s <span data-x="img-req-state">state</span> to
<span data-x="img-none">unavailable</span>, set the <span>pending request</span> to null, and
request</span>, set the <span>current request</span>'s <span data-x="img-req-state">state</span>
to <span data-x="img-none">unavailable</span>, set the <span>pending request</span> to null, and
return.</p></li>

<li><p>Let <var>previousURL</var> be the <span>current request</span>'s <span
Expand Down Expand Up @@ -32447,19 +32461,19 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
given the <code>img</code> element and the following steps:</p>

<ol>
<li><p>If <i>restart animation</i> is set, then <span>restart the
<li><p>If <var>restartAnimation</var> is true, then <span>restart the
animation</span>.</p></li>

<li><p>Set the <span>current request</span>'s <span data-x="img-req-url">current URL</span> to
<var>urlString</var>.</p></li>

<li><p>If <i>maybe omit events</i> is not set or <var>previousURL</var> is not equal to
<li><p>If <var>maybeOmitEvents</var> is false or <var>previousURL</var> is not equal to
<var>urlString</var>, then <span data-x="concept-event-fire">fire an event</span> named
<code data-x="event-load">load</code> at the <code>img</code> element.</p></li>
</ol>
</li>

<li><p>Abort the <span>update the image data</span> algorithm.</p></li>
<li><p>Return.</p></li>
</ol>
</li>
</ol>
Expand Down Expand Up @@ -32507,7 +32521,7 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
data-x="use srcset or picture">uses <code>srcset</code> or
<code>picture</code></span>; and</p></li>

<li><p><i>maybe omit events</i> is not set or <var>previousURL</var> is not the empty
<li><p><var>maybeOmitEvents</var> is false or <var>previousURL</var> is not the empty
string,</p></li>
</ul>

Expand Down Expand Up @@ -32545,9 +32559,9 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
<li><p>Change the <span>current request</span>'s <span data-x="img-req-url">current
URL</span> to <var>selected source</var>.</p></li>

<li><p>If <i>maybe omit events</i> is not set or <var>previousURL</var> is not equal to
<var>selected source</var>, then <span data-x="concept-event-fire">fire an event</span>
named <code data-x="event-error">error</code> at the <code>img</code> element.</p></li>
<li><p>If <var>maybeOmitEvents</var> is false or <var>previousURL</var> is not equal to
<var>selected source</var>, then <span data-x="concept-event-fire">fire an event</span> named
<code data-x="event-error">error</code> at the <code>img</code> element.</p></li>
</ol>
</li>

Expand All @@ -32564,7 +32578,8 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
data-x="img-req-state">state</span> is <span data-x="img-inc">partially available</span>, then
<span>abort the image request</span> for the <span>pending request</span>, <span>queue an element
task</span> on the <span>DOM manipulation task source</span> given the <code>img</code> element
to <span>restart the animation</span> if <i>restart animation</i> is set, and return.</p></li>
to <span>restart the animation</span> if <var>restartAnimation</var> is true, and
return.</p></li>

<li><p><span>Abort the image request</span> for the <span>pending request</span>.</p></li>

Expand Down Expand Up @@ -32703,10 +32718,11 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
data-x="img-req-state">state</span> to <span data-x="img-all">completely
available</span>.</p></li>

<li><p>If <i>maybe omit events</i> is not set or <var>previousURL</var> is not equal to
<var>urlString</var>, then <span>queue an element task</span> on the <span>DOM manipulation task source</span>
given the <code>img</code> element to <span data-x="concept-event-fire">fire an event</span>
named <code data-x="event-load">load</code> at the <code>img</code> element.</p></li>
<li><p>If <var>maybeOmitEvents</var> is false or <var>previousURL</var> is not equal to
<var>urlString</var>, then <span>queue an element task</span> on the <span>DOM manipulation
task source</span> given the <code>img</code> element to <span
data-x="concept-event-fire">fire an event</span> named <code data-x="event-load">load</code>
at the <code>img</code> element.</p></li>
</ol>
<!--TODO what if the image is broken?
TODO change state and fire in the same task? -->
Expand Down Expand Up @@ -32760,7 +32776,7 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
<ol>
<li><p><span>Abort the image request</span> for <var>image request</var>.</p></li>

<li><p>If <i>maybe omit events</i> is not set or <var>previousURL</var> is not equal to
<li><p>If <var>maybeOmitEvents</var> is false or <var>previousURL</var> is not equal to
<var>urlString</var>, then <span data-x="concept-event-fire">fire an event</span> named
<code data-x="event-error">error</code> at the <code>img</code> element.</p></li>
</ol>
Expand Down Expand Up @@ -32798,9 +32814,9 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
<li><p>Add the image to the <span>list of available images</span> using the key
<var>key</var>, with the <span>ignore higher-layer caching</span> flag set.</p></li>

<li><p>If <i>maybe omit events</i> is not set or <var>previousURL</var> is not equal to
<var>urlString</var>, then <span data-x="concept-event-fire">fire an event</span> named
<code data-x="event-load">load</code> at the <code>img</code> element.</p></li>
<li><p>If <var>maybeOmitEvents</var> is false or <var>previousURL</var> is not equal to
<var>urlString</var>, then <span data-x="concept-event-fire">fire an event</span> named <code
data-x="event-load">load</code> at the <code>img</code> element.</p></li>
</ol>
</dd>

Expand All @@ -32811,7 +32827,7 @@ was an English &lt;a href="/wiki/Music_hall">music hall&lt;/a> singer, ...</code
data-x="img-error">broken</span>, <span>abort the image request</span> for the <span>current
request</span> and the <span>pending request</span>, <span>upgrade the pending request to the
current request</span> if <var>image request</var> is the <span>pending request</span>, and
then, if <i>maybe omit events</i> is not set or <var>previousURL</var> is not equal to
then, if <var>maybeOmitEvents</var> is false or <var>previousURL</var> is not equal to
<var>urlString</var>, <span>queue an element task</span> on the <span>DOM manipulation task
source</span> given the <code>img</code> element to <span data-x="concept-event-fire">fire an
event</span> named <code data-x="event-error">error</code> at the <code>img</code>
Expand Down