Make WordPress Core

Opened 5 years ago

Last modified 3 weeks ago

#37788 new enhancement

dns-prefetch s.w.org conditionally via javascript

Reported by: superpoincare Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 4.6
Component: Emoji Keywords:
Focuses: performance Cc:


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.

Attachments (1)

long-task.png (252.4 KB) - added by westonruter 4 weeks ago.
Long task

Download all attachments as: .zip

Change History (7)

#1 @SergeyBiryukov
5 years ago

  • Component changed from General to Script Loader

#3 @garrett-eclipse
3 years ago

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

4 weeks ago

Long task

#4 @westonruter
4 weeks ago

  • Focuses performance added

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.

#5 @westonruter
4 weeks ago

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.

#6 @westonruter
3 weeks ago

  • Component changed from Script Loader to Emoji
Note: See TracTickets for help on using tickets.