[wp-trac] [WordPress Trac] #58773: Lazy load oEmbed iframes

[WordPress Trac]

#58773: Lazy load oEmbed iframes
-------------------------------------+-------------------------------------
 Reporter:  adamsilverstein          |       Owner:  adamsilverstein
     Type:  defect (bug)             |      Status:  assigned
 Priority:  normal                   |   Milestone:  6.4
Component:  Embeds                   |     Version:
 Severity:  normal                   |  Resolution:
 Keywords:  needs-testing has-patch  |     Focuses:  performance,
  has-unit-tests                     |  sustainability
-------------------------------------+-------------------------------------

Comment (by adamsilverstein):

 I created a test site with a bunch of different oEmbeds (although not
 every type WP supports): https://oembeds-test.instawp.xyz/

 In my testing some oEmbed endpoints like YouTube return an iframe and the
 approach in this ticket properly adds the loading="lazy" attribute. Other
 oEmbed endpoints instead return a `script` tag that generates the oEmbed
 iframe HTML at runtime when executed.

 For example, the twitter oEmbed endpoint returns something like this:


 {{{
 <blockquote class="twitter-tweet" data-width="500" data-dnt="true">
 <a
 href="https://twitter.com/example/status/1634286225552035873?ref_src=twsrc%5Etfw">March
 10, 2023</a></blockquote>
 <script async src="https://platform.twitter.com/widgets.js"
 charset="utf-8"></script>"
 }}}

 When the `widget.js` script executes, it expands the tweet inline into a
 full visually rich iframe. Since this happens after load time we can't
 alter the iframe code. We might consider swapping `defer` for `async` or
 adding `fetchpriority="low` to these scripts as a way of de-prioritizing
 them after researching potential benefits or pitfalls.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/58773#comment:10>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform