<zhead>
Link

expect

Points to an element in the current document. With blocking="render", it can hold rendering until that element is connected and fully parsed.

Code examples

Good example
<link rel="expect" href="#hero" blocking="render">
Blocks rendering while the parser reaches and finishes the element with id="hero".
Avoid this example
<link rel="expect" href="/next-page#hero" blocking="render">
Targets another document, so it cannot block on an element in the current page.

Recommendations

  • 01
    Target this document
    Use a fragment URL for an element in the current page. A URL for another document does not create a working render block.
  • 02
    Add blocking explicitly
    Rel="expect" identifies the element. The link blocks rendering only when blocking includes the render token and the other processing conditions are met.
  • 03
    Keep the blocked region small
    Rendering waits until the target is fully parsed. A late target can delay the whole first render, so use this only when partial rendering would be visibly broken.

Related documentation