🧬

dns-prefetchとpreconnectは同じlinkタグで使用しない

2021/06/22に公開

dns-prefetchとpreconnectのブラウザのサポートが違うため、同じlinkタグ内で使用するとSafariでpreconnectがキャンセルされるバグが発生します。

アンチパターン

<link rel="preconnect dns-prefetch" href="http://example.com">

正しい書き方

<link rel="preconnect" href="http://example.com">
<link rel="dns-prefetch" href="http://example.com">

参考

Establish network connections early to improve perceived page speed

Discussion