dns-prefetch s.w.org conditionally via javascript

[superpoincare]

For many users, dns-prefetch to s.w.org is not needed if they aren't using Jetpack or any plugin which connects to it. It's because:

1. A page may not have an emoji
2. Even if the page has it, the browser may support emojis. Going forward the support will increase.

Hence I propose the dns-prefetch to s.w.org be made only if the feature detection detects wp-emoji-release needs to be loaded or if possible page needs an emoji svg.

[Presskopp]

Related: #40426

[garrett-eclipse]

Related - #44001
*If emoji scripts gets internalized due to privacy concerns then the need to prefetch s.w.org will be gone.

[westonruter]

Long task

[westonruter]

We should consider doing more detection for whether to print emoji detection script as well. Not only is the dns-prefetch to s.w.org potentially a wasted connection, if a page lacks any emoji then the emoji detection script causes a long task.

For example, at ​https://pento.net/2021/01/21/wordpress-importers-free-as-in-speech/ see the above screenshot for the long task that print_emoji_detection_script() causes. If this script were removed, ~90ms could be shaved off of page load time. Also removing a needless dns-prefetch would improve things yet more.

There is prior discussion in #37817, but it it was about about improving the emoji detection script not detecting whether emoji is present. It's difficult to do this emoji detection in a traditional theme without using output buffering, since it's not known in the head what the body will include (other than looking at the main query). However, with full site editing this may indeed be doable as the entire page would be rendered as blocks and be in memory prior to printing. In this way, the blocks could be inspected for whether or not they contain emoji server-side, and only then print the dns-prefetch link to s.w.org and the emoji detection script.

[westonruter]

Aside: I don't think it makes sense to conditionally add the dns-prefetch link as part of the emoji detection script since at that point the emoji would be injected into the page, meaning the dns-prefetch link would be added during the same task that adds the emoji images. I don't believe there would be any performance benefit since adding the emoji image will immediately establish the DNS connection.

[westonruter]

Replying to westonruter:

We should consider doing more detection for whether to print emoji detection script as well. Not only is the dns-prefetch to s.w.org potentially a wasted connection, if a page lacks any emoji then the emoji detection script causes a long task.

For example, at ​https://pento.net/2021/01/21/wordpress-importers-free-as-in-speech/ see the above screenshot for the long task that print_emoji_detection_script() causes. If this script were removed, ~90ms could be shaved off of page load time.

I've opened #58472 to specifically address the long task.