- Issue created by @dave reid
- Assigned to dave reid
I was attempting to follow the advice in https://web.dev/preconnect-and-dns-prefetch/ by providing some preconnect and preload link tags for some external web fonts our theme uses. However it seems that processHtmlHeadLink ignores additional attributes for uniqueness, and only considers the 'alternate' attribute.
I used hook_page_attachements():
/**
* Implements hook_page_attachments_alter().
*/
function custom_page_attachments_alter(&$attachments): void {
$attachments['#attached']['html_head_link'][] = [
[
'rel' => 'dns-prefetch',
'href' => 'https://www.example.com',
],
];
$attachments['#attached']['html_head_link'][] = [
[
'rel' => 'preconnect',
'href' => 'https://www.example.com',
],
];
$attachments['#attached']['html_head_link'][] = [
[
'rel' => 'preconnect',
'href' => 'https://www.example.com',
'crossorigin' => TRUE,
],
];
$attachments['#attached']['html_head_link'][] = [
[
'rel' => 'preload',
'href' => 'https://www.example.com/my-web-font.woff',
'as' => 'font',
'type' => 'font/woff2',
'crossorigin' => TRUE,
],
];
}
Results in:
<link rel="dns-prefetch" href="https://www.example.com" />
<link rel="preconnect" href="https://www.example.com" crossorigin /> <-- The second of the two links "won"
<link rel="preload" href="https://www.example.com/my-web-font.woff" as="font" type="font/woff2" crossorigin />
Expected result:
<link rel="dns-prefetch" href="https://www.example.com" />
<link rel="preconnect" href="https://www.example.com" />
<link rel="preconnect" href="https://www.example.com" crossorigin />
<link rel="preload" href="https://www.example.com/my-web-font.woff" as="font" type="font/woff2" crossorigin />
Can we just serialize or hash the additional attributes to ensure this won't happen to anything else?
Active
11.0 π₯
Last updated