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

Set requests' render-blocking flag when fetching resources for render-blocking elements #7885

Merged
merged 2 commits into from
Jun 1, 2022
Merged

Set requests' render-blocking flag when fetching resources for render-blocking elements #7885

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2a4ffba
Remove preload-related stuff, add initial value in script fetch options
xiaochengh May 23, 2022
444aae2
Address comments Wed Jun 1 11:43:52 AM PDT 2022
xiaochengh Jun 1, 2022
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
46 changes: 37 additions & 9 deletions source
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2612,6 +2612,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
<li><dfn data-x="concept-request-reload-navigation-flag" data-x-href="https://fetch.spec.whatwg.org/#concept-request-reload-navigation-flag">reload-navigation flag</dfn></li>
<li><dfn data-x="concept-request-history-navigation-flag" data-x-href="https://fetch.spec.whatwg.org/#concept-request-history-navigation-flag">history-navigation flag</dfn></li>
<li><dfn data-x="concept-request-user-activation" data-x-href="https://fetch.spec.whatwg.org/#request-user-activation">user-activation</dfn></li>
<li><dfn data-x="concept-request-render-blocking" data-x-href="https://fetch.spec.whatwg.org/#request-render-blocking">render-blocking</dfn></li>
<li><dfn data-x-href="https://fetch.spec.whatwg.org/#concept-request-add-range-header">add a range header</dfn></li>
xiaochengh marked this conversation as resolved.
Show resolved Hide resolved
</ul>
</li>
Expand Down Expand Up @@ -16189,6 +16190,13 @@ console.log(style.disabled); // false</code></pre>
complete, or, if the style sheet has no <span>critical subresources</span>, once the style sheet
has been parsed and processed, the user agent must run these steps:</p>

<p class="XXX">Fetching the <span>critical subresources</span> is not well-defined; probably <a
href="https://github.com/whatwg/html/issues/968">issue #968</a> is the best resolution for that.
In the meantime, any <span data-x="critical subresources">critical subresource</span> <span
data-x="concept-request">request</span> should have its <span
data-x="concept-request-render-blocking">render-blocking</span> set to whether or not the
<code>style</code> element is currently <span>render-blocking</span>.</p>

<ol>
<li><p>Let <var>element</var> be the <code>style</code> element associated with the style sheet
in question.</p></li>
Expand Down Expand Up @@ -26586,8 +26594,8 @@ document.body.appendChild(wbr);</code></pre>
supported style sheet type, the user agent must instead assume it to be <code>text/css</code>.</p>

<p>The <span>linked resource fetch setup steps</span> for this type of linked resource, given a
<code>link</code> element <var>el</var> (ignoring the <span
data-x="concept-request">request</span>) are:</p>
<code>link</code> element <var>el</var> and <span data-x="concept-request">request</span>
<var>request</var>, are:</p>

<ol>
<li><p>If <var>el</var>'s <code data-x="attr-link-disabled">disabled</code> attribute is set,
Expand All @@ -26602,13 +26610,19 @@ document.body.appendChild(wbr);</code></pre>
<span>potentially render-blocking</span>, then <span>block rendering</span> on
<var>el</var>.</p></li>

<li><p>If <var>el</var> is currently <span>render-blocking</span>, then set <var>request</var>'s
<span data-x="concept-request-render-blocking">render-blocking</span> to true.</p></li>

<li><p>Return true.</p></li>
</ol>

<p class="XXX">See <a href="https://github.com/whatwg/html/issues/968">issue #968</a> for plans to
use the CSSOM <a href="https://drafts.csswg.org/cssom/#fetching-css-style-sheets">fetch a CSS
<p class="XXX">See <a href="https://github.com/whatwg/html/issues/968">issue #968</a> for plans
to use the CSSOM <a href="https://drafts.csswg.org/cssom/#fetching-css-style-sheets">fetch a CSS
style sheet</a> algorithm instead of the <span>default fetch and process the linked
resource</span> algorithm.</p>
resource</span> algorithm. In the meantime, any <span data-x="critical subresources">critical
subresource</span> <span data-x="concept-request">request</span> should have its <span
data-x="concept-request-render-blocking">render-blocking</span> set to whether or not the
<code>link</code> element is currently <span>render-blocking</span>.</p>

<p>To <span data-x="process the linked resource">process this type of linked resource</span>
given a <code>link</code> element <var>el</var>, boolean <var>success</var>, and <span
Expand Down Expand Up @@ -60460,6 +60474,10 @@ o............A....e
<li><p>Set <var>el</var>'s <span data-x="concept-script-delay-load">delaying the load
event</span> to true.</p></li>

<li><p>If <var>el</var> is currently <span>render-blocking</span>, then set
<var>options</var>'s <span data-x="concept-script-fetch-options-render-blocking">
xiaochengh marked this conversation as resolved.
Show resolved Hide resolved
render-blocking</span> to true.</p></li>

<li>
<p>Switch on <var>el</var>'s <span data-x="concept-script-type">type</span>:</p>

Expand Down Expand Up @@ -93046,6 +93064,12 @@ document.querySelector("button").addEventListener("click", bound);

<dd><p>The <span data-x="concept-request-referrer-policy">referrer policy</span> used for the
initial fetch and for fetching any imported modules</p></dd>

<dt><dfn data-x="concept-script-fetch-options-render-blocking">render-blocking</dfn></dt>

<dd><p>The boolean value of <span data-x="concept-request-render-blocking">render-blocking</span>
used for the initial fetch and for fetching any imported modules. Unless otherwise stated, its
value is false.</p></dd>
</dl>
xiaochengh marked this conversation as resolved.
Show resolved Hide resolved

<p class="note">Recall that via the <code>import()</code> feature, <span data-x="classic
Expand All @@ -93072,9 +93096,11 @@ document.querySelector("button").addEventListener("click", bound);
data-x="concept-request-integrity-metadata">integrity metadata</span> to <var>options</var>'s
<span data-x="concept-script-fetch-options-integrity">integrity metadata</span>, its <span
data-x="concept-request-parser-metadata">parser metadata</span> to <var>options</var>'s <span
data-x="concept-script-fetch-options-parser">parser metadata</span>, and its <span
data-x="concept-script-fetch-options-parser">parser metadata</span>, its <span
data-x="concept-request-referrer-policy">referrer policy</span> to <var>options</var>'s <span
data-x="concept-script-fetch-options-referrer-policy">referrer policy</span>.</p></dd>
data-x="concept-script-fetch-options-referrer-policy">referrer policy</span>, and its
<span data-x="concept-request-render-blocking">render-blocking</span> to <var>options</var>'s
<span data-x="concept-script-fetch-options-render-blocking">render-blocking</span>.</p></dd>

<dt><dfn>set up the module script request</dfn></dt>
<dd><p>Set <var>request</var>'s <span data-x="concept-request-nonce-metadata">cryptographic nonce
Expand All @@ -93085,9 +93111,11 @@ document.querySelector("button").addEventListener("click", bound);
data-x="concept-request-parser-metadata">parser metadata</span> to <var>options</var>'s <span
data-x="concept-script-fetch-options-parser">parser metadata</span>, its <span
data-x="concept-request-credentials-mode">credentials mode</span> to <var>options</var>'s <span
data-x="concept-script-fetch-options-credentials">credentials mode</span>, and its <span
data-x="concept-script-fetch-options-credentials">credentials mode</span>, its <span
data-x="concept-request-referrer-policy">referrer policy</span> to <var>options</var>'s <span
data-x="concept-script-fetch-options-referrer-policy">referrer policy</span>.</p></dd>
data-x="concept-script-fetch-options-referrer-policy">referrer policy</span>, and its
<span data-x="concept-request-render-blocking">render-blocking</span> to <var>options</var>'s
<span data-x="concept-script-fetch-options-render-blocking">render-blocking</span>.</p></dd>
</dl>

<p>For any given <span>script fetch options</span> <var>options</var>, the <dfn>descendant script
Expand Down