Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save westonruter/1dffdd6d6d5bb0e13b167875f1165659 to your computer and use it in GitHub Desktop.
Save westonruter/1dffdd6d6d5bb0e13b167875f1165659 to your computer and use it in GitHub Desktop.
Demonstration of blocks in post content that cause fetchpriority to be applied to the wrong image
<!-- wp:paragraph -->
<p><em>Note how the first image is getting <code>fetchpriority=high</code> even though the second image is larger and is the LCP element.</em></p>
<!-- /wp:paragraph -->
<!-- wp:media-text {"mediaId":23,"mediaType":"image","mediaWidth":34,"isStackedOnMobile":false,"imageFill":true,"focalPoint":{"x":0.73,"y":0.42}} -->
<div class="wp-block-media-text is-image-fill" style="grid-template-columns:34% auto"><figure class="wp-block-media-text__media" style="background-image:url(http://localhost:10008/wp-content/uploads/2023/05/American_bison_k5680-1-300x196.webp);background-position:73% 42%"><img src="http://localhost:10008/wp-content/uploads/2023/05/American_bison_k5680-1-300x196.webp" alt="" class="wp-image-23 size-full"/></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"placeholder":"Content…"} -->
<p>A <strong>bison</strong> (pl: <strong>bison</strong>) is a large <a href="https://en.wikipedia.org/wiki/Bovine">bovine</a> in the <a href="https://en.wikipedia.org/wiki/Genus">genus</a> <em><strong>Bison</strong></em> (Greek: "wild ox" (bison)) within the tribe <a href="https://en.wikipedia.org/wiki/Bovini">Bovini</a>. Two <a href="https://en.wikipedia.org/wiki/Extant_taxon">extant</a> and numerous <a href="https://en.wikipedia.org/wiki/Extinction">extinct</a> species are recognised.</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:media-text -->
<!-- wp:image {"id":33,"sizeSlug":"large"} -->
<figure class="wp-block-image size-large"><img src="http://localhost:10008/wp-content/uploads/2023/09/image-1024x683.jpeg" alt="" class="wp-image-33"/><figcaption class="wp-element-caption">"<a href="https://www.rawpixel.com/image/8732279/photo-image-face-public-domain-animal" target="_blank" rel="noreferrer noopener">Portrait of a bull bison</a>" by National Park Service/ <a href="https://creativecommons.org/publicdomain/zero/1.0/?ref=openverse" target="_blank" rel="noreferrer noopener">CC0 1.0</a></figcaption></figure>
<!-- /wp:image -->
<p><em>Note how the first image is getting <code>fetchpriority=high</code> even though the second image is larger and is
the LCP element.</em></p>
<div class="wp-block-media-text is-image-fill" style="grid-template-columns:34% auto">
<figure class="wp-block-media-text__media"
style="background-image:url(http://localhost:10008/wp-content/uploads/2023/05/American_bison_k5680-1-300x196.webp);background-position:73% 42%">
<img decoding="async" fetchpriority="high" width="300" height="196"
src="http://localhost:10008/wp-content/uploads/2023/05/American_bison_k5680-1-300x196.webp" alt=""
class="wp-image-23 size-full"></figure>
<div class="wp-block-media-text__content">
<p>A <strong>bison</strong> (pl: <strong>bison</strong>) is a large <a
href="https://en.wikipedia.org/wiki/Bovine">bovine</a> in the <a
href="https://en.wikipedia.org/wiki/Genus">genus</a> <em><strong>Bison</strong></em> (Greek: “wild ox”
(bison)) within the tribe <a href="https://en.wikipedia.org/wiki/Bovini">Bovini</a>. Two <a
href="https://en.wikipedia.org/wiki/Extant_taxon">extant</a> and numerous <a
href="https://en.wikipedia.org/wiki/Extinction">extinct</a> species are recognised.</p>
</div>
</div>
<figure class="wp-block-image"><img decoding="async" width="1300" height="867"
src="http://localhost:10008/wp-content/uploads/2023/09/image.jpeg" alt=""
class="wp-image-33">
<figcaption class="wp-element-caption">“<a
href="https://www.rawpixel.com/image/8732279/photo-image-face-public-domain-animal" target="_blank"
rel="noreferrer noopener">Portrait of a bull bison</a>” by National Park Service/ <a
href="https://creativecommons.org/publicdomain/zero/1.0/?ref=openverse" target="_blank"
rel="noreferrer noopener">CC0 1.0</a></figcaption>
</figure>
@westonruter
Copy link
Author

westonruter commented Sep 5, 2023

image

First image was uploaded to the media library. The medium resolution was selected, which is 300x300 by default in WordPress.

Second image was inserted via Openverse.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment