The following is a summary proposal for changes to the HTML spec regarding stylesheet loading, with the goal of improving reliability, understandability, determinism and browser compatibility, while not sacrificing performance.
The HTML spec currently specifies the concept of a pending parsing blocking script. This will be extended to include the definition of a pending parsing blocking style sheet.
A pending parsing blocking style sheet is any style sheet that is blocking script that is parser-inserted, or declared in a parser-inserted style sheet via @import
, regardless of its location in the HTML.
The HTML parser is changed to be blocked by any pending parsing blocking style sheets, via the same mechanism as that for pending parsing blocking script: the text insertion mode of the HTML parser.
Step 7 of the event loop processing model, update the rendering will only begin happening once:
- A parser-inserted
<body>
element has been added to the DOM
Once begun, step 7 will always happen in the future during the lifetime of the document, subject to throttling or stopping notes mentioned in the Note after step 7.3.
Further, step 7 will be specified to always use all style sheets which have beeen added to the document.
Add a definition of a preload scanner. A HTML preload scanner may parse and analyze the document ahead of the main parser to detect any external resources that are likely to be needed. The use of a preload scanner mitigates the performance benefits of loading stylesheets asynchronously and removes the burden from the main parser for detecting resources as soon as possible for loading.
Note: the preload scanner may affect the order in which resources are obtained, and may induce side-effects in cases where a server providing the resource over the network maintain states, and may be observable to Service Workers.