Add blocking="render" #613
Conversation
| @@ -0,0 +1,11 @@ | |||
| name: 'blocking="render"' | |||
| details: "The `blocking="render"` attribute for `<link>`, `<script>`, and `<style>` elements blocks rendering until the external script or stylesheet has been loaded." | |||
There was a problem hiding this comment.
@domenic given that you reviewed whatwg/html#7474 you must understand this feature deeply. I made an attempt at describing what this features does. I know it must be wrong because it's potentially render-blocking and not "definitely render-blocking", but I don't know when it doesn't actually block, or whether developers need to know about this from a short description.
Advice appreciated :)
There was a problem hiding this comment.
I think your summary seems reasonable. The caveats are mostly detailed in https://html.spec.whatwg.org/#render-blocking-mechanism . Things like:
- This only works for elements in the
<head> - There's an implementation-defined timeout
- Only works for text/html documents
... that sort of thing.
@noamr is probably our current expert on this?
There was a problem hiding this comment.
- Works only in the head
- Doesn't work on non-async classic scripts
- For links, only wokrs on
<link rel=stylesheet>and<link rel=expect>. For the latter it would block until the element indicated byhrefis seen and is fully parsed (end tag seen or added programmatically).
There was a problem hiding this comment.
Thanks @domenic and @noamr for the feedback. Of those caveats, I think the implementation-defined timeout is the most relevant to understand, and what some (evil QA people) might wonder about when reading about the feature. Is the timeout the same in all browsers, and what is it?
I'll add some comments to the YAML for things you've listed but I'm not sure should go in the description, so it's easier to find for future web-features maintainers.
There was a problem hiding this comment.
Thanks @domenic and @noamr for the feedback. Of those caveats, I think the implementation-defined timeout is the most relevant to understand, and what some (evil QA people) might wonder about when reading about the feature. Is the timeout the same in all browsers, and what is it?
Chrome currently doesn't implement such timeout. Since render blocking always relies on resource loading (js, css, html), the usual network timeouts apply.
I'll add some comments to the YAML for things you've listed but I'm not sure should go in the description, so it's easier to find for future web-features maintainers.
| @@ -0,0 +1,11 @@ | |||
| name: 'blocking="render"' | |||
| details: 'The `blocking="render"` attribute for `<link>`, `<script>`, and `<style>` elements blocks rendering until the external script or stylesheet has been loaded.' | |||
There was a problem hiding this comment.
For <link rel=expect> this means blocking until a certain element is seen in the HTML and is fully parsed.
There was a problem hiding this comment.
Oh... that's a very cool feature I didn't know was hiding here. That definitely should be in the description!
There was a problem hiding this comment.
Keep in mind that <link rel=expect> only ships in Chrome M124, so it wasn't hiding there for long.
There was a problem hiding this comment.
It was hard to figure out what this feature is, so I created mdn/mdn#534
Co-authored-by: Daniel D. Beck <daniel@ddbeck.com>
No description provided.