wpseek.com
A WordPress-centric search engine for devs and theme authors



wp_print_view_transitions_render_blocking_link › WordPress Function

Since7.2.0
Deprecatedn/a
› wp_print_view_transitions_render_blocking_link ( No parameters )
Links:
Defined at:
Codex:

Prints a render-blocking expectation so View Transitions capture a fully parsed admin menu.

A cross-document view transition snapshots the incoming page at its first render, which can happen before the <body> has finished parsing. The snapshot would then capture a partially built page — for example an incomplete admin menu — and the transition animates to or from the wrong state. The expect link blocks the first render until #wpcontent is parsed. Rendering is unblocked as soon as the target's start tag is parsed, not its children, so the target is the element right after the admin menu rather than the menu itself: once #wpcontent starts, the whole menu has been parsed. Targeting an element near the end of the body would also work, but it would delay the first render by the time it takes to parse all of the page content. The media query limits the first-render delay to when view transitions can run, matching the @view-transition rule in view-transitions.css. It does not detect whether a transition is actually in progress, so a reload or a direct visit is also held until #wpcontent is parsed, but since that element starts right after the admin menu, the delay is negligible. Nothing is printed unless the admin View Transitions style has already been printed, since there is otherwise no transition to wait for. That style is only enqueued from wp-admin/admin-header.php, so this also leaves out iframe screens such as Thickbox modals, which have no #wpcontent: an expect link whose target never appears blocks the first render until the whole document has been parsed.


Source

function wp_print_view_transitions_render_blocking_link(): void {
	if ( ! wp_style_is( 'wp-view-transitions-admin', 'done' ) ) {
		return;
	}

	echo '<link rel="expect" href="#wpcontent" blocking="render" media="(prefers-reduced-motion: no-preference)">' . "\n";
}