:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:20;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:58:\"Weston Ruter: Eliminating Layout Shifts in the Video Block\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:33:\"https://weston.ruter.net/?p=34930\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:81:\"https://weston.ruter.net/2025/06/05/eliminating-layout-shifts-in-the-video-block/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:35090:\"<p>Like the rest of the internet, I&#8217;ve been awestruck by the quality of Google&#8217;s <a href=\"https://deepmind.google/models/veo/\">Veo 3</a> AI video generator (even with audio). As you&#8217;ve seen from my posts, the <a href=\"https://en.wikipedia.org/wiki/American_bison\">American bison</a> <img alt=\"🦬\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f9ac.png\" style=\"height: 1em;\" /> is my favorite animal (aside from my cat of course). Also, perhaps I&#8217;ve watched too many <a href=\"https://www.instagram.com/moustache_farmer/\">videos</a> from the <a href=\"https://www.moustache-farmer.de/en\">Mustache Farmer</a>, but I realized I could use Veo 3 to realize a fantasy of being able to pal around with what in reality is a wild animal. Generating bison videos brought me a lot of joy so I had to share them. However, I faced a dilemma because I didn&#8217;t want to do so via WordPress&#8217;s Video block in its current state: it suffers from a bad case of <em>layout shiftitus</em>. Since web performance is an even greater passion of mine than the bison, before I could share the videos I did a deep dive on the problem and came up with a fix. <em>(Skip to the <a href=\"https://weston.ruter.net/category/wordpress/feed/#videos\">videos</a> below if you don&#8217;t care.)</em></p>\n\n\n\n<p>There&#8217;s a 2-year old Gutenberg issue (<a href=\"https://github.com/WordPress/gutenberg/issues/52185\" title=\"Video block: Should have width height dimensions to prevent cumulative layout shift (CLS)\">#52185</a>) which reported the underlying problem here that the Video block should have <code>width</code> and <code>height</code> attributes added to prevent layout shifts. Such jank causes a poor user experience and negatively impacts the <a href=\"https://web.dev/articles/cls\">Cumulative Layout Shift</a> (CLS) metric of <a href=\"https://web.dev/articles/vitals\">Core Web Vitals</a> (CWV).</p>\n\n\n\n<p>A dimensionless <code>video</code> element gets a 2:1 aspect ratio placeholder (a 300&#215;150 <a href=\"https://html.spec.whatwg.org/multipage/media.html#the-video-element:default-object-size\">default object size</a>) until the video&#8217;s metadata is loaded, at which time a layout shift happens due to the new dimensions being applied. When there&#8217;s a <code>poster</code> attribute, the placeholder dimensions get replaced with the dimensions of the poster image once it loads, also resulting in a layout shift; lastly, if the poster image doesn&#8217;t have the exact same dimensions as the video, then a second layout shift occurs once the video starts playing.</p>\n\n\n\n<p>Take a look at these screen recordings of a Video block without a poster and then with a poster provided (and there&#8217;s a script on this test page that starts video playback after 4 seconds):</p>\n\n\n\n<div class=\"wp-block-columns is-not-stacked-on-mobile is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\" id=\"screen-recordings-with-layout-shifts\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"1080\" loop=\"loop\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/1-no-poster-layout-shift.mp4\" width=\"476\"></video><figcaption class=\"wp-element-caption\">Without a poster, causing a layout shift.</figcaption></figure>\n</div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"1080\" loop=\"loop\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/2-with-poster-layout-shift.mp4\" width=\"476\"></video><figcaption class=\"wp-element-caption\">With a poster, causing a layout shift.</figcaption></figure>\n</div>\n</div>\n\n\n\n<p>The layout shifts are somewhat exaggerated here because:</p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>A vertical/portrait video is used.</li>\n\n\n\n<li>A network delay is added to slow down the loading of the poster and video (which is not unexpected on a mobile connection).</li>\n\n\n\n<li>The poster image doesn&#8217;t have the same dimensions as the video.</li>\n</ol>\n\n\n\n<p>In any case, such layout shifts seem to occur anywhere the Video block is used to some degree. </p>\n\n\n\n<h2 class=\"wp-block-heading\">CLS Passing Rates</h2>\n\n\n\n<p>Layout shifts from the Video block contribute to WordPress overall having a relatively poor passing rate for CLS. On desktop, 71% of WordPress origins have a good CLS passing rate, while on mobile the passing rate is 82%. (CLS is worse on desktop presumably because more content is on the screen at a time, meaning there are more opportunities for layout shifts to appear in the viewport.) When evaluating these CLS passing rates in terms of <a href=\"https://en.wikipedia.org/wiki/Academic_grading_in_the_United_States#Grade_conversion\">academic letter grades</a>, <strong>WordPress is getting a B− on mobile and a C− on desktop.</strong> When comparing WordPress to other popular CMS platforms, it ranks near the bottom with only Joomla performing worse, as seen in this table sorted by desktop:</p>\n\n\n\n<figure class=\"wp-block-table is-style-regular has-medium-font-size\"><table><thead><tr><th>Technology</th><th><a href=\"https://httparchive.org/reports/techreport/tech?good-cwv-over-time=CLS&amp;client=desktop&amp;tech=ALL%2CWordPress%2CShopify%2CWix%2CSquarespace%2CJoomla%2CDrupal&amp;geo=ALL&amp;rank=ALL#comparison-good-cwvs\">Desktop</a></th><th><a href=\"https://httparchive.org/reports/techreport/tech?good-cwv-over-time=CLS&amp;client=mobile&amp;tech=ALL%2CWordPress%2CShopify%2CWix%2CSquarespace%2CJoomla%2CDrupal&amp;geo=ALL&amp;rank=ALL#comparison-good-cwvs\">Mobile</a></th></tr></thead><tbody><tr><td>Wix</td><td>91% (A−)</td><td>94% (A)</td></tr><tr><td>Shopify</td><td>82% (B−)</td><td>90% (A−)</td></tr><tr><td>Squarespace</td><td>77% (C+)</td><td>88% (B+)</td></tr><tr><td>Drupal</td><td>72% (C−)</td><td>85% (B)</td></tr><tr><td><em>(Any)</em></td><td>72% (C−)</td><td>79% (C+)</td></tr><tr><td><strong>WordPress</strong></td><td><strong>71%</strong> (C−)</td><td><strong>82%</strong> (B−)</td></tr><tr><td>Joomla</td><td>69% (D+)</td><td>79% (C+)</td></tr></tbody></table></figure>\n\n\n\n<details class=\"wp-block-details has-small-font-size is-layout-flow wp-block-details-is-layout-flow\">Graphs of origins with good CLS over time\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-0884d4d2 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"has-text-align-center\">Desktop</p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large is-resized wp-lightbox-container\" style=\"margin-top: 0;\"><img alt=\"Graph showing good CLS over time on desktop for WordPress, Shopify, Wix, Squarespace, Joomla, and Drupal. All platforms are trending upward, but WordPress is near the bottom with Joomla at ~70%, while Wix is at the top with ~90%.\" class=\"wp-image-35018\" height=\"600\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/chart-cls-desktop-svgomg.svg\" style=\"width: 600px; height: auto;\" width=\"600\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button></figure>\n</div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"has-text-align-center\">Mobile</p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large is-resized wp-lightbox-container\" style=\"margin-top: 0;\"><img alt=\"Graph showing good CLS over time on mobile for WordPress, Shopify, Wix, Squarespace, Joomla, and Drupal. All platforms are trending upward, but WordPress is near the bottom with Joomla at ~80%, while Wix is at the top with ~95%.\" class=\"wp-image-35019\" height=\"600\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/chart-cls-mobile-svgomg.svg\" style=\"width: 600px; height: auto;\" width=\"600\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button></figure>\n</div>\n</div>\n</details>\n\n\n\n<p>The passing rates for WordPress are unsurprisingly very close to the passing rates for the web overall (any technology) since WordPress has the largest market share by far. <strong>Whenever WordPress performs badly, the web as a whole suffers. Whenever WordPress performs well, the web as a whole improves.</strong> This was the drive behind my “scaled activation” Chrome team at Google <a href=\"https://weston.ruter.net/2025/05/14/a-decade-as-a-core-committer-my-wordpress-contribution-history/\">when I was sponsored</a> there to work on WordPress performance full time.</p>\n\n\n\n<p>Now, CLS in WordPress is not nearly as problematic as Largest Contentful Paint (LCP), which is getting an <strong>F grade</strong> for its passing rates of <a href=\"https://httparchive.org/reports/techreport/tech?good-cwv-over-time=LCP&amp;client=mobile&amp;tech=ALL%2CWordPress%2CShopify%2CWix%2CSquarespace%2CJoomla%2CDrupal&amp;geo=ALL&amp;rank=ALL#comparison-good-cwvs\">54% on mobile</a> and <a href=\"https://httparchive.org/reports/techreport/tech?good-cwv-over-time=LCP&amp;client=desktop&amp;tech=ALL%2CWordPress%2CShopify%2CWix%2CSquarespace%2CJoomla%2CDrupal&amp;geo=ALL&amp;rank=ALL#comparison-good-cwvs\">65% on desktop</a>. Because of this, improving LCP has been the primary focus for us on the WordPress Core Performance Team, and the <a href=\"https://make.wordpress.org/core/2023/09/19/analyzing-the-core-web-vitals-performance-impact-of-wordpress-6-3-in-the-field/\">metric has improved</a> thanks in part to <a href=\"https://make.wordpress.org/core/2023/07/13/image-performance-enhancements-in-wordpress-6-3/\">adding</a> <code>fetchpriority=high</code> to LCP-probable <code>img</code> tags, <a href=\"https://make.wordpress.org/core/2023/07/13/image-performance-enhancements-in-wordpress-6-3/#:~:text=Lazy%2Dloading%20issues%20addressed\">adjusting</a> image lazy-loading heuristics, <a href=\"https://core.trac.wordpress.org/ticket/58472\">optimizing</a> the emoji loader, and most recently landing <a href=\"https://make.wordpress.org/core/2025/03/06/speculative-loading-in-6-8/\">Speculative Loading</a>. And work continues on improving LCP, for example, by <a href=\"https://weston.ruter.net/2025/05/26/improve-lcp-by-deprioritizing-interactivity-api-script-modules/\">deprioritizing non-critical scripts</a> and by leveraging client-side metrics to more accurately prioritize images via the <a href=\"https://github.com/WordPress/performance/blob/trunk/plugins/optimization-detective/docs/introduction.md\">Optimization Detective</a> project (see also <a href=\"https://weston.ruter.net/2025/02/21/boosting-performance-with-optimization-detective/\">my talk</a>).</p>\n\n\n\n<p>The other CWV metric, Interaction to Next Paint (INP), is in relatively great shape with a passing rate of <a href=\"https://httparchive.org/reports/techreport/tech?good-cwv-over-time=INP&amp;client=mobile&amp;tech=ALL%2CWordPress%2CShopify%2CWix%2CSquarespace%2CJoomla%2CDrupal&amp;geo=ALL&amp;rank=ALL#comparison-good-cwvs\">85% on mobile</a> (B) and <a href=\"https://httparchive.org/reports/techreport/tech?good-cwv-over-time=INP&amp;client=desktop&amp;tech=ALL%2CWordPress%2CShopify%2CWix%2CSquarespace%2CJoomla%2CDrupal&amp;geo=ALL&amp;rank=ALL#comparison-good-cwvs\">98% on desktop</a> (A+).</p>\n\n\n\n<p>So, in parallel with the continued work to improve LCP, it&#8217;s important to not neglect WordPress&#8217;s sub-optimal CLS passing rate. Prior work to improve CLS included <a href=\"https://make.wordpress.org/core/2020/07/14/lazy-loading-images-in-5-5/\">adding</a> <code>width</code> and <code>height</code> attributes to <code>img</code> tags for the sake of lazy-loading. There&#8217;s also a ticket (<a href=\"https://core.trac.wordpress.org/ticket/59119\" title=\"Measure layout stability metrics in performance tests\">#59119</a>) to measure CLS in performance tests. Additionally, a key feature of the <a href=\"https://wordpress.org/plugins/embed-optimizer/\">Embed Optimizer</a> extension to the aforementioned Optimization Detective <a href=\"https://wordpress.org/plugins/optimization-detective/\">plugin</a> is the <strong>reduction of layout shifts</strong> caused by embeds that resize when they load. This is commonly seen in embeds for Twitter, Bluesky, and WordPress itself. Embed Optimizer keeps track of these embeds&#8217; resized heights. Then, with these resized heights stored, Embed Optimizer sets the appropriate height on the container <code>figure</code> element as the viewport-specific <code>min-height</code> so that when the embed loads any layout shift is minimized.</p>\n\n\n\n<p>Lastly, coming back to the impetus of this post, there&#8217;s the issue of layout shifts in the Video block.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Fixing the Video Block</h2>\n\n\n\n<p>Preventing layout shifts in the Video block is straightforward. As described in the <a href=\"https://github.com/WordPress/gutenberg/issues/52185\">Gutenberg issue</a>, the <code>width</code> and <code>height</code> attributes need to be supplied on the <code>video</code> tag, although a bit more is needed than just that. When a video is uploaded to the Media Library, the metadata is <a href=\"https://developer.wordpress.org/reference/functions/wp_generate_attachment_metadata/\">obtained</a> via the <code><a href=\"https://developer.wordpress.org/reference/functions/wp_read_video_metadata/\">wp_read_video_metadata()</a></code> function, including its width and height. Assuming that reading the metadata was successful, these dimensions can then be injected into the <code>video</code> tag in the same way as dimensions are being <a href=\"https://developer.wordpress.org/reference/functions/wp_img_tag_add_width_and_height_attr/\">added</a> to the <code>img</code> tag. (For external videos added by URL not uploaded into the Media Library, the dimensions could be read client-side in the block editor or they could be <a href=\"https://github.com/WordPress/performance/issues/10#issuecomment-2601037707\">gathered via Optimization Detective on the frontend</a>.)</p>\n\n\n\n<p>This goes full circle for me because we did something similar in <time datetime=\"2018-05-21\">2018 (7 years ago!)</time> to <a href=\"https://github.com/ampproject/amp-wp/pull/1026\">add dimensions to videos</a> in the <a href=\"https://wordpress.org/plugins/amp/\">AMP plugin</a> when converting from the <code>video</code> tag to the <code><a href=\"https://amp.dev/documentation/components/amp-video\">amp-video</a></code> component. The <a href=\"https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml\">AMP HTML spec</a> <a href=\"https://amp.dev/documentation/guides-and-tutorials/learn/amp-html-layout/#width-and-height\">mandates</a> (generally) that all elements must have dimensions supplied to <a href=\"https://blog.amp.dev/2020/04/16/cumulative-layout-shift-in-amp/\">prevent layout shifts</a>, as the first of <a href=\"https://amp.dev/about/mission-and-vision#:~:text=merchant%2C%20and%20advertiser.-,Design%20Principles,-These%20design%20principles\">AMP&#8217;s design principles</a> is to prioritize the user experience. As I <a href=\"https://weston.ruter.net/2025/05/14/a-decade-as-a-core-committer-my-wordpress-contribution-history/#:~:text=Ultimately%2C%20a%20lot,improving%20CWV%20metrics.\">mentioned</a> in my recent <a href=\"https://weston.ruter.net/2025/05/14/a-decade-as-a-core-committer-my-wordpress-contribution-history/\">contribution retrospective</a>, AMP predates CWV; as part of <a href=\"https://blog.amp.dev/2019/05/21/contributing-back-lessons-learned-part-1/\">contributing back lessons learned from AMP to the whole web</a>, it “invested in defining additional metrics that would paint a more holistic image of user perceived performance.” This included a “Layout Stability” metric which came to be known as CLS.</p>\n\n\n\n<p>In addition to providing the <code>width</code> and <code>height</code> attributes, for the <code>video</code> to scale to fit its container and to have the correct aspect ratio, the element needs to be styled with <code>height:auto</code> since it has <code>width:100%</code>. Finally, because of an <a href=\"https://github.com/w3c/csswg-drafts/issues/7524\" title=\"[css-sizing-4] aspect-ratio via width and height attributes doesn\'t work for &lt;video&gt;\">issue</a> in the CSS spec (as <a href=\"https://jakearchibald.com/2022/img-aspect-ratio/#:~:text=Update%3A%20Although%20browsers%20implemented%20the%20feature%20for%20%3Cvideo%3E%20as%20per%20the%20spec%2C%20the%20spec%20is%20broken%2C%20so%20it%20doesn%27t%20work%20in%20practice.\">highlighted</a> by <a href=\"https://jakearchibald.com/\">Jake Archibald</a>), the width and height need to be replicated in an <code><a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio\">aspect-ratio</a></code> style. This currently has to be added as an inline style since the following desired use of the <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/attr\"><code>attr()</code></a> function in a style rule is currently only <a href=\"https://caniuse.com/css3-attr\">supported</a> in Chromium:</p>\n\n\n<pre class=\"wp-block-code has-medium-font-size\"><span><code class=\"hljs language-css\"><span class=\"hljs-selector-class\">.wp-block-video</span> <span class=\"hljs-selector-tag\">video</span><span class=\"hljs-selector-attr\">&#91;width]</span><span class=\"hljs-selector-attr\">&#91;height]</span> {\n	<span class=\"hljs-attribute\">aspect-ratio</span>:\n		<span class=\"hljs-built_in\">attr</span>(width  type(&lt;number&gt;)) /\n		<span class=\"hljs-built_in\">attr</span>(height type(&lt;number&gt;));\n}</code></span></pre>\n\n\n<p>I&#8217;ve submitted the fix in Gutenberg pull request #70293: <a href=\"https://github.com/WordPress/gutenberg/pull/70293\">Fix layout shift caused by video tag in Video block lacking width and height</a>.</p>\n\n\n\n<p>And since I didn&#8217;t want to wait for that fix to be merged and available in a new Gutenberg release, I also adapted it into a standalone <a href=\"https://github.com/westonruter/layout-stabilized-video-block\">Layout-stabilized Video Block</a> plugin which is active here on my blog (since I wanted to share those AI-generated bison videos!). Please install the plugin on your site and test how it works with your Video blocks.</p>\n\n\n\n<p>Compare the <a href=\"https://weston.ruter.net/category/wordpress/feed/#screen-recordings-with-layout-shifts\">above screen recordings</a> of layout-shifting Video blocks with the following screen recordings where the fix is applied:</p>\n\n\n\n<div class=\"wp-block-columns is-not-stacked-on-mobile is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\" id=\"screen-recordings-without-layout-shifts\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"1080\" loop=\"loop\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/3-no-poster-and-no-layout-shift.mp4\" width=\"476\"></video><figcaption class=\"wp-element-caption\">Without a poster, not causing a layout shift.</figcaption></figure>\n</div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"1080\" loop=\"loop\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/4-with-poster-and-no-layout-shift.mp4\" width=\"476\"></video><figcaption class=\"wp-element-caption\">With a poster, not causing a layout shift.</figcaption></figure>\n</div>\n</div>\n\n\n\n<details class=\"wp-block-details has-small-font-size is-layout-flow wp-block-details-is-layout-flow\">Aside: Command used for transcoding screen recordings\n<p>I was really impressed with how well FFmpeg compressed the original Quicktime screen recordings from ~32MB down to just ~400KB, and since the args to <code>ffmpeg</code> are always something I have to re-discover, here&#8217;s the command for (my) future reference:</p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\"><span class=\"hljs-keyword\">for</span> video <span class=\"hljs-keyword\">in</span> $(ls *.mov); <span class=\"hljs-keyword\">do</span>\n  ffmpeg \n    -i <span class=\"hljs-string\">\"<span class=\"hljs-variable\">$video</span>\"</span> \\\n    -vf <span class=\"hljs-string\">\"scale=-2:1080\"</span> \\\n    -c:v libx264 \\\n    -preset medium \\\n    -crf 30 \\\n    -an \\\n    -b:a 128k \\\n    -movflags \\\n    +faststart \\\n    <span class=\"hljs-string\">\"<span class=\"hljs-variable\">${video/.mov/.mp4}</span>\"</span>\n<span class=\"hljs-keyword\">done</span></code></span></pre></details>\n\n\n\n<p>You can <a href=\"https://weston.ruter.net/?p=34930&amp;disable_layout_stabilized_video_block=1#screen-recordings-without-layout-shifts\">try loading this post without the fix</a> by adding a special query var to the URL (and then keep hard reloading to see more layout instability).</p>\n\n\n\n<p>And now, with the layout shift fixed, let&#8217;s get to the bison videos.</p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"videos\">AI Bison Videos</h2>\n\n\n\n<p>The following Veo-generated videos were downloaded from Gemini and uploaded without any transcoding, although they are encoded quite well for the web at ~3MB each for 8 seconds of high quality 720p video with audio. I manually selected a representative frame of each video to create the poster images.</p>\n\n\n\n<aside class=\"wp-block-group is-style-section-1 has-global-padding is-layout-constrained wp-container-core-group-is-layout-c385debf wp-block-group-is-layout-constrained is-style-section-1--1\">\n<p class=\"is-style-default\">Bonus: This site is running the <a href=\"https://wordpress.org/plugins/image-prioritizer/\">Image Prioritizer</a> extension of Optimization Detective which improves the loading of videos by:</p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Lazy loading the videos by setting the <code>preload</code> initially to <code>none</code>, and then removing this when the video enters the viewport.</li>\n\n\n\n<li>Lazy loading the poster images.</li>\n\n\n\n<li>Reducing the size of the poster image according to the max width of the <code>video</code> across all viewport sizes.</li>\n\n\n\n<li>Preloading poster images for LCP <code>video</code> elements (not relevant for this post).</li>\n</ol>\n</aside>\n\n\n\n<p>This first video leans a little too hard into the “mustache” of the Mustache Farmer:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Video_Ready_Bison_and_Man.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Video_Ready_Bison_and_Man.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison falls asleep in the lap of a man in the style of the Mustache Farmer.</figcaption></figure>\n\n\n\n<p>I like how this guy seemingly pretends he didn&#8217;t know where the bison was in the open field, “Oh, there you are buddy!”:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Nuzzles_Man_Video_Ready.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Nuzzles_Man_Video_Ready.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison runs over to a man and affectionately nuzzles him, putting his head next to the man to rub up against him. The man pets the bison&#8217;s head and smiles. The bison is the man&#8217;s pet.</figcaption></figure>\n\n\n\n<p>Awkward running:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Nuzzles_Petting_Man_Video.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Nuzzles_Petting_Man_Video.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison and a man run toward each other. When they meet, the bison affectionately nuzzles him, putting his head next to the man to rub up against him. The man pets the bison&#8217;s head and smiles. The bison is the man&#8217;s pet.</figcaption></figure>\n\n\n\n<p>A somewhat less awkward run:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_and_Man_s_Affectionate_Meeting.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_and_Man_s_Affectionate_Meeting.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison and a man run toward each other. When they meet, the bison affectionately nuzzles him, putting his head next to the man to rub up against him. The man pets the bison&#8217;s head and smiles. The bison is the man&#8217;s pet.</figcaption></figure>\n\n\n\n<p>There&#8217;s an invisible stirrup in this one:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Ride_Video_Ready.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Ride_Video_Ready.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison kneels down for a man, and the man climbs on the back of the bison and they gallop off into the sunset.</figcaption></figure>\n\n\n\n<p>Apparently Tom Cruise with maniacal laughter and a magically-appearing saddle:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Ride_Video_Ready_.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Ride_Video_Ready_.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison kneels down for a man to mount on top of the bison. The bison wants to give the man a ride. The man laughs and smiles as he climbs onto the back of the bison and they gallop off into the sunset.</figcaption></figure>\n\n\n\n<p>Just heartwarming:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_and_Man_s_Affectionate_Moment.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_and_Man_s_Affectionate_Moment.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison walks up to a man. The bison rubs his head against the man, nuzzling him like a cat. The man affectionately rubs the bison&#8217;s head. The man smiles. The bison could be the man&#8217;s pet.</figcaption></figure>\n\n\n\n<p>The guy&#8217;s smile is a little intense in this one, but it&#8217;s also heartwarming:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Video_of_Man_and_Bison.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Video_of_Man_and_Bison.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A man and a bison having fun together, rolling in the grass and wrestling. The bison is the man&#8217;s pet.</figcaption></figure>\n\n\n\n<p>This guy seems a little fake (almost like he&#8217;s AI):</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Petting_Video_Ready_.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Bison_Petting_Video_Ready_.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison is standing close to a man. The man scratches the bison under its neck and he pets the hair on the bison&#8217;s head. The bison is enjoying the affection. The man smiles and tells the bison, &#8220;You&#8217;re such a good boy.&#8221; The bison likes the man. The bison is the man&#8217;s pet.</figcaption></figure>\n\n\n\n<p>Nice purring sound effect, followed by flapping bird wings?</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Cat_and_Bison_Video_Link.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Cat_and_Bison_Video_Link.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A gray tabby cat with faint stripes jumps on top of a bison and starts to knead its paws into the bison&#8217;s thick fur. The bison likes it. The bison and the cat are friends.</figcaption></figure>\n\n\n\n<p>Cozy, but the cat glitches a bit at the end:</p>\n\n\n\n<figure class=\"wp-block-video\"><video controls=\"controls\" height=\"720\" poster=\"https://weston.ruter.net/wp-content/uploads/2025/06/Video_Bison_and_Cat_Nap.jpg\" src=\"https://weston.ruter.net/wp-content/uploads/2025/06/Video_Bison_and_Cat_Nap.mp4\" width=\"1280\"></video><figcaption class=\"wp-element-caption\">Prompt: A bison is lying down in the grass. A gray tabby cat nuzzles up to the bison and climbs on its back to lie down for a nap. The bison likes the cat&#8217;s company.</figcaption></figure>\n\n\n\n<p>Now I&#8217;m going to go pet my real cat. <img alt=\"😸\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f638.png\" style=\"height: 1em;\" /></p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" />\n\n\n\n<p class=\"has-medium-font-size\">Where I&#8217;ve shared this:</p>\n\n\n\n<ul class=\"wp-block-social-links is-layout-flex wp-block-social-links-is-layout-flex\"><li class=\"wp-social-link wp-social-link-linkedin  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://www.linkedin.com/posts/westonruter_eliminating-layout-shifts-in-the-video-block-activity-7336504092174729217-HmKO\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M19.7,3H4.3C3.582,3,3,3.582,3,4.3v15.4C3,20.418,3.582,21,4.3,21h15.4c0.718,0,1.3-0.582,1.3-1.3V4.3 C21,3.582,20.418,3,19.7,3z M8.339,18.338H5.667v-8.59h2.672V18.338z M7.004,8.574c-0.857,0-1.549-0.694-1.549-1.548 c0-0.855,0.691-1.548,1.549-1.548c0.854,0,1.547,0.694,1.547,1.548C8.551,7.881,7.858,8.574,7.004,8.574z M18.339,18.338h-2.669 v-4.177c0-0.996-0.017-2.278-1.387-2.278c-1.389,0-1.601,1.086-1.601,2.206v4.249h-2.667v-8.59h2.559v1.174h0.037 c0.356-0.675,1.227-1.387,2.526-1.387c2.703,0,3.203,1.779,3.203,4.092V18.338z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">LinkedIn</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-bluesky  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://bsky.app/profile/weston.ruter.net/post/3lqvbcqwx622q\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6.3,4.2c2.3,1.7,4.8,5.3,5.7,7.2.9-1.9,3.4-5.4,5.7-7.2,1.7-1.3,4.3-2.2,4.3.9s-.4,5.2-.6,5.9c-.7,2.6-3.3,3.2-5.6,2.8,4,.7,5.1,3,2.9,5.3-5,5.2-6.7-2.8-6.7-2.8,0,0-1.7,8-6.7,2.8-2.2-2.3-1.2-4.6,2.9-5.3-2.3.4-4.9-.3-5.6-2.8-.2-.7-.6-5.3-.6-5.9,0-3.1,2.7-2.1,4.3-.9h0Z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">Bluesky</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-mastodon  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://mastodon.social/@westonruter/114632880406289198\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M23.193 7.879c0-5.206-3.411-6.732-3.411-6.732C18.062.357 15.108.025 12.041 0h-.076c-3.068.025-6.02.357-7.74 1.147 0 0-3.411 1.526-3.411 6.732 0 1.192-.023 2.618.015 4.129.124 5.092.934 10.109 5.641 11.355 2.17.574 4.034.695 5.535.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.129.539c-2.165-.074-4.449-.233-4.799-2.891a5.499 5.499 0 0 1-.048-.745s2.125.52 4.817.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.507.475-6.507zm-4.024 6.709h-2.497V8.469c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.312v3.349h-2.483v-3.35c0-1.536-.602-2.312-1.802-2.312-1.085 0-1.628.655-1.628 1.944v6.119H4.832V8.284c0-1.289.328-2.313.987-3.07.68-.758 1.569-1.146 2.674-1.146 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.304z\"></svg><span class=\"wp-block-social-link-label screen-reader-text\">Mastodon</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-twitter  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://x.com/westonruter/status/1930738990308884546\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M22.23,5.924c-0.736,0.326-1.527,0.547-2.357,0.646c0.847-0.508,1.498-1.312,1.804-2.27 c-0.793,0.47-1.671,0.812-2.606,0.996C18.324,4.498,17.257,4,16.077,4c-2.266,0-4.103,1.837-4.103,4.103 c0,0.322,0.036,0.635,0.106,0.935C8.67,8.867,5.647,7.234,3.623,4.751C3.27,5.357,3.067,6.062,3.067,6.814 c0,1.424,0.724,2.679,1.825,3.415c-0.673-0.021-1.305-0.206-1.859-0.513c0,0.017,0,0.034,0,0.052c0,1.988,1.414,3.647,3.292,4.023 c-0.344,0.094-0.707,0.144-1.081,0.144c-0.264,0-0.521-0.026-0.772-0.074c0.522,1.63,2.038,2.816,3.833,2.85 c-1.404,1.1-3.174,1.756-5.096,1.756c-0.331,0-0.658-0.019-0.979-0.057c1.816,1.164,3.973,1.843,6.29,1.843 c7.547,0,11.675-6.252,11.675-11.675c0-0.178-0.004-0.355-0.012-0.531C20.985,7.47,21.68,6.747,22.23,5.924z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">Twitter</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-threads  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://www.threads.com/@westonruter/post/DKmwlxgOHzL\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M16.3 11.3c-.1 0-.2-.1-.2-.1-.1-2.6-1.5-4-3.9-4-1.4 0-2.6.6-3.3 1.7l1.3.9c.5-.8 1.4-1 2-1 .8 0 1.4.2 1.7.7.3.3.5.8.5 1.3-.7-.1-1.4-.2-2.2-.1-2.2.1-3.7 1.4-3.6 3.2 0 .9.5 1.7 1.3 2.2.7.4 1.5.6 2.4.6 1.2-.1 2.1-.5 2.7-1.3.5-.6.8-1.4.9-2.4.6.3 1 .8 1.2 1.3.4.9.4 2.4-.8 3.6-1.1 1.1-2.3 1.5-4.3 1.5-2.1 0-3.8-.7-4.8-2S5.7 14.3 5.7 12c0-2.3.5-4.1 1.5-5.4 1.1-1.3 2.7-2 4.8-2 2.2 0 3.8.7 4.9 2 .5.7.9 1.5 1.2 2.5l1.5-.4c-.3-1.2-.8-2.2-1.5-3.1-1.3-1.7-3.3-2.6-6-2.6-2.6 0-4.7.9-6 2.6C4.9 7.2 4.3 9.3 4.3 12s.6 4.8 1.9 6.4c1.4 1.7 3.4 2.6 6 2.6 2.3 0 4-.6 5.3-2 1.8-1.8 1.7-4 1.1-5.4-.4-.9-1.2-1.7-2.3-2.3zm-4 3.8c-1 .1-2-.4-2-1.3 0-.7.5-1.5 2.1-1.6h.5c.6 0 1.1.1 1.6.2-.2 2.3-1.3 2.7-2.2 2.7z\"></svg><span class=\"wp-block-social-link-label screen-reader-text\">Threads</span></a></li></ul>\n\n\n\n<p></p>\n<p>The post <a href=\"https://weston.ruter.net/2025/06/05/eliminating-layout-shifts-in-the-video-block/\">Eliminating Layout Shifts in the Video Block</a> appeared first on <a href=\"https://weston.ruter.net\">Weston Ruter</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Thu, 05 Jun 2025 21:09:42 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:12:\"Weston Ruter\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:21;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:66:\"Felix Arntz: Introducing the View Transitions Plugin for WordPress\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:30:\"https://felix-arntz.me/?p=2122\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:74:\"https://felix-arntz.me/blog/introducing-view-transitions-wordpress-plugin/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:16276:\"<p>I&#8217;m thrilled to announce a new plugin from the WordPress Core Performance Team: <a href=\"http://wordpress.org/plugins/view-transitions/\" rel=\"noreferrer noopener\" target=\"_blank\">View Transitions</a>! This experimental plugin brings the power of the <a href=\"https://developer.chrome.com/docs/web-platform/view-transitions/cross-document\" rel=\"noreferrer noopener\" target=\"_blank\">cross-document View Transitions browser API</a> to your WordPress site, allowing for smoother, animated transitions between page navigations.</p>\n\n\n\n<h2 class=\"wp-block-heading\">View Transitions?</h2>\n\n\n\n<p>Traditionally, moving from one page (or, technically, URL) to another on the web has always involved an abrupt, &#8220;hard&#8221; reload. While this might seem completely natural to many of us on the web, user expectations have shifted drastically in the past (almost) two decades.</p>\n\n\n\n<p>Native mobile applications, with their seamless in-app navigations and smooth transitions, have set a new bar for user experience. This has led web developers to try to catch up with that experience, often turning to Single Page Applications (SPAs). While SPAs aim to mimic native app navigations by dynamically updating content without full page reloads, this often comes with increased development complexity and a shift in how you structure your entire website, often at the cost of accessibility or performance.</p>\n\n\n\n<p>Now, with <a href=\"https://developer.chrome.com/docs/web-platform/view-transitions/cross-document\">cross-document view transitions</a>, you can achieve that desired user experience through smooth transitions on the web without any extensive overhaul of your website. And the new <a href=\"http://wordpress.org/plugins/view-transitions/\">View Transitions</a> plugin makes it super simple in WordPress.</p>\n\n\n\n<span id=\"more-2122\"></span>\n\n\n\n<h2 class=\"wp-block-heading\">How Do View Transitions Work in WordPress?</h2>\n\n\n\n<p>As soon as you have activated the plugin on your WordPress site and navigate between a few pages of your site, you&#8217;ll notice that the plugin implements a gentle fade effect for the transition, creating a more graceful and visually engaging user experience. This is the default behavior not only for the plugin, but also for the View Transitions API in the browser.</p>\n\n\n\n<p>If you want to see a live demo &#8211; you&#8217;re on it! The plugin is active on my site, so for example you could click on the &#8220;Blog&#8221; link in the header navigation. You should see a smooth transition if your browser supports it (see further below). Just make sure to navigate back here afterwards to continue reading. 😁</p>\n\n\n\n<p>(If you want to test it more, you could navigate to the home page by clicking on the site title, scroll down to &#8220;Latest posts&#8221;, then click on the &#8220;View post&#8221; button for this post. When using a large enough viewport, that transition should expand/morph the small featured image from the post in the grid to the much larger featured image shown above. If the animation is too fast, try clicking the Back/Forward button in your browser a few times to get a better sense of what I&#8217;m referring to.)</p>\n\n\n\n<p>Because the nature and style of transitions can be heavily dependent on a theme&#8217;s specific layout and design, the long-term vision is for themes to opt in and customize this behavior. This is facilitated through the WordPress theme support API, for instance by calling <code>add_theme_support( \'view-transitions\' )</code>.</p>\n\n\n\n<p>For now, since this plugin&#8217;s explicit purpose is to enable and showcase view transitions, it automatically enables them across your site, regardless of the theme currently in use.</p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"customizing-view-transitions\">Customizing View Transitions</h2>\n\n\n\n<p>For this initial experimental phase, the plugin offers a user-friendly way to explore different configurations directly within the WordPress admin. You&#8217;ll find settings under <strong>Settings &gt; Reading</strong> that allow you to tweak the view transitions behavior. This UI is primarily for easy exploration and testing at this early stage. Should view transitions make their way into Core, customization would solely be managed through code via the theme support API. That said, even with this early plugin version, themes can already start using the theme support API.</p>\n\n\n\n<h3 class=\"wp-block-heading\">Customizing with <code>add_theme_support()</code></h3>\n\n\n\n<p>To quickly enable view transitions with standard settings, add the following to your theme&#8217;s <code>functions.php</code> file (typically within the <code>after_setup_theme</code> action hook):</p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs language-php\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function</span> <span class=\"hljs-title\">mytheme_setup</span><span class=\"hljs-params\">()</span> </span>{\n	add_theme_support( <span class=\"hljs-string\">\'view-transitions\'</span> );\n}\nadd_action( <span class=\"hljs-string\">\'after_setup_theme\'</span>, <span class=\"hljs-string\">\'mytheme_setup\'</span> );</code></span></pre>\n\n\n<p>For more control, you can pass an array of arguments to <code>add_theme_support( \'view-transitions\', $args )</code>. Here are the available arguments:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong><code>default-animation</code></strong>: Specifies the default animation style for transitions.</li>\n\n\n\n<li><strong><code>post-selector</code></strong>: CSS selector(s) to identify individual post containers, crucial for applying post-specific transitions from archive/listing pages.</li>\n\n\n\n<li><strong><code>global-transition-names</code></strong>: A map (associative array) defining CSS selectors for global elements (like headers or sidebars) and their view transition names that should have persistent <code>view-transition-name</code> values across the entire site.</li>\n\n\n\n<li><strong><code>post-transition-names</code></strong>: A map (associative array) defining CSS selectors for elements <em>within</em> post containers (like titles or featured images) and their view transition names that should animate during transitions to/from single views.</li>\n</ul>\n\n\n\n<p>To provide additional context on what the view transition names are for: Whenever an element has the same view transition name assigned between two URLs that the user navigates between, it will gently morph as part of the transition, maintaining a clear association. For example, a post title in a grid of posts in an archive might scale up in size and move to the top of the page when navigating to its single post URL.</p>\n\n\n\n<p>For the <code>default-animation</code>, a few animations are available by default. Additionally, the plugin provides an API to register additional animations, each of which encompasses a unique identifier, some configuration values, a CSS stylesheet, and optional aliases. I&#8217;m not going to cover this here for now since it&#8217;s a more advanced integration, but ideally in the long term there could be plugins or themes that register their own view transition animations that themes could use. For now, a few basic animations are available out of the box, mostly as an example of what can be done. The initial supported identifiers (and their aliases) are:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>fade</code></li>\n\n\n\n<li><code>slide</code>\n<ul class=\"wp-block-list\">\n<li><code>slide-from-right</code></li>\n\n\n\n<li><code>slide-from-bottom</code></li>\n\n\n\n<li><code>slide-from-left</code></li>\n\n\n\n<li><code>slide-from-top</code></li>\n</ul>\n</li>\n\n\n\n<li><code>swipe</code>\n<ul class=\"wp-block-list\">\n<li><code>swipe-from-right</code></li>\n\n\n\n<li><code>swipe-from-bottom</code></li>\n\n\n\n<li><code>swipe-from-left</code></li>\n\n\n\n<li><code>swipe-from-top</code></li>\n</ul>\n</li>\n\n\n\n<li><code>wipe</code>\n<ul class=\"wp-block-list\">\n<li><code>wipe-from-right</code></li>\n\n\n\n<li><code>wipe-from-bottom</code></li>\n\n\n\n<li><code>wipe-from-left</code></li>\n\n\n\n<li><code>wipe-from-top</code></li>\n</ul>\n</li>\n</ul>\n\n\n\n<p>You can customize any or all of the supported arguments by passing an array to <code>add_theme_support()</code>. Here’s an example modifying all available options:</p>\n\n\n<pre class=\"wp-block-code alignwide\"><span><code class=\"hljs language-php\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function</span> <span class=\"hljs-title\">mytheme_custom_view_transitions_setup</span><span class=\"hljs-params\">()</span> </span>{\n	add_theme_support( <span class=\"hljs-string\">\'view-transitions\'</span>, <span class=\"hljs-keyword\">array</span>(\n		<span class=\"hljs-string\">\'default-animation\'</span>       =&gt; <span class=\"hljs-string\">\'wipe-from-right\'</span>,\n		<span class=\"hljs-string\">\'post-selector\'</span>           =&gt; <span class=\"hljs-string\">\'.wp-block-post.post, article.post, article.entry\'</span>,\n		<span class=\"hljs-string\">\'global-transition-names\'</span> =&gt; <span class=\"hljs-keyword\">array</span>(\n			<span class=\"hljs-string\">\'.site-branding\'</span> =&gt; <span class=\"hljs-string\">\'logo\'</span>,\n			<span class=\"hljs-string\">\'.site-header\'</span>   =&gt; <span class=\"hljs-string\">\'header\'</span>,\n        	),\n        	<span class=\"hljs-string\">\'post-transition-names\'</span>   =&gt; <span class=\"hljs-keyword\">array</span>(\n			<span class=\"hljs-comment\">// These are mostly just the defaults, but there\'s one extra entry.</span>\n			<span class=\"hljs-string\">\'.wp-block-post-title, .entry-title\'</span>     =&gt; <span class=\"hljs-string\">\'post-title\'</span>,\n			<span class=\"hljs-string\">\'.wp-post-image\'</span>                         =&gt; <span class=\"hljs-string\">\'post-thumbnail\'</span>,\n			<span class=\"hljs-string\">\'.wp-block-post-content, .entry-content\'</span> =&gt; <span class=\"hljs-string\">\'post-content\'</span>,\n			<span class=\"hljs-string\">\'.post-meta\'</span>                             =&gt; <span class=\"hljs-string\">\'post-meta\'</span>, <span class=\"hljs-comment\">// Additional entry.</span>\n		),\n	) );\n}\nadd_action( <span class=\"hljs-string\">\'after_setup_theme\'</span>, <span class=\"hljs-string\">\'mytheme_custom_view_transitions_setup\'</span> );</code></span></pre>\n\n\n<p>As you can see in this example, which also indicates some of the default values, they aim to capture common patterns that work across block themes and classic themes alike. That said, block themes are likely a perfect fit for view transitions, given their more predictable nature in markup due to using exclusively blocks.</p>\n\n\n\n<p>The default values for all the supported arguments are based partly on WordPress-generated classes that should almost always be included in WordPress sites, and partly on very common conventions. The goal is that the defaults should work well for the majority of WordPress sites. That said, it is impossible to make it look perfect for every possible WordPress theme. That&#8217;s precisely why the theme support approach was chosen for making View Transitions available in WordPress.</p>\n\n\n\n<h3 class=\"wp-block-heading\">Customizing via <em>Settings &gt; Reading</em></h3>\n\n\n\n<p>A limited subset of what can be customized via <code>add_theme_support</code> is made available via the &#8220;View Transitions&#8221; settings section under <em>Settings &gt; Reading</em>.</p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img alt=\"Settings section of the View Transitions plugin for WordPress\" class=\"wp-image-2131\" height=\"576\" src=\"https://felix-arntz.me/wp-content/uploads/2025/05/view-transitions-wordpress-settings-1024x576.webp\" width=\"1024\" /></figure>\n\n\n\n<p>You can customize the default animation, and the selectors for the default view transition names for both global and post-specific elements. While this means the customization options are limited via the UI, it still allows you to play around with different configurations via UI, and likely for the majority of sites these are the most relevant parameters to customize anyways. Keep in mind that this UI is only supplemental, and it only exists for easy exploration in the plugin. The recommended way to customize is via <code>add_theme_support</code> in your site&#8217;s WordPress theme.</p>\n\n\n\n<h3 class=\"wp-block-heading\">A Note on Configuration Precedence</h3>\n\n\n\n<p>It&#8217;s important to be mindful that, for now, any configurations you make via the Settings UI will take precedence over what is defined in your theme&#8217;s code using <code>add_theme_support()</code>. This is something to keep in mind as you test and explore the plugin.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Browser Support</h2>\n\n\n\n<p>Cross-document view transitions are currently supported in a range of modern browsers, including Chrome, Edge, and Safari. For users on browsers that do not yet support this API, there should be no adverse effects; they will simply experience the traditional hard transitions between pages. You can always check the latest browser compatibility at <a href=\"https://caniuse.com/mdn-css_at-rules_view-transition\" rel=\"noreferrer noopener\" target=\"_blank\">caniuse.com</a>.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Your Feedback is Needed!</h2>\n\n\n\n<p>If you&#8217;re a WordPress theme developer or maintainer, I strongly encourage you to install the <a href=\"http://wordpress.org/plugins/view-transitions/\" rel=\"noreferrer noopener\" target=\"_blank\">View Transitions plugin</a> and give it a spin. Better yet, consider experimenting with adding support directly into your theme using <code>add_theme_support( \'view-transitions\' )</code>.</p>\n\n\n\n<p>And if you&#8217;re simply curious about the feature and want to enable it on your WordPress site, I similarly encourage you to try out the plugin. The Core Performance Team would love to get your feedback.</p>\n\n\n\n<p>While this is a fresh first release and still experimental, like other plugins incubated within the <a href=\"https://wordpress.org/plugins/performance-lab/\" rel=\"noreferrer noopener\" target=\"_blank\">Performance Lab program</a>, it holds the potential to one day become a part of WordPress Core.</p>\n\n\n\n<p>Your early feedback and real-world use cases will be absolutely instrumental in refining this feature, addressing potential issues, and shaping its future.</p>\n\n\n\n<h3 class=\"wp-block-heading\">Join Us at WordCamp Europe 2025 Contributor Day!</h3>\n\n\n\n<p>I&#8217;m publishing this post in a very timely manner &#8211; today is <a href=\"https://europe.wordcamp.org/2025/contributor-day/\">WordCamp Europe 2025 Contributor Day</a>! I&#8217;ll be at the Core Performance Team table, and a key part of our agenda will be testing, discussing, and gathering feedback on this new <a href=\"https://wordpress.org/plugins/view-transitions/\">View Transitions</a> plugin.</p>\n\n\n\n<p>If you&#8217;re attending and are curious to learn more, want to get involved, or have initial thoughts to share, I would love for you to join us. Your insights will be invaluable!</p>\n\n\n\n<h3 class=\"wp-block-heading\">Feedback and Contributions</h3>\n\n\n\n<p>As this plugin is in its early stages, your feedback is highly encouraged and deeply appreciated.</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>If you have suggestions, ideas for new features, or encounter any bugs, please <a href=\"https://github.com/WordPress/performance/issues/new/choose\" rel=\"noreferrer noopener\" target=\"_blank\">submit them as an issue in the WordPress Core Performance Team&#8217;s GitHub repository</a>.</li>\n\n\n\n<li>If you need help with troubleshooting or have questions about the plugin, please <a href=\"https://wordpress.org/support/plugin/view-transitions/#new-topic-0\" rel=\"noreferrer noopener\" target=\"_blank\">create a new topic on our support forum</a>.</li>\n</ul>\n\n\n\n<p>And of course, contributions are always welcome! You can learn more about how to get involved by checking out the <a href=\"https://make.wordpress.org/performance/handbook/get-involved/\" rel=\"noreferrer noopener\" target=\"_blank\">Core Performance Team Handbook</a>.</p>\n\n\n\n<p>I&#8217;m really excited to see how the community uses and shapes this new feature!</p>\n<p>The post <a href=\"https://felix-arntz.me/blog/introducing-view-transitions-wordpress-plugin/\">Introducing the View Transitions Plugin for WordPress</a> appeared first on <a href=\"https://felix-arntz.me\">felix-arntz.me</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Thu, 05 Jun 2025 04:09:09 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:5:\"Felix\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:22;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Tammie Lister: May in WordPress\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:34:\"https://binatethoughts.com/?p=1853\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:44:\"https://binatethoughts.com/may-in-wordpress/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:4014:\"<p>This month was full of backlog management, prioritisation and clearing out queues. I focused on identifying where things were blocking and preparing for WordCamp Europe.</p>\n\n\n\n<h3 class=\"wp-block-heading\">Areas of contribution</h3>\n\n\n\n<p>Whilst my focus was on backlog management, it split into two distinct areas:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Closing tickets:</strong> I focused on Trac and the Gutenberg repo for this. Make sure to go oldest first.</li>\n\n\n\n<li><strong>Focusing design: </strong>Ensuring the design queue was clear about what needed design and what required feedback. This was something that arose from contributor input as a point of confusion, and I have made considerable progress through this. I worked on issues, focusing on having only one of those states, and also addressed items in &#8216;needs design&#8217; that were truly ready for implementation, having an agreement in place. This work does need to continue.</li>\n</ul>\n\n\n\n<p>I also began thinking about how to optimise and make reporting easier for backlog management, and I want to bring those discussions to WordCamp Europe. </p>\n\n\n\n<p>Some stats across the backlog management of issues and tickets in Trac and Github.</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Triaged: </strong>around 143</li>\n\n\n\n<li><strong>Closed:</strong> 60</li>\n\n\n\n<li><strong>Prioritised in design</strong>: around 49</li>\n</ul>\n\n\n\n<p>In other contributions, I worked on some designs and gave feedback across a range of tickets. I also began exploring how far DataViews can go and have a list of things to now report from this. It reminded me of the value of pushing the boundaries of our learning features.</p>\n\n\n\n<h3 class=\"wp-block-heading\">Upcoming plans for contribution</h3>\n\n\n\n<p>The big event is WordCamp Europe, which is taking place this week. I will be attending Contribution Day. After that, the following are my objectives:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Extensibility:</strong> Continue my focus on work there and prioritise how to establish criteria for what gets in and what does not. Hopefully, unblocking a range of issues during WordCamp Europe.</li>\n\n\n\n<li><strong>Backlog management: </strong>My work is constant, but I want to explore how it can evolve smarter, potentially utilising systems to manage and enhance workflow.</li>\n\n\n\n<li><strong>Papercuts: </strong>After WordCamp, I will pick this up again with several issues to focus on.</li>\n</ul>\n\n\n\n<p>With WordCamp Europe, I am restricting my plans beyond what I have mentioned above, as things will likely emerge from it and change.</p>\n\n\n\n<h3 class=\"wp-block-heading\">Sponsors this month</h3>\n\n\n\n<p>I now have three company sponsors: <a href=\"https://www.bigscoots.com/\" rel=\"noreferrer noopener\" target=\"_blank\">BigScoots</a>, <a href=\"https://greyd.io/\" rel=\"noreferrer noopener\" target=\"_blank\">Greyd</a> and <a href=\"https://kinsta.com/\" rel=\"noreferrer noopener\" target=\"_blank\">Kinsta</a>. I also have five sponsors through GitHub: <a href=\"https://github.com/aaronjorbin\" rel=\"noreferrer noopener\" target=\"_blank\">Aaron Jorbin</a>, <a href=\"https://github.com/timnashcouk\" rel=\"noreferrer noopener\" target=\"_blank\">Tim Nash</a>, <a href=\"https://github.com/jeffpaul\" rel=\"noreferrer noopener\" target=\"_blank\">Jeffrey Paul</a>, <a href=\"https://github.com/foosantos\" rel=\"noreferrer noopener\" target=\"_blank\">Felipe Santos</a> and <a href=\"https://github.com/scotrumery\">Scot Rumery</a>. To everyone who sponsored me and helped me secure a sponsorship, thank you.</p>\n\n\n\n<p><strong>Want to sponsor me? </strong>You can go through <a href=\"https://github.com/karmatosed\" rel=\"noreferrer noopener\" target=\"_blank\">GitHub</a> or also get in <a href=\"mailto:hello@tammielister.com\" rel=\"noreferrer noopener\" target=\"_blank\">touch</a>.</p>\n\n\n\n<p>There is always sponsorship, of course, that is volunteered, and I&#8217;ll do as much as possible whilst still keeping things flowing – let&#8217;s get contributing!</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Wed, 04 Jun 2025 08:48:26 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:18:\"binatethoughts.com\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:23;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:78:\"Jonathan Desrosiers: WordPress Grab Bag: WCEU, WordPress turns 22, new AI team\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:38:\"https://jonathandesrosiers.com/?p=4833\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:94:\"https://jonathandesrosiers.com/2025/06/wordpress-grab-bag-wceu-wordpress-turns-22-new-ai-team/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:5531:\"<p class=\"\">I haven&#8217;t been doing a great job blogging regularly so far this year. We&#8217;ve now passed the 40% mark of the calendar year, and I&#8217;m hoping to make up for that during the remaining 60% of the time. To get started, here are some thoughts on a few topics that have been on my mind over the course of the last week.</p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-attending-and-presenting-at-wordcamp-europe\">Attending and presenting at WordCamp Europe</h2>\n\n\n\n<p class=\"\">I&#8217;m currently sitting in Terminal A of <a href=\"https://www.massport.com/logan-airport\">Boston Logan International Airport</a> waiting for the first leg of my journey to <a href=\"https://jonathandesrosiers.com/2025/04/speaking-at-wordcamp-europe-2025/\">attend WordCamp Europe in Basel, Switzerland</a>. In addition to the obvious reasons to be excited (seeing friends, meeting new people, checking out what everyone in the community has been building), I&#8217;m also really happy with what my presentation has grown into and can’t wait to present it. It’s not just about the decision making frameworks Core Committers use, but also a reflection on the project&#8217;s foundational philosophies and how they&#8217;ve helped the project thrive.</p>\n\n\n\n<figure class=\"wp-block-image alignwide size-large wp-lightbox-container\"><img alt=\"\" class=\"wp-image-4896 not-transparent\" height=\"576\" src=\"https://jonathandesrosiers.com/wp-content/uploads/2025/06/wceu-title-slide-1024x576.jpg\" width=\"1024\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button></figure>\n\n\n\n<p class=\"\">There are several points in my speaker notes that have stuck with me. I plan to write some additional posts to explore deeper in the coming weeks!</p>\n\n\n\n<p class=\"\">If you&#8217;re unable to join in person, I&#8217;m including the live stream below.</p>\n\n\n\n<figure class=\"wp-embed-aspect-4-3 wp-has-aspect-ratio wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube\"><div class=\"wp-block-embed__wrapper\">\n\n</div></figure>\n\n\n\n<h2 class=\"wp-block-heading\">WordPress reaches 22 years old</h2>\n\n\n\n<p class=\"\">Last week was the 22nd birthday for the WordPress project. The <a href=\"https://wordpress.org/news/2003/05/wordpress-now-available/\">first version of the software was released on May 27, 2003</a>. While 22 is not as exciting as 21, I always enjoy reading the reflections from the community and seeing how the software we all help maintain has changed lives.</p>\n\n\n\n<p class=\"\">I first used WordPress around 2007, and received my first credit for contributing in 2013. This means I’ve now been a user of WordPress for over 80%, and a contributor for over 55% of the project’s lifespan.</p>\n\n\n\n<p class=\"\">Happy Birthday WordPress! <img alt=\"🎉\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f389.png\" style=\"height: 1em;\" /><img alt=\"🎊\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f38a.png\" style=\"height: 1em;\" /><img alt=\"🍾\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f37e.png\" style=\"height: 1em;\" /><img alt=\"🥳\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f973.png\" style=\"height: 1em;\" /></p>\n\n\n\n<h2 class=\"wp-block-heading\">New WordPress AI team</h2>\n\n\n\n<p class=\"\">Also last week, a post was published to <a href=\"https://wordpress.org/news/2025/05/announcing-the-formation-of-the-wordpress-ai-team/\">announce the formation of a new AI team for the project</a>. I&#8217;m really looking forward to this team getting started. Initially, the <a href=\"https://make.wordpress.org/core/2023/05/02/lets-talk-wordpress-core-artificial-intelligence/\">stance of the Core team</a> was to observe and wait for the needs to become more clear. But the time has come to explore taking action in some important areas. Specifically extensibility of the block editor, documentation, and ensuring any necessary internal functionality is available through APIs.</p>\n\n\n\n<p class=\"\">Near term, I think once some of these items have a plan to be addressed, what could make the most sense is several canonical AI plugins that integrate with different models or services similar to how importing site content works (WordPress, Tumblr, Movable Type/TypePad, etc. each have their own plugin).</p>\n\n\n\n<p class=\"\">If you have thoughts about the place AI has in the project, join the conversation in the <a href=\"https://wordpress.slack.com/archives/C08TJ8BPULS\">#core-ai channel</a> of the <a href=\"https://make.wordpress.org/chat/\">WordPress.org Slack</a>!</p>\n\n\n\n<p class=\"has-text-align-right\"><em>Featured image credit: <a href=\"https://creativecommons.org/publicdomain/zero/1.0/\">CC0</a> licensed <a href=\"https://wordpress.org/photos/photo/8456505dd5/\">photo</a> by <a href=\"https://www.nilovelez.com/\">Nilo Velez</a> from the <a href=\"https://wordpress.org/photos/\">WordPress Photo Directory</a>.</em></p>\n<p>The post <a href=\"https://jonathandesrosiers.com/2025/06/wordpress-grab-bag-wceu-wordpress-turns-22-new-ai-team/\">WordPress Grab Bag: WCEU, WordPress turns 22, new AI team</a> appeared first on <a href=\"https://jonathandesrosiers.com\">Jonathan Desrosiers</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Tue, 03 Jun 2025 11:32:01 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:19:\"Jonathan Desrosiers\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:24;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:75:\"Tammie Lister: Optimising Triage and Review Processes in WordPress Using AI\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:34:\"https://binatethoughts.com/?p=1826\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:88:\"https://binatethoughts.com/optimising-triage-and-review-processes-in-wordpress-using-ai/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:7538:\"<p>Integrating advancements into open source processes makes sense. The friction often comes in the how and the usefulness. While AI holds immense potential for revolutionising triage and review processes, it&#8217;s crucial to acknowledge its current limitations and look to where it can evolve, learn, and grow to its full capacity. This post aims to explore this potential, offering a realistic perspective. It&#8217;s not a post that claims to solve everything; instead, it will show how we can get started and regain some hours to focus on other needed areas of the project.</p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img alt=\"\" class=\"wp-image-1827\" height=\"1024\" src=\"https://binatethoughts.com/wp-content/uploads/2025/06/openart-38ad7cab-43e0-4eed-be32-4d7835b68423.png\" width=\"1024\" /></figure>\n\n\n\n<p>Before we delve into this topic, it&#8217;s important to note that while AI can achieve a great deal, it also has its limitations. This post will focus on high-level inferences rather than direct proposals, starting with small steps. I don&#8217;t have all the answers, but together, we can find them. My perspective is informed by extensive theme reviews and ongoing triage work, so I won&#8217;t cover areas where I lack knowledge.</p>\n\n\n\n<h2 class=\"wp-block-heading\">What can it do today</h2>\n\n\n\n<p>In simple terms, the things we likely shouldn&#8217;t be doing manually include reviews, first-pass triage, testing and routine checks. Historically, there have been areas where we have been slowly adding more processes over time before the term AI was widely used. That&#8217;s one of the key things: often, having a robust process, a path trodden and documented, means the parsing is simple to learn, and therefore you can hand it over more easily.</p>\n\n\n\n<p>Triage is already being done incredibly effectively in areas like healthcare. There it is improving accuracy and saving lives, as noted in an article by Reuters:</p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>&#8220;Our study provides the first multinational evidence that artificial intelligence can help enhance accuracy&#8221; in determining HER2 clinical categories, &#8220;potentially closing critical diagnostic gaps and enabling more patients to have access to new therapies, said Dr. Marina De Brot of the A.C. Camargo Cancer Center in Sao Paulo, Brazil, who led the study.<br />&#8220;Until recently, most of these patients would have not been offered these options,&#8221; she said.&#8221;<br /><a href=\"https://www.reuters.com/business/healthcare-pharmaceuticals/health-rounds-amgen-blood-platelet-booster-helps-patients-who-need-chemotherapy-2025-05-30/?utm_source=chatgpt.com\">Link</a>: Reuters</p>\n</blockquote>\n\n\n\n<h2 class=\"wp-block-heading\">A triage first-pass</h2>\n\n\n\n<p>The first area is improving first-pass triages. What do I mean by this? In simple terms, doing a lot of the manual work like duplicate label removal, closing after a specific time, checking for details and even duplicate issue detection. Pattern-matching tasks are where these systems excel, and a lot of this is simply a matter of pointing to our learnings during triage and matching them accordingly.</p>\n\n\n\n<p>This is basic; it&#8217;s not AI as much as it&#8217;s processing. It&#8217;s one step above issue templates. The following piece is where it gets interesting: the model for triage needs to learn comprehension of the issue contents. We need to add features like dashboards to the flow because the first stage could be a catch-all that, over time, allows it to triage more to a buffer dashboard, recommending specific states. </p>\n\n\n\n<p>All of these approaches are an excellent way of training, as it provides the model with some freedom to make mistakes, be corrected, learn from them, and refine its patterns. We also collectively don&#8217;t have to worry about labels being added and things closed. Whilst those of us doing triage, get to benefit early on and help train.</p>\n\n\n\n<h2 class=\"wp-block-heading\">The impact of triage processing</h2>\n\n\n\n<p>As far as triage goes, we will be far from achieving full automation of this for quite some time. My instinct is that this is more of a help in clearing a percentage and making it easier for those working on issues. It can do that in significant numbers, to the extent that over 50% of the time spent in triage could be recovered I&#8217;d suggest sooner over later. I do see this going up over time, but how much depends on the quality of the modelling and our trust as a project.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Theme review first-pass</h2>\n\n\n\n<p>Just as triage, I suggest adopting a similar model for theme reviews. In this case, too, if we are honest, reviewing what we do and don&#8217;t want in reviews would be beneficial. I will be bold here, but nearly 100% of theme reviewing could be done through a process without manual interaction fairly soon.</p>\n\n\n\n<p>How do we get there? We achieve this through a balance of reviewing the theme review guidelines and, similarly, triage training. These reviews are very formulaic and matching. This is what models thrive on. Suppose we gain trust in this approach and implement the process. In that case, we can then focus all our effort on manual reviewing in various areas, including raising the quality of the core product, documentation, education, and our theme offerings as a project.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Testing</h2>\n\n\n\n<p>We have, over the years, even before the recent AI tech wave, been leaning into less manual testing. Issues and tickets needed less manual testing. We require testing for regression across all areas in our project. That&#8217;s not AI, but we can take it even further, adopting a more updated approach to our testing.</p>\n\n\n\n<p>The reality of the world today is that you can share a screenshot with code editors and get an application mocked up that looks like that. We also need to evolve our systems to test for differences and minimise the need for multiple humans to be involved in each ticket.</p>\n\n\n\n<h2 class=\"wp-block-heading\">What will we do if it does this?</h2>\n\n\n\n<figure class=\"wp-block-image size-full\"><img alt=\"\" class=\"wp-image-1829\" height=\"1024\" src=\"https://binatethoughts.com/wp-content/uploads/2025/06/openart-48c1cda1-444d-40e3-89b1-5d046bc4143f.png\" width=\"1024\" /></figure>\n\n\n\n<p>I share these perspectives as someone who performs triage and frequently engages in this manual work. Some may be sceptical or wonder how their sponsored time will be allocated. The point is that there is a great deal that needs to be done in this project. These systems to implement today&#8217;s technology need people. The models require training by experts. Then they need to be nurtured and grown by those same people. There will always be a need for contributors.</p>\n\n\n\n<p>At this time, with our capabilities in automation and AI in a world of agentic flows, we can do better than relying solely on manual processes. We must do so in order not to be left behind. It is also not resourceful to use humans this way. We can use our scarce human resources more sensibly. Our time is finite, and this project requires us to accomplish many tasks. There will be a balance between what we automate and utilise as resources and what we provide to a system. That, though, is something we need to start working out, and we do that by realising we need to find a balance in how we do things and measure the costs of our processes today and in the future.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Sun, 01 Jun 2025 12:42:01 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:18:\"binatethoughts.com\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:25;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:103:\"Do The Woo Community: Building Reliable WooCommerce Sites: Insights into Hosting, Scaling, and Workflow\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:47:\"https://openchannels.fm/?post_type=blog&p=97002\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:103:\"https://openchannels.fm/building-reliable-woocommerce-sites-insights-into-hosting-scaling-and-workflow/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:222:\"Shared strategies to ensure reliable WooCommerce performance during traffic spikes, emphasizing standardized processes, trusted hosting partnerships, and automated testing to foster client trust and ease agency operations.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Thu, 29 May 2025 12:38:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:26;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:126:\"Do The Woo Community: Launching Upload Worthy: Video Strategy, Brand Awareness, and Conversions for WordPress Product Creators\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:32:\"https://openchannels.fm/?p=97496\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:126:\"https://openchannels.fm/launching-upload-worthy-video-strategy-brand-awareness-and-conversions-for-wordpress-product-creators/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:229:\"The inaugural episode of \"Upload Worthy\" explores video marketing strategies with hosts Christian Taylor and Adam Weeks. They discuss timing for video investment, brand awareness versus conversions, and measuring content success.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Thu, 29 May 2025 09:57:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:27;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:85:\"WordPress Foundation: Thank You, Automattic: Announcing the Open Horizons Scholarship\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:42:\"https://wordpressfoundation.org/?p=1201015\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:104:\"https://wordpressfoundation.org/news/2025/thank-you-automattic-announcing-the-open-horizons-scholarship/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:1467:\"<p>We’re thrilled to announce the Open Horizons Scholarship, a new initiative to help contributors from underrepresented regions attend flagship WordCamp events, made possible through a generous $30,000 donation from Automattic to the WordPress Foundation.</p>\n\n\n\n<p>Thank you, Automattic, for funding this important work. Your support expands opportunities for contributors around the world to participate in person, starting with WordCamp US 2025.</p>\n\n\n\n<p>The scholarship will be managed by the WordPress Foundation, which will oversee the application and selection process and ensure that funds are distributed equitably. This new program joins the Kim Parsell Memorial Scholarship and the Diversity Scholarship by WordPress Community Support, reinforcing a shared commitment to a more inclusive and globally representative WordPress community.</p>\n\n\n\n<p>If your company believes in a more diverse, open, and accessible web, we invite you to join us. Support a scholarship. Sponsor a contributor. Help build the future of WordPress, together</p>\n\n\n\n<p><strong>Interested in applying?<br /></strong><a href=\"https://automattic.survey.fm/open-horizons-scholarship\">Apply for the Open Horizons Scholarship</a> and take your next step toward joining the flagship WordCamp experience. To learn more, you can read <a href=\"https://automattic.com/2025/05/28/automattic-open-horizons-scholarship/\">Automattic’s full announcement</a> about the program.</p>\n\n\n\n<p></p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Wed, 28 May 2025 19:28:55 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:12:\"Isotta Peira\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:28;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:95:\"WPTavern: #171 – Felix Arntz on How Speculative Loading Is Speeding Up Your WordPress Website\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:48:\"https://wptavern.com/?post_type=podcast&p=196101\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:109:\"https://wptavern.com/podcast/171-felix-arntz-on-how-speculative-loading-is-speeding-up-your-wordpress-website\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:60964:\"<details>Transcript<div>\n<p>[00:00:19] <strong>Nathan Wrigley:</strong> Welcome to the Jukebox Podcast from WP Tavern. My name is Nathan Wrigley.</p>\n\n\n\n<p>Jukebox is a podcast which is dedicated to all things WordPress, the people, the events, the plugins, the blocks, the themes, and in this case, how speculative loading is speeding up your WordPress website.</p>\n\n\n\n<p>If you&#8217;d like to subscribe to the podcast, you can do that by searching for WP Tavern in your podcast player of choice, or by going to wptavern.com/feed/podcast, and you can copy that URL into most podcast players.</p>\n\n\n\n<p>If you have a topic that you&#8217;d like us to feature on the podcast, I&#8217;m keen to hear from you and hopefully get you, or your idea, featured. On the show. Head to wptavern.com/contact/jukebox, and use the form there.</p>\n\n\n\n<p>So on the podcast today we have Felix Arntz. Felix is a Senior Software Engineer at Google, and a WordPress Core contributor from Germany, currently residing in San Francisco, California. He helped establish the WordPress Core performance team, and has been heavily contributing to its efforts. He has been using WordPress for a decade and contributing back to the project since 2015. More recently, he has stepped into the role of the inaugural performance lead for the WordPress 6.2 release, and subsequently of the 6.3 and 6.8 releases. In the latter release, he spearheaded development, and launch, of the new speculative loading feature, which is the focus of the podcast today.</p>\n\n\n\n<p>Speculative loading is one of the most important, and yet, almost invisible performance enhancements of recent times. If you&#8217;re on WordPress 6.8, this new feature is already active on your site, working quietly in the background to make page navigation faster, but you might never know from the WordPress UI. There&#8217;s no menu, no toggle, and no obvious indicator to show it&#8217;s there.</p>\n\n\n\n<p>Felix explains exactly what speculative loading is and why it feels almost like browser magic. The Ability for WordPress, using the browser&#8217;s new Speculation Rules API to load the next page just as the user is about to visit it. It&#8217;s a clever use of browser signals like mouse clicks, and hovers, to anticipate navigation, shaving off precious milliseconds, sometimes even providing what feels like an instant page load.</p>\n\n\n\n<p>Felix clarifies the difference between conservative and more aggressive approaches to speculative loading. And why the WordPress core team opted for the safest, least wasteful, option by default, while still giving developers or advanced users the hooks and tools to customize, or even disable it, as needed.</p>\n\n\n\n<p>Felix discusses the origins of the feature as a plugin, the testing and data collection undertaking with tens of thousands of sites, and how this real world data gave the team confidence to ship speculative loading to all WordPress users. We talk about what those performance wins mean at scale, how a 2% improvement on 43% of the internet translates into saving users untold hours of waiting collectively.</p>\n\n\n\n<p>We also get into the weeds on measurement and methodology, how the team uses data from the Chrome user Experience Report and HTTP Archive to track web performance, prioritize features, and validate real world impact. Felix offers insights into how these global, anonymized data, sets allow the performance team to make truly data-driven decisions.</p>\n\n\n\n<p>Beyond the tech, Felix addresses practical considerations such as how to opt out or fine tune speculative loading if you have specific needs. How environmental concerns are balanced by default configurations. And how plugins or agencies might build on this foundation in the future.</p>\n\n\n\n<p>If you&#8217;ve ever wondered how large scale browser level improvements make their way into WordPress Core, or simply want to know if there&#8217;s a way to make your own WordPress site that much faster, this episode is for you.</p>\n\n\n\n<p>If you&#8217;re interested in finding out more, you can find all of the links in the show notes by heading to wptavern.com/podcast, where you&#8217;ll find all the other episodes as well.</p>\n\n\n\n<p>And so without further delay, I bring you Felix Arntz. I am joined on the podcast by Felix Arntz. Hello, Felix.</p>\n\n\n\n<p>[00:04:46] <strong>Felix Arntz:</strong> Hey. Happy to be here.</p>\n\n\n\n<p>[00:04:47] <strong>Nathan Wrigley:</strong> Yeah, thank you. I appreciate you joining us. Felix is joining us all the way from California. I&#8217;m in the UK so there&#8217;s a big time gap. And I appreciate you getting up early and talking to me. That&#8217;s fantastic.</p>\n\n\n\n<p>Felix is going to be talking to us today about something which is now in WordPress, and you may not even know that it&#8217;s in there because there&#8217;s nothing to see here. But the endeavor of what Felix has built is to make all WordPress websites basically immediately better. More performant, so that the end users of your websites will be able to access your content more quickly.</p>\n\n\n\n<p>It is something that&#8217;s really fascinating. But before we begin digging into all that, I know it&#8217;s a dreadfully banal question, Felix, but would you just tell us who you are so that people understand your credentials in the WordPress space?</p>\n\n\n\n<p>[00:05:32] <strong>Felix Arntz:</strong> Sure. Thank you. I have been contributing to WordPress now for 10 years. So I started as a freelancer building websites using WordPress, and eventually got into contributing to WordPress Core after I went to my first WordCamp, which was a great way to get started.</p>\n\n\n\n<p>Yeah, ever since then I&#8217;ve been contributing to WordPress Core, and eventually became a Core Committer. And now, for over six years, I&#8217;ve been working at Google, the team where we focus on CMS projects for the most part. So I&#8217;ve been, especially in the last good three years or so, I&#8217;ve been sponsored by Google to contribute to WordPress with a specific focus on improving performance.</p>\n\n\n\n<p>So our team essentially co-founded the WordPress performance team, which is an official part of the wordpress.org project. And ever since that was founded in late 2021, we&#8217;ve been contributing to that effort, and the speculative loading feature is a big part of that.</p>\n\n\n\n<p>[00:06:25] <strong>Nathan Wrigley:</strong> That&#8217;s what we&#8217;re going to talk about today. Can I just rewind a little bit though, and talk about Google for a minute. So, are you employed by Google to commit to WordPress Core? Do you spend a hundred percent of your time working on WordPressy things, or do you have a proportion of your time which is devoted to more, and I&#8217;m doing air quotes, Google things?</p>\n\n\n\n<p>[00:06:46] <strong>Felix Arntz:</strong> Yeah, I mean, I wouldn&#8217;t say that I contribute a hundred percent of my time, but a good chunk, probably 70, 80 or something. Our focus is, when it&#8217;s not on WordPress, it&#8217;s still on other somewhat related open source projects. So we have been contributing, we&#8217;ve been also working with other CMSs here and there.</p>\n\n\n\n<p>[00:07:02] <strong>Nathan Wrigley:</strong> Yeah, that&#8217;s interesting because I know that Google have a big presence. If you go to the flagship WordPress events, you know, WordCamp Asia, WordCamp US, and so on, then Google very often have a huge advertising booth. You know, they&#8217;re a global partner if you like.</p>\n\n\n\n<p>But drawing the line between Google and Open Source CMS is a little bit hard to do. It&#8217;s almost like a philanthropic thing. Because I guess their job is to just try and make the internet better and part of it, if they can make 43% of the internet better by seconding somebody like you to commit to the project, that&#8217;s just good for everybody.</p>\n\n\n\n<p>So yeah, bravo to Google. I appreciate the fact that they&#8217;re sponsoring you and helping the project in that way.</p>\n\n\n\n<p>Also bravo to you and the team, the Performance Team. It is just a relentless good news story coming out of the Performance Team. So, I don&#8217;t know, when did you say, 2019 it was founded?</p>\n\n\n\n<p>[00:07:54] <strong>Felix Arntz:</strong> Late 2021, but things really kicked off like mid 2022 I feel.</p>\n\n\n\n<p>[00:07:58] <strong>Nathan Wrigley:</strong> Yeah, and I am habitual about the WordPress news, and it just never stops. The Performance Team do something profound, help everybody out, it just ships into Core. Most people don&#8217;t even know that things have happened because, you know, they&#8217;re not in the baseball in the same way that you and I probably are.</p>\n\n\n\n<p>A profound thanks. Maybe there was just this massive backlog of things that needed to be tackled. Maybe not. But it did seem that the minute the doors opened to the Performance Team, lots of dominoes fell really quickly.</p>\n\n\n\n<p>So thank you on behalf of me and everybody who uses WordPress for the work that, I don&#8217;t know whether you feel that you get the credit that&#8217;s due to you, but I&#8217;m giving you some credit now, so thank you.</p>\n\n\n\n<p>[00:08:37] <strong>Felix Arntz:</strong> Thank you. I appreciate it. That&#8217;s definitely great to hear.</p>\n\n\n\n<p>[00:08:39] <strong>Nathan Wrigley:</strong> I&#8217;m pleased you know, that there&#8217;s people as capable as you who are doing this kind of work and that you&#8217;re willing to do it in the background. And a big piece of that is what we&#8217;re going to talk about today.</p>\n\n\n\n<p>Landed in WordPress 6.8, but has a history prior to that as a plugin. It&#8217;s called speculative loading. It sounds impressive. But it also, I guess it is impressive and it&#8217;s a bit like voodoo. It&#8217;s kind of doing things that you wouldn&#8217;t imagine were possible. Do you want to just tell us what it is? What is speculative loading?</p>\n\n\n\n<p>[00:09:08] <strong>Felix Arntz:</strong> So essentially, speculative loading, the idea is that when you navigate to a new URL, when you are browsing through a website and you go to a URL, the moment that you land on the URL, it starts loading. And we probably know that the performance aspect of that is very important to the user experience.</p>\n\n\n\n<p>So if a page takes, I don&#8217;t know, three seconds to load, that&#8217;s not great. If it takes eight seconds to load, it&#8217;s probably horrible of a user experience. And so one of the performance team&#8217;s goals is to make that time that it takes a load shorter. So what then speculative loading does is load the URL, the idea is that it loads the URL before you even get there.</p>\n\n\n\n<p>[00:09:47] <strong>Nathan Wrigley:</strong> Yeah, that&#8217;s the bit that&#8217;s voodoo. That&#8217;s the bit that just sounds like you&#8217;ve basically hopped into Back to the Future and you&#8217;ve gone back in time a moment or something. It&#8217;s very counterintuitive. So you are going to have to explain, how on earth does it do that?</p>\n\n\n\n<p>[00:09:59] <strong>Felix Arntz:</strong> Right, right. Essentially, there are browser, there are heuristics which can be relied upon to hopefully assume correctly that a URL will be visited. So when you are on a page on the website, there is of course links to other pages on the website. So if you hover over the link with your mouse, if you&#8217;re on a computer for instance, and you hover over the link with your mouse, maybe you&#8217;ll click it. That&#8217;s like one level of signal. It&#8217;s not the strongest signal.</p>\n\n\n\n<p>But then an even stronger signal is when you actually click the link. When you click a link, you want to go to that URL. I think that&#8217;s a fair assumption in like 99 plus percent of cases. So when you click on the link, that&#8217;s technically still before you&#8217;re at the other URL though. We&#8217;re talking about milliseconds. You probably think when you click, you are already on the other URL, but that&#8217;s not the reality. There is like maybe, I don&#8217;t know, 200, 300, 500, however long it takes, there are some milliseconds in between the time you actually click and that the other URL opens.</p>\n\n\n\n<p>So by loading, for instance, by loading a URL, when you click on the link, you still gain those, whatever, maybe 500 milliseconds. I&#8217;m just going to make that up now, and reduce the actual load time by that.</p>\n\n\n\n<p>[00:11:07] <strong>Nathan Wrigley:</strong> Let me just prize that apart. So we are now going to talk about a tiny fraction of time. For the next few minutes, we&#8217;re going to be talking about literal milliseconds. So let me imagine that I&#8217;m on my computer, desktop computer, let&#8217;s start there. I&#8217;m on a webpage and there&#8217;s a bunch of links, buttons, what have you.</p>\n\n\n\n<p>I&#8217;m holding my mouse, my mouse approaches the button and it begins to slow down, you know, because at some point we have to rest on the button. So there&#8217;s this deceleration of the mouse and the cursor, and it eventually lands there. And then I click it.</p>\n\n\n\n<p>Now my intuition is that the click event is the moment, that&#8217;s when everything begins, if you know what I mean. But are you saying that you can go back in time prior to me actually hitting the button with my finger? Is it the mere fact that, okay, the mouse has come to a standstill, you haven&#8217;t engaged the finger yet. Maybe the finger is literally on the way down in the real world, in this slow motion universe we&#8217;re imagining. Is that kind of it? It&#8217;s taking heuristics about, where is the mouse now? How is it decelerating? Or is it literally he clicked? Because if it&#8217;s the click bit, then I don&#8217;t understand what&#8217;s different to how it usually was because it felt like the click was always the moment.</p>\n\n\n\n<p>[00:12:19] <strong>Felix Arntz:</strong> There are different ways to configure speculative loading. And one way, and that&#8217;s the way that WordPress Core does now, is to only speculatively load on the click. You say now that that feels like it&#8217;s always been like that, but it&#8217;s not quite always been like, that because of what I tried to mention with there&#8217;s still like 500, maybe 300, whatever, little milliseconds time between the click and the actual URL loading.</p>\n\n\n\n<p>So when you hit the other URL, then it starts fetching the HTML document and all the CSS and JavaScript and so on. By doing that already on the click, on the link, on the previous page that you are on, you still gain those, I&#8217;m going to say valuable milliseconds. And we&#8217;re probably talking about at the very least, a hundred milliseconds, maybe a few hundred milliseconds.</p>\n\n\n\n<p>[00:13:04] <strong>Nathan Wrigley:</strong> It doesn&#8217;t sound like a lot, but it&#8217;s, you&#8217;ve invented time out of nowhere. You&#8217;ve completely conjured up time that didn&#8217;t, well, actually you&#8217;ve removed time. You&#8217;ve gone in the opposite direction. But that time was needlessly spent before. Now that time has been saved.</p>\n\n\n\n<p>You also mentioned that the WordPress implementation, and we&#8217;ll get into how you might be able to configure that in a moment, but the default WordPress installation, so this is in every WordPress website from 6.8 onwards, it is set to, and I&#8217;m going to use the word conservative, but it&#8217;s set to a fairly dialed back approach to this Speculation Rules API.</p>\n\n\n\n<p>I&#8217;m curious, and we&#8217;ll get into how you do it in WordPress, but just in terms of the Speculation Rules API, what are some of the more aggressive things that you could do if you wanted to? And is things like the mouse slowing down, is that potentially part of it? Those kind of things.</p>\n\n\n\n<p>[00:13:55] <strong>Felix Arntz:</strong> Right. So maybe let me take a step back, first to clarify that there&#8217;s a speculative loading feature that is in WordPress Core, it&#8217;s built on a browser API that is called Speculation Rules API. We can talk about maybe two things. There&#8217;s like, well, how can you use the Speculation Rules API? There&#8217;s different ways to configure it, and that&#8217;s something that we could apply in WordPress. But then we could go beyond that, and I&#8217;m probably not the best person to speak about that, but we could also think, how can you actually, what could the Speculation Rules API possibly do, that it isn&#8217;t able to do today?</p>\n\n\n\n<p>So in terms of using the Speculation Rules API, it allows different configuration modes in for what is called eagerness. And you actually said it right. It&#8217;s called conservative, the mode that WordPress currently uses. And it just means, I think it is conservative in the sense that it is the safest measure if you want to make sure you only load URLs that the user actually goes to.</p>\n\n\n\n<p>But it&#8217;s also the least performance of all the options. It&#8217;s always a trade off because unfortunately we cannot predict the future, so there&#8217;s no real wizardry going on here. And because of that, there is always going to be a trade off. You can use signals that are very reliable on the user visiting the other URL, like clicking on the link. There is an scenario where you click a link and then you pull your mouse away before you let go of your finger. We probably all have done this, but we probably do this like 1% of our clicks, if even that. But people do this occasionally, very occasionally.</p>\n\n\n\n<p>So that&#8217;s the way where a click would not trigger the actual URL to the link to be, that wouldn&#8217;t result in the user visiting the other URL. This would be the one example where conservative speculative loading would still load the other URL and the user wouldn&#8217;t go to it. But I think that risk, that trade off is very, very little because of how rarely that happens.</p>\n\n\n\n<p>[00:15:46] <strong>Nathan Wrigley:</strong> Right, so the posture of the Performance Team was to go conservative. So although it&#8217;s not the most performant, it is the least likely to end up in, you know, needlessly downloading content that is perhaps never going to be looked at.</p>\n\n\n\n<p>But again, just moving ourselves away from WordPress for a minute, the Speculation Rules API, if we were to go on the more eager side, what kind of things could be brought to bear? And again, not in the WordPress setup at the moment, but I know that you can modify those things. But what can the Rules API do, if you go like full eager?</p>\n\n\n\n<p>[00:16:18] <strong>Felix Arntz:</strong> Right. So you can also use, the next after conservative is called moderate. That uses signals that are less explicit, like a hover. Again, I have to specify, on desktop it uses hovering, because on the phone you can&#8217;t hover, like you don&#8217;t have a mouse and it doesn&#8217;t know where your finger is if you don&#8217;t press the screen.</p>\n\n\n\n<p>So, essentially, moderate on desktop, it relies on the hover over a link to preload the URL that is behind that link. So that generally, yeah, of course if you hover over link and then you click it, there may be like a second, easily a second between this, or there may even be five seconds in between those two actions, right? And sometimes you hover and click immediately. Other times you hover and you get back there, and then you click, and in that case, the whole page can technically be already loaded.</p>\n\n\n\n<p>So that&#8217;s the part where speculative loading, if you configure it more eagerly, you can get to situations where you get instant page load. You go to the other page and it&#8217;s already completely loaded. There&#8217;s, for instance, there is also Core Web Vitals, metric Largest Contentful Paint, which measures the load time speed. So you can get to an LCP of zero. Like, literally. If you use it, for instance as moderate eagerness, let&#8217;s say your page normally takes two seconds to load completely, and you hover over a link, and then you get back there like three seconds later, you click, it&#8217;s already there, and your LCP is literally zero because you didn&#8217;t need to wait at all.</p>\n\n\n\n<p>That&#8217;s the performance power that it has. But of course, it does also come with a trade off to consider. Like, how do you configure this in a way that it&#8217;s the least wasteful? And wasteful in the sense of loading URLs that the user does not go to, ends up not navigating to. But you have to basically weigh off, what is the performance gain? How do users typically use your website?</p>\n\n\n\n<p>There&#8217;s also, there&#8217;s a lot of individual configurations that websites may want to do on their specific site. So going back to the conservative option that WordPress now uses, it&#8217;s just that, it&#8217;s simply that we want to give the bare minimum feature and we want to make the feature available in general to WordPress sites. But because WordPress is so massive, you need to go with a literally conservative default.</p>\n\n\n\n<p>[00:18:25] <strong>Nathan Wrigley:</strong> Okay. So that&#8217;s all really interesting, but it sounds like all of this is happening in the browser. So all of these events are being triggered by the browser. Again, forgive my ignorance, I&#8217;m presuming that Chromium, Chrome, Firefox, all of the other variants that there may be out there, I guess they&#8217;re all shipping some variant of this inside the browser because obviously it can&#8217;t be WordPress that&#8217;s doing this.</p>\n\n\n\n<p>If that&#8217;s the case, is there kind of like a broad consortium of people who are working on this initiative, maybe other similar related performance initiatives, and trying to make them all browser compatible?</p>\n\n\n\n<p>[00:19:03] <strong>Felix Arntz:</strong> So there is, the Speculation Rules API is currently, it&#8217;s available in Chrome, Edge and Opera, so in the Chromium based browsers, but it&#8217;s not available yet in Safari and Firefox. That means that people that use Safari or Firefox, they&#8217;re basically just not going to get the benefit.</p>\n\n\n\n<p>[00:19:18] <strong>Nathan Wrigley:</strong> So it&#8217;s like a progressive enhancement. There&#8217;s no downside, it&#8217;s just an upside.</p>\n\n\n\n<p>[00:19:22] <strong>Felix Arntz:</strong> Exactly. So because overall the browsers that support it are very widely used, plus the other browsers not having any negative effects of this feature being on a website, that&#8217;s why we thought it was a good time to roll it out.</p>\n\n\n\n<p>[00:19:36] <strong>Nathan Wrigley:</strong> Okay, that&#8217;s really interesting. It just suddenly, and completely unrelated to the conversation that we&#8217;ve had so far, it kind of makes me think that maybe in the future there&#8217;ll be a hardware layer to this. You know, imagine if my mouse had built into it some pressure sensation, or even proximity sensor where it could perceive that, you know, my finger is descending and it could fire the signal from the mouse to say, yeah, he&#8217;s about to click. Or even in a mobile phone, you know, you were mentioning earlier, we don&#8217;t know where your finger is. Maybe at some point in the future we will know where your finger is.</p>\n\n\n\n<p>[00:20:09] <strong>Felix Arntz:</strong> That would be really powerful, yeah.</p>\n\n\n\n<p>[00:20:10] <strong>Nathan Wrigley:</strong> It&#8217;d be kind of interesting. Okay, you heard it here first. But it&#8217;s not there yet. So, what has been the way that this has been implemented? My understanding is that you launched this as a plugin. I think you got a fairly high user account. I think 30,000, 50,000 or something websites.</p>\n\n\n\n<p>[00:20:27] <strong>Felix Arntz:</strong> I think it&#8217;s now at 50,000.</p>\n\n\n\n<p>[00:20:28] <strong>Nathan Wrigley:</strong> 50,000. So tons of data coming back. And presumably that data gave you the confidence to, yeah, let&#8217;s push this through. And I have a memory that, broadly speaking, you got fairly close to a 2% productivity gain. And obviously at 43% of the web, if we can do things 2% faster, doesn&#8217;t sound like a lot, 2%. But 2% of everything that WordPress gives up, that&#8217;s a lot.</p>\n\n\n\n<p>[00:20:53] <strong>Felix Arntz:</strong> Performance is really like, people say sometimes things are numbers games, but performance is a tiny numbers game. Like it&#8217;s very hard to make performance wins sound very appealing. It&#8217;s like, here is 2% win. We scratched off 80 milliseconds of this, and it&#8217;s like, what is this even, like.</p>\n\n\n\n<p>[00:21:08] <strong>Nathan Wrigley:</strong> But it literally is human years. It&#8217;s probably decades of time when you think about the internet as a whole. If you think about it in that sense, it&#8217;s really quite a lot of time.</p>\n\n\n\n<p>[00:21:18] <strong>Felix Arntz:</strong> Exactly, and I think it&#8217;s important to remind ourselves of that sometimes. I feel myself like announcing something where it&#8217;s like, oh, here we scratched 80 milliseconds off. It sounds like nothing. It is quite something, but it sounds like so little that, I don&#8217;t know, I feel self-consciously saying such a tiny number as a great win.</p>\n\n\n\n<p>But yeah, again, like I think it, you exactly mentioned it, the scale of rolling out performance enhancements like this, it really makes the number matter. And also, people browse so many webpages a day, like even for an individual person. If you go on one website, you easily might visit 10 URLs or more, and that&#8217;s just one website. So think about , again, I&#8217;m just continuing with that number, like if you had 80 milliseconds gain on all the webpages you visit in a day, I don&#8217;t know, it might come out at some seconds, maybe a minute, who knows. And if you do that every single day, like you gain time.</p>\n\n\n\n<p>[00:22:09] <strong>Nathan Wrigley:</strong> Yeah, I agree. It&#8217;s difficult to parse, isn&#8217;t it? The human brain doesn&#8217;t kind of work that microscopic level. That really tiny fraction of time is so difficult to become important. But there&#8217;s this compound interest effect to it. You know, the more that it adds up, the more time you spend on the internet every day clicking things. And I suppose the curious thing here is, nobody even knows that it&#8217;s happened. You would presumably just think, gosh, that is a very quick website. You know, I&#8217;m having a fabulous experience here. Everything&#8217;s loading amazingly. They must have an amazing server set up or, you know, they&#8217;ve got everything configured perfectly. And all the while it&#8217;s the Speculation Rules API working in the background.</p>\n\n\n\n<p>But I think we&#8217;ve got it, you know, it&#8217;s adding up to tons of time, probably years, maybe decades of time when you throw that across the whole footprint that WordPress have.</p>\n\n\n\n<p>However, most people who don&#8217;t follow the WordPress news really, really carefully probably won&#8217;t know about this. And there&#8217;s nowhere to know about it really, apart from WordPress journalism, and the blog posts that go out from the Performance Team. Because there&#8217;s no way in the WordPress UI, there&#8217;s no setting, there&#8217;s no menu item to go to, there&#8217;s no toggle, there&#8217;s none of that.</p>\n\n\n\n<p>So that then leads me to ask, is there a way to modify this? If you have a need for more eager. Or you just wish to, I don&#8217;t know, you&#8217;ve got a desire to turn it off for some reason. Can it be modified with code, with hooks, with whatever?</p>\n\n\n\n<p>[00:23:31] <strong>Felix Arntz:</strong> Yeah, certainly. Quick context on the reason that there is no UI in WordPress Core to control it, is that it&#8217;s considered a very technical feature, and the philosophy of WordPress Core says, decisions not options. That&#8217;s one of the Core philosophies. So try to use defaults that work for the majority, and most people won&#8217;t have to change. And then especially when it comes to very technical things, you don&#8217;t want to bother an end user that just wants to maintain, create their website with, here you need to learn now about this complex Speculation Rules API.</p>\n\n\n\n<p>Like, we already talk about this for like 30 minutes now, and there&#8217;s probably so much more to uncover. So you can imagine that certain site owners don&#8217;t want to deal with that. So that&#8217;s why there&#8217;s no UI in WordPress Core. But it can be modified through hooks like you&#8217;re saying. There are several filters and actions to modify the behavior programmatically.</p>\n\n\n\n<p>And in addition, the Speculative Loading plugin that existed prior to the Core launch, that still exists and it&#8217;s now, when you install it on top of 6.8, it still serves a purpose. While it doesn&#8217;t ship the whole API anymore, because that&#8217;s now part of WordPress Core, it&#8217;s still includes a UI where you can configure it via UI in different ways.</p>\n\n\n\n<p>And it also changes the default behavior of WordPress, for the speculative loading feature. And that&#8217;s essentially because when we started the plugin, we went with a more aggressive default, because we want to know, the plugin only launches at first at small scale, it&#8217;s meant to, especially in the case of a feature plugin, it&#8217;s meant to inform us about how well it&#8217;s working, are there potential issues, and so on.</p>\n\n\n\n<p>So we went with a more more performant configuration out of the box with the Speculative Loading plugin. So if you use the plugin, it will use the moderate eagerness that I mentioned before. And then in addition, it uses, and we haven&#8217;t covered that at all yet, so it pre-renders the URL. So I can explain that briefly.</p>\n\n\n\n<p>The WordPress Core implementation, the Speculation Rules API allows you two alternative modes for speculatively loading a URL. Either you can pre-fetch the URL, or you can pre-render the URL.</p>\n\n\n\n<p>Pre-fetching means you essentially just load the, you get the HTML content already, but then you don&#8217;t do anything else. Like, it doesn&#8217;t load any JavaScript or it doesn&#8217;t load any CSS or images, it still waits with all of that until you go to the other page.</p>\n\n\n\n<p>With pre-render, it does everything, like literally everything. It loads the HTML, it loads also all the JavaScripts, CSS, images and whatever else is on your page. And it even renders this in the browser, like it basically does everything as if you were already on the page in the browser. Let&#8217;s think about it as if you had the page open in another tab and you couldn&#8217;t see it.</p>\n\n\n\n<p>[00:26:08] <strong>Nathan Wrigley:</strong> Yeah, you&#8217;ve just like pulled back a curtain suddenly and there it is. It&#8217;s just, it always there. You just couldn&#8217;t see it and suddenly.</p>\n\n\n\n<p>[00:26:14] <strong>Felix Arntz:</strong> And the pre-rendering is the thing that can get you to those immediate page loads. Because when you use pre-fetching, it only loads the HTML, so then when you get to the page, it&#8217;ll be faster, but you still have to load all the other things, and render it. But pre-render is where, if you have pre-render and eagerness of moderate, and then we go back to our previous example, you hover over link, go back there, two seconds, three seconds later, then you might get this immediate page load with LCP zero.</p>\n\n\n\n<p>[00:26:43] <strong>Nathan Wrigley:</strong> Okay, that&#8217;s really interesting. So you&#8217;ve kind of got two options. The first option is just accept WordPress Core. That&#8217;s how it is. And then, maybe three options. The second option then might be you can modify things with hooks and what have you. And I&#8217;m going to link to the articles that Felix wrote in the blog post that goes with this. So go to wptavern.com and search for the episode and you&#8217;ll be able to find all the bits. It&#8217;s more easy for me to say that than it is to read out the blog titles and things.</p>\n\n\n\n<p>And then the other option, the third option would be to download the plugin, which gives you a UI, but just caveat emptor, beware, it will then automatically make things moderate. It&#8217;s going to be doing things in a more, a slightly more aggressive way.</p>\n\n\n\n<p>[00:27:21] <strong>Felix Arntz:</strong> It brings you better performance, but it might also have more trade offs on, it will load, certainly to some capacity, load URLs that may not be navigated to. If you install the plugin, just keep in mind that the UI that it provides also would allow you to go back to the WordPress Core default. If you just want a UI and you install the plugin, just go into the UI of the plugin immediately, change it back to conservative pre-fetch, and you&#8217;re back at what Core would do as well.</p>\n\n\n\n<p>[00:27:45] <strong>Nathan Wrigley:</strong> Great. Yeah, thank you. Now you mentioned LCP and things like that. And I think there&#8217;s been an obsession for the last, let&#8217;s go for four years, with speed and trying to get Lighthouse scores to be impressive for your website. I&#8217;m curious, is there a way that Google scraping the internet can perceive any of this?</p>\n\n\n\n<p>In other words, if you do this, are you doing it simply to make your visitors happy, because they&#8217;re the people who are doing the clicking or what have you? Or is there some like Core Web Vitals metric which can be improved by this? Because it feels like there couldn&#8217;t be, because I doubt that Google Bot has the capacity to kind of speculatively load anything, but maybe there&#8217;s some flag in the, I don&#8217;t know, I have no idea how that would work.</p>\n\n\n\n<p>[00:28:31] <strong>Felix Arntz:</strong> So, that&#8217;s a great question. I think you&#8217;d, certainly when you apply performance enhancements like this, the goal is that they benefit your website&#8217;s end users. Google, of course, would love to know how well these features work, right? And also the people that work on the actual Speculation Rules API would love to see how the features are used in production, on production sites. And we, as a Performance Team, would also like to know that, how it goes with WordPress specifically.</p>\n\n\n\n<p>So there is a public data set called Chrome User Experience Report, which is sourced from anonymous data from users that use Chrome and have opted into this anonymous data tracking. So there is essentially a data set that collects the performance data of people visiting websites. And that is made publicly available, you can literally, if you know how to use BigQuery, which is this kind of advanced version of MySQL, where you can query gigantic amounts of data, you can query the Chrome User Experience Report data set, and you could be checking like, I don&#8217;t know, as long as sites that appear, it basically aggregates all the page, all the data by origin, so the domain.</p>\n\n\n\n<p>Any site that is relatively popular is in there. I don&#8217;t know exactly what the threshold is, but something like, maybe like at least 50 monthly users or something like that. So then your site will appear in there and you could query this for your own site to see how your site is doing. And you could do this every single month. And you get like a chart, how the performance of your site is doing over time.</p>\n\n\n\n<p>Of course, neither Google nor we as a Performance Team cares about one specific site. We&#8217;re doing things like in our team, we were building things for WordPress, for the WordPress ecosystem, try to improve the performance of the ecosystem as a whole. So I have been working a lot in the past years and learning a lot about this stuff. How to query the Crux, that&#8217;s a short version of it, Crux, the Crux Report, to gain insights on, how do you possibly measure the impact a certain feature has on these metrics?</p>\n\n\n\n<p>There&#8217;s another data set called HTTP Archive, which is the domains that are in this are also sourced from the Crux Report. But what HTTP Archive is, it basically scrapes all of these URLs every single month, one time, and gets all sorts of public information from these URLs, like which technologies it uses, does it use WordPress? Does it use, I don&#8217;t know, React or whatever, all these things. It also stores, from this one momentary point, it also stores the actual HTML body, and it&#8217;s a gigantic data set. And also that is public as well. You can look it up on httparchive.org and how to use it.</p>\n\n\n\n<p>So the goal of these efforts is to make these different performance data and to basically assess the health of the web ecosystem, publicly available, and then also these, especially HTTP Archive has a lot of charts on their own website based on their own data that essentially, yeah, makes it easily available without having to query BigQuery data.</p>\n\n\n\n<p>But when you actually can query BigQuery data, it becomes really powerful. So we can combine the data from HTTP Archive to see which origins are using WordPress. So then we get like a scaled down version of the whole web that is just the WordPress sites. And then we can combine it with the Crux data that has the performance results for all origins, but scope it down to only the origins that use WordPress.</p>\n\n\n\n<p>And that way we can see, for instance, the median LCP for a given month across all WordPress sites is this. Or the median INP and all the other metrics. More importantly, what we have been using as a more important metric though, is what&#8217;s called the passing rate. For every Core Web Vitals metric, there is a threshold where it&#8217;s, under this threshold is good, above this threshold, it&#8217;s not good. So for LCP for instance, that&#8217;s 2.5 seconds.</p>\n\n\n\n<p>And passing rate is essentially the number of, in this example, is the number of origins that have a median LCP that&#8217;s better than 2.5 seconds, the percentage of origins that have an LCP that&#8217;s better than 2.5 seconds. And that you can track over time to see how WordPress LCP is improving or decreasing over time. That&#8217;s how we essentially monitor performance for WordPress at a high level.</p>\n\n\n\n<p>And then we&#8217;ve been doing all sorts of experiments to try to get feature specific improvements. That&#8217;s really the difficult part because these data sets only gather data, the Archive data set only gathers data once a month, the Crux data set gave this data, it has all the data, but only the performance data. So it does not know, at what point did you activate a certain feature or deactivate another feature? That data doesn&#8217;t exist. So we can only make assumptions.</p>\n\n\n\n<p>Like, for instance, even when you want to measure the difference, and like an easy example, and that&#8217;s already complicated, is to measure the difference from one WordPress version to the next. HTTP Archive has data, whether a site is on, let&#8217;s say 6.8 or 6.7, but it&#8217;s from one specific moment in time. And we generally broaden these moments in time to the whole month because that&#8217;s the generally, like they do it once a month. If you see that a site is on 6.8, I think the HTTP Archive runs, like the actual queries usually run somewhere between 20th and 25th of the month.</p>\n\n\n\n<p>So if you see that the site is 6.8, you don&#8217;t know, is the site on 6.8 the entire month or did it just update to 6.8 a day before and most of the month data is actually the previous version? This is just unknowns that we have to deal with. And the data set being so huge, because WordPress is so popular, that helps a lot to sort of like make these unknowns maybe less impactful. Because if you&#8217;re at scale see that 6.8 has a big improvement, we can&#8217;t say that this value precisely is correct, but if it&#8217;s a clear improvement, we can assume that there is an actual improvement to a certain degree.</p>\n\n\n\n<p>And doing that for feature specific level is even more complex. I don&#8217;t think we have time to get into this too much right now, but I just want to say that this 1.9% value that is in the blog post is based on such an effort, where I try to look at all the sites that have speculation rules, and I looked at all the same sites before they activated speculation rules and get this median difference between all of them. And I don&#8217;t even know how to explain anymore because I don&#8217;t remember, because it was so complicated.</p>\n\n\n\n<p>[00:34:42] <strong>Nathan Wrigley:</strong> I am so glad that you are able to explain it though. I mean, firstly, really interesting, all of that, really interesting. Because you just sort of peeled back a whole curtain that I didn&#8217;t even know existed. So there&#8217;s just this aggregated, opted-in data coming out of the browser, dropping into this massive data set. I can only imagine what that is like to deal with.</p>\n\n\n\n<p>But it does mean that you&#8217;ve got anonymised data. You can make reasonable guesses, in the aggregate, about what&#8217;s happening. You know, you can refine it to WordPress, you can refine it to 6.7, 6.8, okay? And day by day, maybe it&#8217;s not meaningful. But if you spread it over one month, six months, what have you, more and more trends start to pop out.</p>\n\n\n\n<p>So you can see over time, you&#8217;ve got this 1.9%. And it, terribly complicated though it might be, I&#8217;m glad that you did that work for us. That&#8217;s amazing. Okay. And I didn&#8217;t know that whole thing was going on.</p>\n\n\n\n<p>And again, getting back to the point that you made at the beginning, the whole purpose of this is to make it better for your users. The purpose is not for the data that Google&#8217;s gathering, but it&#8217;s gathering it. And it&#8217;s helpful because people like you can then use it and make reasonable assumptions about what the rest of us ought to be doing with our WordPress websites. But the key metric there is, does it perform better for your users? And of course, we know the answer to that.</p>\n\n\n\n<p>[00:36:00] <strong>Felix Arntz:</strong> Just wanted to quickly add like we have been, these two data sets have been important source for us as a Performance Team from the very beginning in terms of even prioritising what we work on. There&#8217;s ways to get a high level idea. Like, out of all the 50 things that we could do to improve performance, which have shown to be the most impactful on the web so far outside of WordPress, or maybe even on the few WordPress sites that already use it through some other way. So it has helped a lot on the prioritisation, and personally a big advocate for data driven decision making. And in many parts of the WordPress project, we are not able to do that because we don&#8217;t have much data. But I&#8217;m really pleased that on the performance side, there is this big data set that can be used to see what is actually impactful.</p>\n\n\n\n<p>[00:36:46] <strong>Nathan Wrigley:</strong> Yeah, you can be really confident that your decisions are based upon fact, which is so nice. A lot of the WordPress project is, you know, intuition and design and things like that, and it&#8217;s hard to get agreement about that, and hard to get things right for everybody. But in this case, that&#8217;s slightly different.</p>\n\n\n\n<p>[00:37:00] <strong>Felix Arntz:</strong> For anybody that&#8217;s interested in this to learn more, I did write a blog post on makewordpress.org/core at some point about it. How to assess performance with HTTP Archive, something like that. That&#8217;s something that we can probably, that you can probably look at. There&#8217;s a whole collab. I worked out for a while on a collab to teach as a sort of like tutorial, how to get started with this for anybody that&#8217;s interested.</p>\n\n\n\n<p>[00:37:23] <strong>Nathan Wrigley:</strong> Okay, I&#8217;ve got a couple of pieces that I&#8217;ve got open over here, which are probably not the piece that you&#8217;ve just mentioned. So when I come back and edit this, I&#8217;ll make sure that I get in touch with you and we find that, and we&#8217;ll put that into the show notes. So there&#8217;ll be at least three things that you, dear listener, can go and check out.</p>\n\n\n\n<p>I&#8217;m just wondering if there are any situations, because we know what people are like. Performance experts, they love to configure their servers, they love to put things at the edge that, you know, all these clever things that are going on. Are there any scenarios where things like the speculative loading that that can conflict, or overlap or be something that you actually don&#8217;t want to do because you&#8217;ve already got something in place that might be handling, I don&#8217;t know, let&#8217;s say for example, you&#8217;re in team Cloudflare, and you&#8217;ve jumped in on all the different things that they&#8217;ve got? Perhaps they do this already. I don&#8217;t know. But I&#8217;m just wondering if there are any scenarios where, let&#8217;s say I&#8217;m a hosting company, or I&#8217;m just really into my performance. Are there any scenarios where I need to be mindful, maybe I want to switch this off?</p>\n\n\n\n<p>[00:38:22] <strong>Felix Arntz:</strong> I don&#8217;t think there&#8217;s a lot on the hosting side, but there can be on the whatever client side&#8217;s technologies you use. So because this speculative loading happens in the browser, so the, I don&#8217;t think there&#8217;s anything on the hosting side, or server side, that could do something similar. I think that wouldn&#8217;t work.</p>\n\n\n\n<p>But there are other ways that some similar things like this have already been done outside of a browser specification, outside of a browser API. Like there are certain JavaScript frameworks, for instance, that have something like speculative loading. Like, if you have a Next.js site, for instance, which I think is not very common to be used together with WordPress, but if you do have a Next.js site for instance, it might load URLs speculatively too, but through its own mechanism, like a completely separate approach. I&#8217;m not sure about specific JavaScript libraries right now that do exactly this, but there are definitely things like it that some sites were already using before the browser Speculation Rules API came around.</p>\n\n\n\n<p>[00:39:15] <strong>Nathan Wrigley:</strong> Okay, so broadly speaking, if you&#8217;re a WordPress, a typical WordPress user, you&#8217;ve got nothing to worry about. And you probably know that you&#8217;ve got something interesting and unusual going on with loading things in a different way, so you&#8217;re probably okay.</p>\n\n\n\n<p>One of the things that I did want to know, I just wondered if there were certain, I don&#8217;t know, let&#8217;s say I&#8217;ve got a WordPress website, maybe there are bits of that website that I don&#8217;t wish to be speculatively loading.</p>\n\n\n\n<p>I&#8217;m not really sure what that might be. An example that I think came out of one of your blog posts was you took the example of a Woo, well, I presume it was WooCommerce, you know, the end of the URL being cart or something like that, you know, so forward slash cart, forward slash whatever.</p>\n\n\n\n<p>That&#8217;s possible though. I presume, again, with hooks you could say, okay, this predetermined set of URLs, we don&#8217;t want to speculatively load anything. That kind of stuff can be done. The URL parameters can be configured into all this.</p>\n\n\n\n<p>[00:40:05] <strong>Felix Arntz:</strong> Yeah, exactly. So you can exclude certain URLs, or URL patterns from being applied to the speculative loading. And you can also configure whether you want to exclude them entirely or whether you want to exclude them only from pre-rendering, but not pre-fetching.</p>\n\n\n\n<p>So this is important to consider because the WordPress site, well, probably now 95% of the sites with 6.8 use pre-fetch because that&#8217;s a default. There are still sites that change it to pre-render. And then there are different implications for the site, for the URLs that are pre-rendered.</p>\n\n\n\n<p>And one of the considerations is, that&#8217;s actually another reason why we went with pre-fetch. because also pre-fetch, even though it&#8217;s less performant than pre-render, is also a safer option at the scale that we roll this out to all WordPress sites. Because the only risk with pre-fetch occurs if there is a URL that modifies something just by visiting that URL, which is an anti-pattern, like you should not do this, but there are plugins that do this occasionally. For instance, if you have like a URL that&#8217;s called empty cart, and just by visiting that URL you empty your shopping cart.</p>\n\n\n\n<p>That means, if you speculatively load the URL and you don&#8217;t visit it, your cart is emptied. You don&#8217;t want that. This is the only risk with pre-fetch. But, for what it&#8217;s worth, WordPress, the WordPress Core implementation also includes some default exclusions already. One of them is that it won&#8217;t speculatively load any URL with query parameters, like those question marks, something. And that&#8217;s because most WordPress sites by far are using pretty permalinks, and on those sites, having a query parameters is extremely unusual. And if there is, it&#8217;s usually from a plugin that does something specific.</p>\n\n\n\n<p>And so that&#8217;s why we exclude URLs because the chance that, like WordPress Core doesn&#8217;t have anything in the front end that will change something when you visit a URL, but plugins might. And plugins would usually handle this through query parameters if they do, and that&#8217;s why we exclude any query parameter URLs.</p>\n\n\n\n<p>[00:42:07] <strong>Nathan Wrigley:</strong> Yeah, I know that you will not have an answer to the next question, but I&#8217;m going to ask it anyway. But I&#8217;m just curious on your thoughts about it, because I know that anybody listening to this, there&#8217;s going to be a proportion of people thinking, wait, we want less bits traveling across the internet.</p>\n\n\n\n<p>And I&#8217;m thinking about the environmental impact of things now. You know, we don&#8217;t want pre-fetching anything, because that&#8217;s then potentially just wasted energy. Just carbon being burnt for stuff which may, or may not, be looked at. And obviously the WordPress approach that you&#8217;ve taken is to try and minimise that.</p>\n\n\n\n<p>But I just wondered if you had any thoughts, you know, around that and whether you could sort of calm people down about that or whether or not it, was that whole thing disregarded? Where does it fit into the thinking of all of this?</p>\n\n\n\n<p>[00:42:52] <strong>Felix Arntz:</strong> Yeah, like I said in the beginning, it is a trade off that you have to make, but it also depends like, which decision you take probably depends on how your site is being used, like what is the best configuration of speculative loading for your own site?</p>\n\n\n\n<p>If you go with a too eager configuration where there&#8217;s tons of URLs are eagerly loaded and then they might never be visited, then this definitely has a negative impact, like you&#8217;re saying. But obviously the ideal outcome is that the wasteful reloaded URLs are minimised and at the end of the day you, by speculatively loading, you improve the user experience.</p>\n\n\n\n<p>I can&#8217;t really answer where you draw the line in that. That being said, the adverse effects of URLs being loaded that you don&#8217;t navigate to with this conservative eagerness is so little. That&#8217;s why we chose that value to be the default. And you can go for more performant solutions, or configurations, but when you do so, please test how that works out.</p>\n\n\n\n<p>You can also, don&#8217;t want to get too deep into this, but you can also, if you have some kind of analytics provider for your site, you can gather like performance data or you can see which links users typically click on. And then you could configure speculation rules in the way that these links specifically may use like a more eager configuration. But the other ones don&#8217;t.</p>\n\n\n\n<p>This is where people really get, I&#8217;ve not personally done this but when, I&#8217;ve heard from other people when they work with enterprise clients, they really go in and look at, oh, when somebody has sent this URL, they usually click one of these four URLs, one of these four links, and then you can configure speculation rules to say, these four links should have moderate eagerness, but all other ones only conservative, for instance.</p>\n\n\n\n<p>[00:44:22] <strong>Nathan Wrigley:</strong> I can see a whole third party ecosystem of plugin developers kind of rubbing their hands together. You know, those that create performance plugins kind of leaning into exactly what you just said. Here&#8217;s your entire WordPress website, and here&#8217;s what we think, you know, in the same way that SEO plugins might give you a traffic light. Here&#8217;s a set of URLs, which we think you are not serving in the way that is going to be beneficial to your users or what have you. So, oh, that&#8217;s interesting as well.</p>\n\n\n\n<p>[00:44:46] <strong>Felix Arntz:</strong> The tough thing though is that it&#8217;s usually, I think it&#8217;s going to be very heavily dependent on the individual site. That&#8217;s where my hesitation is with that is that like, I&#8217;m not sure how much a plugin, a generally applied plugin, throughout the ecosystem could predict that. I think it&#8217;s often depending on the layout of the site. What is even the content of the site, right? What do people mostly click on? I think that makes it challenging from a general plugin perspective. Like to me, that&#8217;s mostly something that developers would do for their client&#8217;s websites, or agencies would do for a client&#8217;s website or at an individual level.</p>\n\n\n\n<p>[00:45:18] <strong>Nathan Wrigley:</strong> Yeah. Well, I mean, it&#8217;s just the beginning, isn&#8217;t it? It&#8217;s dropped in fairly recently. No doubt, the WordPress ecosystem will kind of figure out a posture on this. Maybe third party plugins will come along. Maybe developers will produce more documentation about how to wrangle it. How to surmise whether or not your website is using the Speculation Rules API in a way which is helping you, I don&#8217;t know, measuring the cost of your server infrastructure and what have you. But just the beginning.</p>\n\n\n\n<p>So there you go. Now, dear listener, you know a whole load of stuff about WordPress 6.8 that you didn&#8217;t. Before because probably, it was completely invisible to you. So, is there anything we missed, Felix? Is there any burning issue that you think we did not cover that and that was important?</p>\n\n\n\n<p>[00:45:58] <strong>Felix Arntz:</strong> No. I think we covered pretty much anything, everything. I just wanted to add that the new data from the Crux Report comes out, I think actually it came out yesterday, I believe. So it comes out every second Tuesday of the month. So I&#8217;m about to look at that. I want to take a look at that, definitely by the end of this week to see whether we can get any impact data now that speculative loading is out because, so the way that this works is the Crux data is released for the month before. That&#8217;s what happened, I think yesterday. So now we should have data on April where WordPress 6.8 came out. So now we can see how much did this feature launching in 6.8, and 6.8 in general, affect performance, hopefully in a good way.</p>\n\n\n\n<p>[00:46:39] <strong>Nathan Wrigley:</strong> Okay. Yeah, yeah. So this is actually for you, quite a big moment. You are suddenly going to get this data dump, which is going to actually cover this 43% of the web. It will be on all, well, most of the sites, and you are suddenly going to see what the impact is. Do you know, if you write that up, I will find it, if it&#8217;s out before I produce this post, then I will definitely link to that. And I&#8217;ll be fascinated to see if we can calculate how many decades, or weeks, or months, or years of time we have actually saved. That&#8217;s absolutely brilliant.</p>\n\n\n\n<p>Thank you so much for explaining it, helping to create it in the first place, and basically improving WordPress in a very, very demure way. You know, not shouting it from the rooftops, but doing a lot in the background to make everybody&#8217;s experience of the web a whole lot better. Felix Arntz, thank you so much for chatting to me today.</p>\n\n\n\n<p>[00:47:29] <strong>Felix Arntz:</strong> Yeah. Thank you.</p>\n</div></details>\n\n\n\n<p>On the podcast today we have <a href=\"https://felix-arntz.me/\">Felix Arntz</a>.</p>\n\n\n\n<p>Felix is a Senior Software Engineer at Google, and a WordPress Core committer from Germany, currently residing in San Francisco, California. He helped establish the WordPress Core Performance Team and has been heavily contributing to its efforts. He has been using WordPress for a decade and contributing back to the project since 2015. More recently, he has stepped into the role of the inaugural Performance Lead for the WordPress 6.2 release and subsequently of the 6.3 and 6.8 releases. In the latter release, he spearheaded development and launch of the new speculative loading feature, which is the focus of the podcast today.</p>\n\n\n\n<p>Speculative loading is one of the most important, and yet almost invisible, performance enhancements of recent times. If you’re on WordPress 6.8, this new feature is already active on your site, working quietly in the background to make page navigation faster. But you might never know from the WordPress UI, there’s no menu, no toggle, and no obvious indicator to show it’s there.</p>\n\n\n\n<p>Felix explains exactly what speculative loading is, and why it feels almost like browser magic. The ability for WordPress, using the browser’s new Speculation Rules API, to load the next page just as a user is about to visit it. It’s a clever use of browser signals like mouse clicks and hovers to anticipate navigation, shaving off precious milliseconds, sometimes even providing what feels like an instant page load.</p>\n\n\n\n<p>Felix clarifies the difference between conservative and more aggressive approaches to speculative loading, and why the WordPress Core team opted for the safest, least wasteful option by default, while still giving developers, or advanced users, the hooks and tools to customise or even disable it as needed.</p>\n\n\n\n<p>Felix discusses the origins of the feature as a plugin, the testing and data collection undertaken with tens of thousands of sites, and how this real-world data gave the team confidence to ship speculative loading to all WordPress users. We talk about what those performance wins mean at scale. How a 2% improvement on 43% of the internet translates into saving users untold hours of waiting collectively.</p>\n\n\n\n<p>We also get into the weeds on measurement and methodology. How the team uses data from the Chrome User Experience Report and HTTP Archive to track web performance, prioritise features, and validate real-world impact. Felix offers insight into how these global, anonymised data sets allow the Performance Team to make truly data-driven decisions.</p>\n\n\n\n<p>Beyond the tech, Felix addresses practical considerations, such as how to opt out, or fine-tune speculative loading if you have specific needs, how environmental concerns are balanced by default configurations, and how plugins or agencies might build on this foundation in the future.</p>\n\n\n\n<p>If you’ve ever wondered how large-scale, browser-level improvements make their way into WordPress Core, or simply want to know if there’s a way to make your own WordPress site that much faster, this episode is for you.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Useful links</h2>\n\n\n\n<p><a href=\"https://make.wordpress.org/performance/handbook/about-the-team/\"> WordPress Performance Team</a></p>\n\n\n\n<p><a href=\"https://codelabs.developers.google.com/speculation-rules\">Achieve instant navigations with the Speculation Rules API</a></p>\n\n\n\n<p><a href=\"https://developers.google.com/search/docs/appearance/core-web-vitals\">Understanding Core Web Vitals and Google search results</a></p>\n\n\n\n<p><a href=\"https://wordpress.org/plugins/speculation-rules/\">Speculative Loading plugin</a></p>\n\n\n\n<p><a href=\"https://felix-arntz.me/blog/speculative-loading-history-performance-feature-in-wordpress-core/\">Speculative Loading, or A Brief History of Landing a Performance Feature in WordPress Core</a></p>\n\n\n\n<p><a href=\"https://developer.chrome.com/docs/crux\">Overview of CrUX</a></p>\n\n\n\n<p><a href=\"https://cloud.google.com/bigquery\">BigQuery</a></p>\n\n\n\n<p><a href=\"https://httparchive.org/\">HTTP Archive</a></p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Wed, 28 May 2025 14:00:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:14:\"Nathan Wrigley\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:29;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:93:\"Do The Woo Community: Reinventing Careers and Building Resilience in Tech with Mendel Kurland\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:32:\"https://openchannels.fm/?p=97469\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:96:\"https://openchannels.fm/reinventing-careers-and-building-resilience-in-tech-with-mendel-kurland/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:155:\"Zach and Carl chat with Mendel Kurland, sharing stories of resilience, reinvention, and the human side of tech, wrapping it all in laughs and life lessons.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Wed, 28 May 2025 09:32:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:30;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:51:\"Matt: The Five Layers of Sharing Thoughts and Ideas\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:23:\"https://ma.tt/?p=142705\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:37:\"https://ma.tt/2025/05/sharing-levels/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:3920:\"<p>I&#8217;ve been thinking a lot about mimetic formation, how a thought becomes an idea, and how that idea gestates and evolves as it&#8217;s progressively shared in wider and wider circles.</p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img alt=\"\" class=\"wp-image-142868\" height=\"198\" src=\"https://i0.wp.com/ma.tt/files/2025/05/five-layers-1024x335.png?resize=604%2C198&#038;quality=80&#038;ssl=1\" width=\"604\" /></figure>\n\n\n\n<p>During a recent product review of <a href=\"https://dayoneapp.com/\">Day One</a>, I was struck by how central the app is to my perspective on humans, relationships, and what we share. There are several layers to it, ranging from your innermost thoughts to what you share with the world. Each layer has its own context, challenges, and possibilities, and Automattic offers technology and products tailored to each.</p>\n\n\n\n<p>1. Layer one is your internal thoughts. Your consciousness, what exists only in your mind, or what I like to call meatspace. This space is yours and yours alone. This generative space is at the core of human creativity and existence.</p>\n\n\n\n<p>2. Layer two is triggered as soon as you put something into a medium, like writing it down. It’s everything that leaves your head, but is just reserved for you. In the past, we only had physical journals. Today, we have <a href=\"https://dayoneapp.com/\">Day One</a> as our strongest product in this space, but many people also have a private WordPress installation just for themselves. There are so many tools out there that help you create! Colors, brushes, canvases. Harper, for example, helps you write better — think of it as an open-source <a href=\"https://www.grammarly.com/\">Grammarly</a>, right now just in a few limited contexts, but in the future everywhere you write. </p>\n\n\n\n<p>3. Layer three is you and someone else. This is everything you share with one other person, which is an incredibly sacred act. <a href=\"https://dayoneapp.com/shared-journals/\">Shared journals</a> on Day One, messaging on <a href=\"https://www.beeper.com/\">Beeper</a>, DMs, private blogs with your best friend. A shared Google doc. This is its own special space. It has an intimacy and privacy that is core to the human experience. This is also phase 3 of Gutenberg, which is all about real-time co-editing and collaboration. This layer is the one I&#8217;m most excited about expanding in 2025 and 2026.</p>\n\n\n\n<p>4. Layer four is sharing within a finite group. N+1. It&#8217;s a space of collaboration and brainstorming with families, tribes, and teams. <a href=\"https://wordpress.com/p2/\">P2</a>, Linear, Github, group chats, and cozy communities. You lose some of the intimacy of layer three but gain more group intelligence.</p>\n\n\n\n<p>5. Finally, we have the fifth layer. This is the public layer, where I have spent a lot of my time at <a href=\"https://automattic.com/\">Automattic</a>. It is an extremely competitive space of social media and blogs: <a href=\"https://wordpress.org/\">WordPress</a>, <a href=\"http://wordpress.com\">WordPress.com</a>, and <a href=\"https://tumblr.com/\">Tumblr</a>. Once you publish publicly, you open yourself up to the beauty and chaos of the wider world. The best reason to blog is comments, the people who find you and add to your thoughts, who you never would have imagined. This is a crucible, but makes your own writing and thinking so much better, it&#8217;s worth the mishegoss. <img alt=\"🙂\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/16.0.1/72x72/1f642.png\" style=\"height: 1em;\" /></p>\n\n\n\n<p>This has been kicking around in my head and at layer four for a while. Thanks to <a href=\"https://kelly.blog/\">Kelly Hoffman</a> for helping me get this to layer five.</p>\n\n\n\n<p>P.S. Happy 22<sup>nd</sup> birthday to WordPress! <a href=\"https://wordpress.org/news/2025/05/announcing-the-formation-of-the-wordpress-ai-team/\">Very excited about the new AI team on .org</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Wed, 28 May 2025 00:55:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:4:\"Matt\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:31;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:43:\"Aaron Jorbin: Happy 22nd Birthday WordPress\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"https://aaron.jorb.in/?p=185698\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:52:\"https://aaron.jorb.in/happy-22nd-birthday-wordpress/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:862:\"<p>I don&#8217;t know about you, but <a href=\"https://wordpress.org/news/2003/05/wordpress-now-available/\">WordPress is feeling 22.</a></p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-4-3 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n\n</div></figure>\n\n\n\n<p>I am celebrating by helping WordPress do what it has done nearly every day for 22 years: <a href=\"https://core.trac.wordpress.org/changeset/60258\">getting</a> a little better (and <a href=\"https://core.trac.wordpress.org/changeset/60257\">being ok</a> making <a href=\"https://core.trac.wordpress.org/changeset/60256\">mistakes</a> in the process).</p>\n<p>The post <a href=\"https://aaron.jorb.in/happy-22nd-birthday-wordpress/\">Happy 22nd Birthday WordPress</a> appeared first on <a href=\"https://aaron.jorb.in\">Aaron Jorbin</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Tue, 27 May 2025 23:37:32 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:6:\"jorbin\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:32;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:69:\"WordPress.org blog: Announcing the Formation of the WordPress AI Team\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:35:\"https://wordpress.org/news/?p=18769\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:85:\"https://wordpress.org/news/2025/05/announcing-the-formation-of-the-wordpress-ai-team/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:2959:\"<p>Today, I’m pleased to announce the formation of a new <strong>WordPress AI Team,</strong> a dedicated group focused on accelerating and coordinating artificial intelligence projects across the WordPress ecosystem.</p>\n\n\n\n<p>AI is already transforming how people create and manage content online. As this technology evolves, it’s essential that WordPress remains at the forefront, ensuring innovation happens in the open, guided by community values, and built to core standards.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Why This Matters</h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Strategic focus</strong>: A unified team stewards AI development thoughtfully, avoids fragmentation, and ensures alignment with the long-term goals of WordPress. </li>\n\n\n\n<li><strong>Shared innovation</strong>: Contributors and companies are actively exploring AI across the ecosystem. This team provides a central place to collaborate, share ideas, and build together.</li>\n\n\n\n<li><strong>Rapid iteration</strong>: Like the Performance Team, we’ll take a plugin-first approach. <a href=\"https://make.wordpress.org/core/2022/09/11/canonical-plugins-revisited/\">Canonical Plugins</a> will allow us to move quickly, gather feedback, and deliver real value without waiting on the Core release cycle.</li>\n</ul>\n\n\n\n<h2 class=\"wp-block-heading\">What to Expect</h2>\n\n\n\n<p>The AI Team will:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Coordinate cross-team efforts to explore AI-powered features responsibly and inclusively.</li>\n\n\n\n<li>Publish and maintain a public roadmap of AI initiatives and Canonical Plugins.</li>\n\n\n\n<li>Collaborate closely with Core, Design, Accessibility, and other teams to ensure strong integration and shared standards.</li>\n</ul>\n\n\n\n<h2 class=\"wp-block-heading\">Meet the Team</h2>\n\n\n\n<p>The WordPress AI Team brings deep experience in open-source, performance, and product development and a strong commitment to building AI features the WordPress way. The team will launch with the following team contributors:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>James LePage</strong> – Automattic</li>\n\n\n\n<li><strong>Felix Arntz</strong> – Google</li>\n\n\n\n<li><strong>Pascal Birchler</strong> – Google</li>\n\n\n\n<li><strong>Jeff Paul</strong> – 10up</li>\n</ul>\n\n\n\n<p>To help get things started, James and Felix will serve as the initial <a href=\"https://make.wordpress.org/updates/team-reps/\">Team Reps</a> in supporting team organization, communication, and coordination with other Make WordPress teams.</p>\n\n\n\n<p>This is an exciting and important step in WordPress’s evolution. I look forward to seeing what we’ll create together and in the open.</p>\n\n\n\n<p>If you’re interested in contributing or following along, please join the conversations in <a href=\"https://wordpress.slack.com/archives/C08TJ8BPULS\">#core-ai</a> and watch for upcoming meeting announcements on <a href=\"https://make.wordpress.org/ai/\">https://make.wordpress.org/ai/</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Tue, 27 May 2025 16:28:01 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:12:\"Mary Hubbard\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:33;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:109:\"Do The Woo Community: How One Solo Agency Owner Manages Hundreds of WordPress Sites (Without Losing His Mind)\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:47:\"https://openchannels.fm/?post_type=blog&p=97117\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:110:\"https://openchannels.fm/how-one-solo-agency-owner-manages-hundreds-of-wordpress-sites-without-losing-his-mind/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:191:\"Running a massive web design business solo, while focusing on one platform, automating wisely, networking locally, and keeping support simple can help with strategies to scale without stress.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Tue, 27 May 2025 11:14:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:34;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:102:\"Do The Woo Community: Community Engagement Strategies for Successful WooCommerce and WordPress Plugins\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:32:\"https://openchannels.fm/?p=97436\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:105:\"https://openchannels.fm/community-engagement-strategies-for-successful-woocommerce-and-wordpress-plugins/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:194:\"In this episode of Woo Product Chat, co-hosts discuss \"community thinking\" in WordPress and WooCommerce plugins, highlighting the importance of user feedback and effective engagement strategies.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Tue, 27 May 2025 08:44:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:35;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:86:\"Weston Ruter: Improve LCP by Deprioritizing  Script Modules from the Interactivity API\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:33:\"https://weston.ruter.net/?p=34457\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:99:\"https://weston.ruter.net/2025/05/26/improve-lcp-by-deprioritizing-interactivity-api-script-modules/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:42031:\"<p class=\"is-style-text-subtitle is-style-text-subtitle--3\">Adding a <code>fetchpriority</code> of <code>low</code> to script modules and moving them from the <code>head</code> to the footer can improve <abbr title=\"Largest Contentful Paint\">LCP</abbr> by &gt;9%! I&#8217;ve <a href=\"https://github.com/westonruter/script-fetchpriority-low\" title=\"Script Fetch Priority Low\">written</a> <a href=\"https://github.com/westonruter/script-modules-in-footer\" title=\"Script Modules in Footer\">plugins</a> you can use to implement this now while waiting for them to land in WordPress core.</p>\n\n\n\n<p>The past week I&#8217;ve been doing a deep dive into the performance impact of how WordPress loads script modules for the <a href=\"https://developer.wordpress.org/block-editor/reference-guides/interactivity-api/\">Interactivity API</a>. When the Interactivity API was first introduced, it used classic non-module scripts which were printed at the end of the <code>body</code> (i.e. in the footer, at <code>wp_footer</code>) so that they would not block the <a href=\"https://developer.mozilla.org/en-US/docs/Web/Performance/Guides/Critical_rendering_path\">critical rendering path</a>. With support for <a href=\"https://make.wordpress.org/core/2023/07/14/registering-scripts-with-async-and-defer-attributes-in-wordpress-6-3/\">script loading strategies</a> in core, I <a href=\"https://github.com/WordPress/gutenberg/pull/52536\">added</a> <code>defer</code> to these scripts and moved them to the <code>head</code> (i.e. at <code>wp_head</code>) in block themes, <a href=\"https://core.trac.wordpress.org/ticket/59115#:~:text=Leaving%20them%20in%20the%20head%20is%20advantageous%20because%20it%20means%20the%20browser%20will%20discover%20these%20scripts%20earlier%20and%20start%20loading%20them%20with%20other%20page%20resources%2C%20but%20the%20presence%20of%20defer%20means%20that%20they%20will%20no%20longer%20block%20page%20rendering.\">reasoning</a>:</p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>Leaving them in the <code>head</code> is advantageous because it means the browser will discover these scripts earlier and start loading them with other page resources, but the presence of <code>defer</code> means that they will no longer block page rendering.</p>\n</blockquote>\n\n\n\n<p>Ultimately, when the Interactivity API was <a href=\"https://make.wordpress.org/core/2024/03/04/interactivity-api-dev-note/\">fully launched</a> in WordPress 6.5, it had switched to using <a href=\"https://make.wordpress.org/core/2024/03/04/script-modules-in-6-5/\">script modules</a>. One great thing about script modules is that they don&#8217;t block rendering: they have the <code>defer</code> behavior <a href=\"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules#:~:text=There%20is%20no%20need%20to%20use%20the%20defer%20attribute%20(see%20%3Cscript%3E%20attributes)%20when%20loading%20a%20module%20script%3B%20modules%20are%20deferred%20automatically.\">by default</a>. This means that they are safe to place in the <code>head</code>, and they continue to be printed there in block themes. (In classic themes, the block scripts are printed in the footer since blocks aren&#8217;t parsed before <code>wp_head</code> runs.) However, as I&#8217;ve been researching the past week, there can still be negative implications to the LCP metric when these script modules are discovered early, even though they don&#8217;t block rendering.</p>\n\n\n\n<p>I set up a vanilla test site with Local WP and the Twenty Twenty-Five default theme active. I configured the theme template and post content so that all block configurations which depend on the Interactivity API are present:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The theme template has a <strong>Navigation</strong> block with the mobile overlay menu enabled (which is the default).</li>\n\n\n\n<li>A <strong>Search</strong> block is added to the header with the “Button only” configuration which depends on the Interactivity API.</li>\n\n\n\n<li>The <a href=\"https://gist.github.com/westonruter/9ef0dfa42e4237b8a823e4b6803d3d7a#file-post_content-html\">post content</a> starts with an <strong>Image</strong> block whose <code>IMG</code> is the LCP element. It is configured to “Enlarge on click”.<sup class=\"fn\"><a href=\"https://weston.ruter.net/category/wordpress/feed/#c7a2be25-eace-4671-8089-f9286a5703ea\" id=\"c7a2be25-eace-4671-8089-f9286a5703ea-link\">1</a></sup> This uses a <a href=\"https://en.wikipedia.org/wiki/File:American_bison_k5680-1.jpg\">photo</a> of a Bison of course. <img alt=\"🦬\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f9ac.png\" style=\"height: 1em;\" /></li>\n\n\n\n<li>After a few paragraphs of Lorem Ipsum, I added a <strong>File</strong> block for a PDF with “Show inline embed” enabled.</li>\n\n\n\n<li>The “More Posts” section of the template has a <strong>Query Loop</strong> which has its “Reload full page” advanced setting turned off.</li>\n</ul>\n\n\n\n<p>In the end, this results in the following markup being printed in the <code>head</code> (from the <a href=\"https://gist.github.com/westonruter/9ef0dfa42e4237b8a823e4b6803d3d7a#file-before-html\">full page source</a> with some prettying): </p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs language-xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script</span> <span class=\"hljs-attr\">type</span>=<span class=\"hljs-string\">\"importmap\"</span> <span class=\"hljs-attr\">id</span>=<span class=\"hljs-string\">\"wp-importmap\"</span>&gt;</span><span class=\"actionscript\">\n{\n	<span class=\"hljs-string\">\"imports\"</span>:{\n		<span class=\"hljs-string\">\"@wordpress/interactivity\"</span>: <span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/interactivity/index.min.js?ver=55aebb6e0a16726baffb\"</span>,\n		<span class=\"hljs-string\">\"@wordpress/interactivity-router\"</span>: <span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/interactivity-router/index.min.js?ver=dc4a227f142d2e68ef83\"</span>,\n		<span class=\"hljs-string\">\"@wordpress/a11y\"</span>: <span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/a11y/index.min.js?ver=b7d06936b8bc23cff2ad\"</span>\n	}\n}\n</span><span class=\"hljs-tag\">&lt;/<span class=\"hljs-name\">script</span>&gt;</span>\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script</span> <span class=\"hljs-attr\">type</span>=<span class=\"hljs-string\">\"module\"</span> <span class=\"hljs-attr\">src</span>=<span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/block-library/file/view.min.js?ver=fdc2f6842e015af83140\"</span> <span class=\"hljs-attr\">id</span>=<span class=\"hljs-string\">\"@wordpress/block-library/file/view-js-module\"</span>&gt;</span><span class=\"hljs-tag\">&lt;/<span class=\"hljs-name\">script</span>&gt;</span>\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script</span> <span class=\"hljs-attr\">type</span>=<span class=\"hljs-string\">\"module\"</span> <span class=\"hljs-attr\">src</span>=<span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/block-library/image/view.min.js?ver=e38a2f910342023b9d19\"</span> <span class=\"hljs-attr\">id</span>=<span class=\"hljs-string\">\"@wordpress/block-library/image/view-js-module\"</span>&gt;</span><span class=\"hljs-tag\">&lt;/<span class=\"hljs-name\">script</span>&gt;</span>\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script</span> <span class=\"hljs-attr\">type</span>=<span class=\"hljs-string\">\"module\"</span> <span class=\"hljs-attr\">src</span>=<span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/block-library/navigation/view.min.js?ver=61572d447d60c0aa5240\"</span> <span class=\"hljs-attr\">id</span>=<span class=\"hljs-string\">\"@wordpress/block-library/navigation/view-js-module\"</span>&gt;</span><span class=\"hljs-tag\">&lt;/<span class=\"hljs-name\">script</span>&gt;</span>\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script</span> <span class=\"hljs-attr\">type</span>=<span class=\"hljs-string\">\"module\"</span> <span class=\"hljs-attr\">src</span>=<span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/block-library/query/view.min.js?ver=f55e93a1ad4806e91785\"</span> <span class=\"hljs-attr\">id</span>=<span class=\"hljs-string\">\"@wordpress/block-library/query/view-js-module\"</span>&gt;</span><span class=\"hljs-tag\">&lt;/<span class=\"hljs-name\">script</span>&gt;</span>\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script</span> <span class=\"hljs-attr\">type</span>=<span class=\"hljs-string\">\"module\"</span> <span class=\"hljs-attr\">src</span>=<span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/block-library/search/view.min.js?ver=208bf143e4074549fa89\"</span> <span class=\"hljs-attr\">id</span>=<span class=\"hljs-string\">\"@wordpress/block-library/search/view-js-module\"</span>&gt;</span><span class=\"hljs-tag\">&lt;/<span class=\"hljs-name\">script</span>&gt;</span>\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">link</span> <span class=\"hljs-attr\">rel</span>=<span class=\"hljs-string\">\"modulepreload\"</span> <span class=\"hljs-attr\">href</span>=<span class=\"hljs-string\">\"/wp-includes/js/dist/script-modules/interactivity/index.min.js?ver=55aebb6e0a16726baffb\"</span> <span class=\"hljs-attr\">id</span>=<span class=\"hljs-string\">\"@wordpress/interactivity-js-modulepreload\"</span>&gt;</span></code></span></pre>\n\n\n<p>When loading the page in Chrome, here&#8217;s the network panel in DevTools:</p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large wp-lightbox-container\"><img alt=\"Screenshot of the Chrome DevTools network panel where the script module resources are being loaded with high priority before the Bison image (for the LCP element)\" class=\"wp-image-34758\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/chrome-network-panel-script-modules-default-priority-two-columns.png?resize=501%2C700&#038;ssl=1\" width=\"501\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button></figure>\n\n\n\n<p>Notice how the script modules are being loaded with a <strong>high</strong> priority and <em>before</em> the all-important Bison image resource is loaded for the LCP element. This is bad. Here&#8217;s a view of the waterfall in the Performance panel, where you can see the script modules indeed start loading before the Bison image:</p>\n\n\n\n<figure class=\"wp-block-image alignwide size-large wp-lightbox-container\"><img alt=\"Network waterfall in Chrome DevTools showing script modules loading before the LCP image resource.\" class=\"wp-image-34739\" height=\"187\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/chrome-devtools-waterfall-script-modules-default-priority.png?resize=700%2C187&#038;ssl=1\" width=\"700\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button></figure>\n\n\n\n<p>In my tests, both Chrome and Safari set a default fetch priority of <strong>high</strong> for module scripts and <code>modulepreload</code> links. In Firefox, the default fetch priority for a <code>modulepreload</code> link is <strong>highest</strong>, while the script modules are loaded with <strong>normal</strong> fetch priority. In all these cases, the priorities are <em>incorrect</em>. They should all have a fetch priority of <strong>low</strong> because they are not in the critical rendering path. This is because the very first requirement/goal defined for the Interactivity API was for <a href=\"https://developer.wordpress.org/block-editor/reference-guides/interactivity-api/iapi-about/#:~:text=It%20must%20support%20server%2Dside%20rendering.%20Server%2Drendered%20HTML%20and%20client%2Dhydrated%20HTML%20must%20be%20exactly%20the%20same.%20This%20is%20important%20for%20SEO%20and%20the%20user%20experience.\">server-side rendering</a>:</p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>It must support server-side rendering. Server-rendered HTML and client-hydrated HTML must be exactly the same. This is important for SEO and the user experience.</p>\n</blockquote>\n\n\n\n<p>Since blocks using the Interactivity API are intended to leverage server-side rendering, the script modules for these blocks<sup class=\"fn\"><a href=\"https://weston.ruter.net/category/wordpress/feed/#b77dfd89-ba79-47f9-b93a-b5825558c8a3\" id=\"b77dfd89-ba79-47f9-b93a-b5825558c8a3-link\">2</a></sup> by definition should not be prioritized over loading other resources which are in the critical rendering path, <em>especially</em> any image resource for the LCP element.</p>\n\n\n\n<p>I wanted to find out what the LCP performance impact would be if these script modules had their priorities changed to low from the default of high. The <code><a href=\"https://developer.mozilla.org/en-US/docs/Web/API/HTMLLinkElement/fetchPriority\">link</a></code> and <code><a href=\"https://developer.mozilla.org/en-US/docs/Web/API/HTMLScriptElement/fetchPriority\">script</a></code> tags both support the <code>fetchpriority</code> attribute, same as the <code>img</code> tag does. While WordPress now <a href=\"https://make.wordpress.org/core/2023/07/13/image-performance-enhancements-in-wordpress-6-3/\">facilitates</a> adding <code>fetchpriority</code> to <code>img</code> tags, it doesn&#8217;t do the same for registered scripts or script modules. This is what <a href=\"https://core.trac.wordpress.org/ticket/61734\" title=\"Add the ability to handle &quot;fetchpriority&quot; to ES Modules and Import Maps\">#61734</a> is about, and it is why I&#8217;m analyzing the performance impact. In the same way that WordPress facilitates adding <code>async</code> and <code>defer</code> to scripts, and does so by default for some scripts, there should perhaps be a way to declare the <code>fetchpriority</code> for a script or script module.</p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"performance-of-low-priority-script-modules\">Performance of Low Priority Script Modules</h2>\n\n\n\n<p>In order to benchmark the performance impact, I developed the <strong><a href=\"https://github.com/westonruter/script-fetchpriority-low\">Script Fetch Priority Low</a> plugin</strong> which automatically adds <code>fetchpriority=low</code> to the <code>module</code> scripts used by the Interactivity API, as well as any <code>modulepreload</code> links which are printed for static import dependencies. If a page is loaded with a specific query parameter, then the plugin short-circuits; this allows for doing before/after benchmarks.</p>\n\n\n\n<p>With this plugin active, this is the change to the network panel in Chrome DevTools:</p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large wp-lightbox-container\"><img alt=\"Screenshot of the Chrome DevTools network panel where the script module resources are being loaded with low priority after the Bison image (for the LCP element)\" class=\"wp-image-34759\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/chrome-network-panel-script-modules-low-priority-two-columns.png?resize=501%2C700&#038;ssl=1\" width=\"501\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button></figure>\n\n\n\n<p>Notice how the script modules are now being loaded with a <strong>low</strong> priority and <em>after</em> the Bison image. This can also be seen in the Performance panel waterfall:</p>\n\n\n\n<figure class=\"wp-block-image alignwide size-large wp-lightbox-container\"><img alt=\"Network waterfall in Chrome DevTools showing script modules loading after the LCP image resource.\" class=\"wp-image-34740\" height=\"190\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/chrome-devtools-waterfall-script-modules-low-priority.png?resize=700%2C190&#038;ssl=1\" width=\"700\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button></figure>\n\n\n\n<p>This looks much better. But what is the performance impact in terms of LCP? To analyze that I used the <a href=\"https://github.com/GoogleChromeLabs/wpp-research/tree/main/cli#benchmark-web-vitals\">benchmark-web-vitals</a> tool to obtain the median web vitals metrics for 100 requests with and without the reduction in fetch priority:</p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\">Command<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\">npm run research -- benchmark-web-vitals --number=100 --output=<span class=\"hljs-string\">\"md\"</span> --network-conditions=<span class=\"hljs-string\">\"broadband\"</span> --diff \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer&amp;disable_script_fetchpriority_low\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer\"</span></code></span></pre></details>\n\n\n\n<figure class=\"wp-block-table benchmark-web-vitals is-style-regular has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><th>Metric</th><th>Before</th><th>After</th><th>Diff (ms)</th><th>Diff (%)</th></tr></thead><tbody><tr><td><abbr title=\"First Contentful Paint\">FCP</abbr></td><td>142.6</td><td>141.7</td><td>-0.9</td><td>-0.6%</td></tr><tr><td><abbr title=\"Largest Contentful Paint\">LCP</abbr></td><td>409.4</td><td>382.4</td><td>-27.0</td><td>-6.6%</td></tr><tr><td><abbr title=\"Time To Fist Byte\">TTFB</abbr></td><td>34.7</td><td>35.3</td><td>+0.7</td><td>+1.9%</td></tr><tr><td><abbr title=\"LCP minus TTFB\">LCP-TTFB</abbr></td><td>374.2</td><td>347.0</td><td>-27.2</td><td>-7.3%</td></tr></tbody></table></figure>\n\n\n\n<p>This is a big improvement! (Each subsequent benchmark test shows the median metrics of 100 iterations, unless otherwise noted.)</p>\n\n\n\n<p>The above results were testing while emulating a broadband network connection. Here are the results testing a “Fast 3G” connection:</p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\">Command<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\">npm run research -- benchmark-web-vitals --number=100 --output=<span class=\"hljs-string\">\"md\"</span> --network-conditions=<span class=\"hljs-string\">\"Fast 3G\"</span> --diff \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer&amp;disable_script_fetchpriority_low\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer\"</span></code></span></pre></details>\n\n\n\n<figure class=\"wp-block-table benchmark-web-vitals is-style-regular has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><th>Metric</th><th>Before</th><th>After</th><th>Diff (ms)</th><th>Diff (%)</th></tr></thead><tbody><tr><td>FCP</td><td>1275.3</td><td>1275.4</td><td>+0.1</td><td>+0.0%</td></tr><tr><td>LCP</td><td>3377.1</td><td>3157.1</td><td>-220.0</td><td>-6.5%</td></tr><tr><td>TTFB</td><td>35.0</td><td>34.6</td><td>-0.4</td><td>-1.0%</td></tr><tr><td>LCP-TTFB</td><td>3341.1</td><td>3123.0</td><td>-218.1</td><td>-6.5%</td></tr></tbody></table></figure>\n\n\n\n<p>So there is roughly the same improvement regardless of the network conditions.</p>\n\n\n\n<p>I was also curious what the results would be when there was just a single block on the page using the Interactivity API, instead of attempting to add every single interactive block. This is the normal case for all block themes since the Navigation block is almost always present with the mobile overlay menu enabled. So I tested on a template with the Navigation block and a featured image as the LCP element, this time again emulating a broadband network connection:</p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\">Command<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\">npm run research -- benchmark-web-vitals --number=100 --output=<span class=\"hljs-string\">\"md\"</span> --network-conditions=<span class=\"hljs-string\">\"broadband\"</span> --diff \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison-no-file-block/?disable_print_script_modules_in_footer&amp;disable_script_fetchpriority_low\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison-no-file-block/?disable_print_script_modules_in_footer\"</span></code></span></pre></details>\n\n\n\n<figure class=\"wp-block-table benchmark-web-vitals has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><th>Metric</th><th>Before</th><th>After</th><th>Diff (ms)</th><th>Diff (%)</th></tr></thead><tbody><tr><td>FCP</td><td>140.7</td><td>142.6</td><td>+1.9</td><td>+1.4%</td></tr><tr><td>LCP</td><td>399.0</td><td>368.9</td><td>-30.1</td><td>-7.5%</td></tr><tr><td>TTFB</td><td>33.4</td><td>33.0</td><td>-0.4</td><td>-1.2%</td></tr><tr><td>LCP-TTFB</td><td>365.1</td><td>335.8</td><td>-29.3</td><td>-8.0%</td></tr></tbody></table></figure>\n\n\n\n<p>So even when there is just a single script module along with the <code>modulepreload</code> link, the performance improvement to LCP is consistent.</p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"printing-script-modules-in-the-footer\">Printing Script Modules in the Footer</h2>\n\n\n\n<p>As referred to above, the classic method WordPress has employed to deprioritize scripts is to load them in the footer by supplying <code>in_footer</code> as <code>true</code> when registering a script. What if instead of adding a <code>fetchpriority</code> of <code>low</code> to script modules, they were instead just printed in the footer for block themes in the same way they are already printed in the footer for classic themes? I created the <strong><a href=\"https://github.com/westonruter/script-modules-in-footer\">Script Modules in Footer</a> plugin</strong> to implement this and to facilitate benchmarking. Here are the results:</p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\">Command<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\">npm run research -- benchmark-web-vitals --number=100 --output=<span class=\"hljs-string\">\"md\"</span> --network-conditions=<span class=\"hljs-string\">\"broadband\"</span> --diff \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer&amp;disable_script_fetchpriority_low\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_script_fetchpriority_low\"</span></code></span></pre></details>\n\n\n\n<figure class=\"wp-block-table benchmark-web-vitals has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><th>Metric</th><th>Before</th><th>After</th><th>Diff (ms)</th><th>Diff (%)</th></tr></thead><tbody><tr><td>FCP</td><td>141.8</td><td>143.7</td><td>+1.9</td><td>+1.3%</td></tr><tr><td>LCP</td><td>410.8</td><td>383.1</td><td>-27.8</td><td>-6.8%</td></tr><tr><td>TTFB</td><td>34.4</td><td>34.4</td><td>-0.1</td><td>-0.1%</td></tr><tr><td>LCP-TTFB</td><td>376.7</td><td>348.4</td><td>-28.4</td><td>-7.5%</td></tr></tbody></table></figure>\n\n\n\n<p>This shows almost the same improvement as adding <code>fetchpriority</code> of <code>low</code>. However, even when they are located at the end of the <code>body</code>, they are still loaded with a high fetch priority. When script modules are printed in the footer, adding <code>fetchpriority</code> as well yields an additional ~1% improvement to LCP on my test page:</p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\">Command<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\">npm run research -- benchmark-web-vitals --number=100 --output=<span class=\"hljs-string\">\"md\"</span> --network-conditions=<span class=\"hljs-string\">\"broadband\"</span> --diff \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_script_fetchpriority_low\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/\"</span></code></span></pre></details>\n\n\n\n<figure class=\"wp-block-table benchmark-web-vitals has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><th>Metric</th><th>Before</th><th>After</th><th>Diff (ms)</th><th>Diff (%)</th></tr></thead><tbody><tr><td>FCP</td><td>142.0</td><td>144.1</td><td>+2.1</td><td>+1.5%</td></tr><tr><td>LCP</td><td>377.5</td><td>374.7</td><td>-2.8</td><td>-0.7%</td></tr><tr><td>TTFB</td><td>34.7</td><td>35.1</td><td>+0.4</td><td>+1.2%</td></tr><tr><td>LCP-TTFB</td><td>342.9</td><td>338.9</td><td>-4.0</td><td>-1.2%</td></tr></tbody></table></figure>\n\n\n\n<p>If script modules are all printed with <code>fetchpriority=low</code>, here&#8217;s the difference when moving them from <code>wp_head</code> to <code>wp_footer</code>:</p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\">Command<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\">npm run research -- benchmark-web-vitals --number=100 --output=<span class=\"hljs-string\">\"md\"</span> --network-conditions=<span class=\"hljs-string\">\"broadband\"</span> --diff \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/\"</span></code></span></pre></details>\n\n\n\n<figure class=\"wp-block-table benchmark-web-vitals has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><th>Metric</th><th>Before</th><th>After</th><th>Diff (ms)</th><th>Diff (%)</th></tr></thead><tbody><tr><td>FCP</td><td>142.4</td><td>143.2</td><td>+0.8</td><td>+0.6%</td></tr><tr><td>LCP</td><td>383.9</td><td>372.7</td><td>-11.2</td><td>-2.9%</td></tr><tr><td>TTFB</td><td>35.0</td><td>35.2</td><td>+0.2</td><td>+0.6%</td></tr><tr><td>LCP-TTFB</td><td>348.1</td><td>337.8</td><td>-10.3</td><td>-3.0%</td></tr></tbody></table></figure>\n\n\n\n<p>So again, there&#8217;s an improvement but not as large as before/after adding <code>fetchpriority=low</code> or printing in the <code>head</code> versus the footer.</p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"deprioritizing-classic-scripts\">Bonus: Deprioritizing Classic Scripts</h2>\n\n\n\n<p>While classic scripts registered in WordPress already have the ability to be printed in the footer, they can&#8217;t be registered with a specific <code>fetchpriority</code> value. It doesn&#8217;t make a lot of sense to set a fetch priority for blocking classic scripts since they should always be loaded with the highest priority since they block rendering. However, what about a script that is using the <code>defer</code> or <code>async</code> loading strategies? Chrome automatically assigns such scripts as having a low priority, regardless of whether they are printed at the <code>head</code> or the footer. However, this is not the case for other browsers:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>An <code>async</code> script in the <code>head</code> gets a medium/normal priority in Safari/Firefox.</li>\n\n\n\n<li> A <code>defer</code> script in the <code>head</code> gets a high priority in Safari and a normal priority in Firefox.</li>\n\n\n\n<li>An <code>async</code> script in the footer gets a medium/normal priority in Safari/Firefox.</li>\n\n\n\n<li>A <code>defer</code> script in the footer gets a high priority in Safari and a normal priority in Firefox.</li>\n</ul>\n\n\n\n<p>So for the sake of non-Chromium browsers, it absolutely makes sense to be able to register classic scripts with a fetch priority. For example, the <code>comment-reply</code> script is registered as <code>async</code> and is printed in the footer. Explicitly marking this script as having a low fetch priority ensures that loading it will not compete with more critical resources in Firefox and Safari. My <strong><a href=\"https://github.com/westonruter/script-fetchpriority-low\">Script Fetch Priority Low</a></strong> plugin also implements this.</p>\n\n\n\n<p>As an extra bonus, check out my <a href=\"https://github.com/westonruter/google-site-kit-gtag-script-deprioritization\">Site Kit GTag Script Deprioritization</a> and <a href=\"https://github.com/westonruter/jetpack-stats-script-deprioritization\">Jetpack Stats Script Deprioritization</a> plugins which optimize the loading of analytics trackers by adding <code>fetchpriority=low</code> to the <code>script</code> tags, removing the <code>dns-prefetch</code>, and ensuring the external <code>script</code> tags are printed in the footer.</p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"conclusion\">Conclusion</h2>\n\n\n\n<p>There are essentially for different configurations for printing script modules on the page:</p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>In <code>head</code> with default fetch priority. (This is the current behavior in WordPress core.)</li>\n\n\n\n<li>In <code>head</code> with <code>fetchpriority=low</code>.</li>\n\n\n\n<li>At end of <code>body</code> with default fetch priority.</li>\n\n\n\n<li>At end of <code>body</code> with <code>fetchpriority=low</code>.</li>\n</ol>\n\n\n\n<p>Here are the median metrics for benchmarking 1,000 iterations for each of the four configurations:</p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\">Command<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\">npm run research -- benchmark-web-vitals --number=1000 --output=<span class=\"hljs-string\">\"md\"</span> --network-conditions=<span class=\"hljs-string\">\"broadband\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer&amp;disable_script_fetchpriority_low\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_script_fetchpriority_low\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/\"</span></code></span></pre></details>\n\n\n\n<figure class=\"wp-block-table benchmark-web-vitals has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><th>Metric</th><th><code>head</code></th><th><code>head</code> + <code>low</code></th><th><code>body</code></th><th><code>body</code> + <code>low</code></th></tr></thead><tbody><tr><td>FCP</td><td>137.9</td><td>143.0</td><td>140.7</td><td>138.8</td></tr><tr><td>LCP</td><td>405.9</td><td>383.7</td><td>376.8</td><td>370.0</td></tr><tr><td>TTFB</td><td>33.7</td><td>34.5</td><td>33.6</td><td>33.7</td></tr><tr><td>LCP-TTFB</td><td>372.2</td><td>349.3</td><td>343.0</td><td>336.3</td></tr></tbody></table></figure>\n\n\n\n<p>When script modules are printed in the footer <em>and</em> they have <code>fetchpriority=low</code>, the result is a &gt;9% improvement to LCP on my test page:</p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\">Command<pre class=\"wp-block-code\"><span><code class=\"hljs language-bash\">npm run research -- benchmark-web-vitals --number=100 --output=<span class=\"hljs-string\">\"md\"</span> --network-conditions=<span class=\"hljs-string\">\"broadband\"</span> --diff \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/?disable_print_script_modules_in_footer&amp;disable_script_fetchpriority_low\"</span> \\\n  --url <span class=\"hljs-string\">\"http://localhost:10008/bison/\"</span></code></span></pre></details>\n\n\n\n<figure class=\"wp-block-table benchmark-web-vitals has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><th>Metric</th><th>Before</th><th>After</th><th>Diff (ms)</th><th>Diff (%)</th></tr></thead><tbody><tr><td>FCP</td><td>137.0</td><td>137.2</td><td>+0.2</td><td>+0.1%</td></tr><tr><td>LCP</td><td>406.0</td><td>368.8</td><td>-37.2</td><td>-9.2%</td></tr><tr><td>TTFB</td><td>33.7</td><td>33.6</td><td>-0.1</td><td>-0.1%</td></tr><tr><td>LCP-TTFB</td><td>371.7</td><td>336.0</td><td>-35.7</td><td>-9.6%</td></tr></tbody></table></figure>\n\n\n\n<p>Of course your mileage will vary. This will primarily benefit <strong>block themes</strong>. A vanilla WordPress install with the stock theme is very lightweight and a typical site will have a lot more going on which will lessen the impact of these optimizations. But still, with these findings I&#8217;ve been working on a <a href=\"https://github.com/WordPress/wordpress-develop/pull/8815\">pull request</a> for <a href=\"https://core.trac.wordpress.org/ticket/61734\" title=\"Add the ability to handle &quot;fetchpriority&quot; to ES Modules and Import Maps\">#61734</a> to implement <code>fetchpriority</code> support for scripts and script modules in WordPress core; it defaults the fetch priority to low for script modules related to the Interactivity API as well as the <code>comment-reply</code> classic script. This feature is a natural progression to follow script loading strategies (<code>async</code> &amp; <code>defer</code>); in fact, we could consider defaulting scripts to add <code>fetchpriority=low</code> if they use the a delayed loading strategy. </p>\n\n\n\n<p>I&#8217;ve filed <a href=\"https://core.trac.wordpress.org/ticket/63486\" title=\"Script modules should support being printed in the footer the same as classic scripts\n\">#63486</a> to implement support for printing script modules in the footer. This work can follow the <code>fetchpriority</code> support as it will be more involved due to the need to account for module dependencies.</p>\n\n\n\n<p>While waiting for these performance enhancements to land in core, you can install the <strong><a href=\"https://github.com/westonruter/script-fetchpriority-low\">Script Fetch Priority Low</a></strong> and <strong><a href=\"https://github.com/westonruter/script-modules-in-footer\">Script Modules in Footer</a></strong> plugins. Let me know if you measure any LCP improvements!</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" />\n\n\n\n<p class=\"has-medium-font-size\">Where I&#8217;ve shared this:</p>\n\n\n\n<ul class=\"wp-block-social-links is-layout-flex wp-block-social-links-is-layout-flex\"><li class=\"wp-social-link wp-social-link-linkedin  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://www.linkedin.com/posts/westonruter_improve-lcp-by-deprioritizing-script-modules-activity-7332869961524092928-qv3g\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M19.7,3H4.3C3.582,3,3,3.582,3,4.3v15.4C3,20.418,3.582,21,4.3,21h15.4c0.718,0,1.3-0.582,1.3-1.3V4.3 C21,3.582,20.418,3,19.7,3z M8.339,18.338H5.667v-8.59h2.672V18.338z M7.004,8.574c-0.857,0-1.549-0.694-1.549-1.548 c0-0.855,0.691-1.548,1.549-1.548c0.854,0,1.547,0.694,1.547,1.548C8.551,7.881,7.858,8.574,7.004,8.574z M18.339,18.338h-2.669 v-4.177c0-0.996-0.017-2.278-1.387-2.278c-1.389,0-1.601,1.086-1.601,2.206v4.249h-2.667v-8.59h2.559v1.174h0.037 c0.356-0.675,1.227-1.387,2.526-1.387c2.703,0,3.203,1.779,3.203,4.092V18.338z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">LinkedIn</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-bluesky  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://bsky.app/profile/weston.ruter.net/post/3lq42d67nxc2b\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6.3,4.2c2.3,1.7,4.8,5.3,5.7,7.2.9-1.9,3.4-5.4,5.7-7.2,1.7-1.3,4.3-2.2,4.3.9s-.4,5.2-.6,5.9c-.7,2.6-3.3,3.2-5.6,2.8,4,.7,5.1,3,2.9,5.3-5,5.2-6.7-2.8-6.7-2.8,0,0-1.7,8-6.7,2.8-2.2-2.3-1.2-4.6,2.9-5.3-2.3.4-4.9-.3-5.6-2.8-.2-.7-.6-5.3-.6-5.9,0-3.1,2.7-2.1,4.3-.9h0Z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">Bluesky</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-twitter  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://x.com/westonruter/status/1927104556170662353\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M22.23,5.924c-0.736,0.326-1.527,0.547-2.357,0.646c0.847-0.508,1.498-1.312,1.804-2.27 c-0.793,0.47-1.671,0.812-2.606,0.996C18.324,4.498,17.257,4,16.077,4c-2.266,0-4.103,1.837-4.103,4.103 c0,0.322,0.036,0.635,0.106,0.935C8.67,8.867,5.647,7.234,3.623,4.751C3.27,5.357,3.067,6.062,3.067,6.814 c0,1.424,0.724,2.679,1.825,3.415c-0.673-0.021-1.305-0.206-1.859-0.513c0,0.017,0,0.034,0,0.052c0,1.988,1.414,3.647,3.292,4.023 c-0.344,0.094-0.707,0.144-1.081,0.144c-0.264,0-0.521-0.026-0.772-0.074c0.522,1.63,2.038,2.816,3.833,2.85 c-1.404,1.1-3.174,1.756-5.096,1.756c-0.331,0-0.658-0.019-0.979-0.057c1.816,1.164,3.973,1.843,6.29,1.843 c7.547,0,11.675-6.252,11.675-11.675c0-0.178-0.004-0.355-0.012-0.531C20.985,7.47,21.68,6.747,22.23,5.924z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">Twitter</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-mastodon  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://mastodon.social/@westonruter/114576094434226318\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M23.193 7.879c0-5.206-3.411-6.732-3.411-6.732C18.062.357 15.108.025 12.041 0h-.076c-3.068.025-6.02.357-7.74 1.147 0 0-3.411 1.526-3.411 6.732 0 1.192-.023 2.618.015 4.129.124 5.092.934 10.109 5.641 11.355 2.17.574 4.034.695 5.535.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.129.539c-2.165-.074-4.449-.233-4.799-2.891a5.499 5.499 0 0 1-.048-.745s2.125.52 4.817.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.507.475-6.507zm-4.024 6.709h-2.497V8.469c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.312v3.349h-2.483v-3.35c0-1.536-.602-2.312-1.802-2.312-1.085 0-1.628.655-1.628 1.944v6.119H4.832V8.284c0-1.289.328-2.313.987-3.07.68-.758 1.569-1.146 2.674-1.146 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.304z\"></svg><span class=\"wp-block-social-link-label screen-reader-text\">Mastodon</span></a></li></ul>\n\n\n\n<p><strong>Shameless plug:</strong> I found out last month that my 6½-year position at Google was eliminated. I was <a href=\"https://weston.ruter.net/2018/09/19/becoming-a-googler/\">hired</a> to work on WordPress full time, and I&#8217;ve been <a href=\"https://weston.ruter.net/2025/05/14/a-decade-as-a-core-committer-my-wordpress-contribution-history/\">contributing to WordPress</a> as a core committer for over 10 years. Most recently I&#8217;ve worked heavily on the Core Performance team. I&#8217;m currently #opentowork, hoping to find a full time position as a sponsored contributor at another company that also cares about the health of the open web. Alternatively, I&#8217;m exploring the feasibility of being <a href=\"https://github.com/sponsors/westonruter\">sponsored</a> as an independent contributor. If you find my open source work valuable, maybe you can help sustain my contributions?</p>\n\n\n<ol class=\"wp-block-footnotes has-small-font-size\"><li id=\"c7a2be25-eace-4671-8089-f9286a5703ea\">I used an Image block as opposed to setting the featured image so that I could use the “Enlarge on click” setting which involves the interactivity, but see also <a href=\"https://weston.ruter.net/2025/05/17/adding-caption-and-lightbox-to-the-featured-image-block/\">my post</a> about how the Featured Image block can also be extended with a lightbox. <a href=\"https://weston.ruter.net/category/wordpress/feed/#c7a2be25-eace-4671-8089-f9286a5703ea-link\">↩︎</a></li><li id=\"b77dfd89-ba79-47f9-b93a-b5825558c8a3\">The one exception here is the <a href=\"https://wordpress.org/documentation/article/file-block/\">File block</a> when a PDF is selected and the “Show inline embed” <a href=\"https://wordpress.org/documentation/article/file-block/#:~:text=If%20you%20upload%20a%20PDF%20file%2C%20you%E2%80%99ll%20see%20a%20PDF%20settings%20section%20on%20the%20block%20settings.\">setting</a> is enabled. In this case, JavaScript runs when the block initializes to <a href=\"https://github.com/WordPress/gutenberg/blob/8889f82eda340ea66c83e945098423ed1ae3f5d3/packages/block-library/src/file/view.js#L13-L17\">populate the <code>hasPdfPreview</code> state</a>, and this then changes the element&#8217;s <code>hidden</code> state from <code>true</code> to <code>false</code> if the browser supports rendering PDFs. This is an exceptional case, however, and it would be rare for a File block to appear in the initial viewport and be the LCP element. The script module for the File block should only have a high fetch priority if (1) a PDF is selected, (2) the “Show inline embed” setting is enabled, and (3) the block appears in the initial viewport (on desktop or mobile). This is something that <a href=\"https://github.com/WordPress/performance/blob/trunk/plugins/optimization-detective/docs/introduction.md\">Optimization Detective</a> could facilitate. <a href=\"https://weston.ruter.net/category/wordpress/feed/#b77dfd89-ba79-47f9-b93a-b5825558c8a3-link\">↩︎</a></li></ol><p>The post <a href=\"https://weston.ruter.net/2025/05/26/improve-lcp-by-deprioritizing-interactivity-api-script-modules/\">Improve LCP by Deprioritizing  Script Modules from the Interactivity API</a> appeared first on <a href=\"https://weston.ruter.net\">Weston Ruter</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Mon, 26 May 2025 20:36:59 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:12:\"Weston Ruter\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:36;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:112:\"Do The Woo Community: WordPress Multilingual, Translation and Community with Pascal Birchler and Robert Windisch\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:32:\"https://openchannels.fm/?p=97013\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:114:\"https://openchannels.fm/wordpress-multilingual-translation-and-community-with-pascal-birchler-and-robert-windisch/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:246:\"In this episode of The WordPress Way, listen to shared insights on translating WordPress, performance boosts, community involvement, and future multilingual features. They emphasize the ongoing need for translators and collaboration in WordPress.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Mon, 26 May 2025 09:01:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:37;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:115:\"Gutenberg Times: Feature API, Playground, Gutenberg 20.9, Interactivity API, #WCUS and moar — Weekend Edition 331\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:35:\"https://gutenbergtimes.com/?p=40505\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:117:\"https://gutenbergtimes.com/feature-api-playground-gutenberg-20-9-interactivity-api-wcus-and-moar-weekend-edition-331/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:19961:\"<p>Howdy,</p>\n\n\n\n<p></p>\n\n\n\n<p>This week, I continued to learn about more plugins for the block editor. They might be new to the WordPress repository or just new to me, haha.  Also, Playground came up in the last couple of weeks, and I share two tutorials and a video about my workshop at WordCamp Europe.  And via the Feature API you can prepare your plugins for AI Agents. </p>\n\n\n\n<p>As every year, WordCamp Europe will also have a Live stream for the talks and keynotes. Just check out the website on Jun 6th, 2025.  The next Weekend Edition will drop in your inbox after WordCamp Europe and I will share some cool talks from the live stream. </p>\n\n\n\n<p>Until have a great time! </p>\n\n\n\n<p>Yours, <img alt=\"💕\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f495.png\" style=\"height: 1em;\" /><br /><em>Birgit</em></p>\n\n\n\n\n\n<div class=\"wp-block-group has-light-background-background-color has-background\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n<p class=\"has-small-font-size\">WordCamp Europe is just around the corner! <img alt=\"🎉\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f389.png\" style=\"height: 1em;\" /> If you want to meet up in Basel (June 4–7), <a href=\"https://calendly.com/pauli-haack/wordcamp-europe\">grab a slot on my calendar</a> or send me your link. <a href=\"https://mastodon.social/tags/WCEU\">#WCEU</a></p>\n\n\n\n<figure class=\"wp-block-image size-full is-style-no-vertical-margin\"><a href=\"https://calendly.com/pauli-haack/wordcamp-europe\"><img alt=\"\" class=\"wp-image-40524\" height=\"367\" src=\"https://i0.wp.com/gutenbergtimes.com/wp-content/uploads/2025/05/Book-a-meeting-with-Birgit-Pauli-Haack.jpg?resize=652%2C367&#038;ssl=1\" width=\"652\" /></a></figure>\n</div></div>\n\n\n<section class=\"wp-block-newsletterglue-group\" style=\"padding-top: 10px; padding-bottom: 10px; padding-left: 20px; padding-right: 20px; margin-top: 0px; margin-bottom: 0px;\"></section>\n\n\n<p>ICYMI: <a href=\"https://us.wordcamp.org/2025/call-for-speakers/\"><strong>WordCamp US Call for Speaker is now live</strong></a> the deadline is June 20, 2025. WordCamp US will take place from August 26 to 29th, 2025. Similar to last year, there are no lightening talks, only long form talks, workshops, or campfire sessions. August 26 will be Contributor Day. Sessions start on August 27 in three tracks. You need to have a WordPress.org account to enter the form. The <a href=\"https://us.wordcamp.org/2025/call-for-sponsors/\">Call for Sponsors</a> has also been published. </p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https://us.wordcamp.org/2025/call-for-speakers-wordcamp-us-2025/\"><img alt=\"\" class=\"wp-image-40544\" height=\"343\" src=\"https://i0.wp.com/gutenbergtimes.com/wp-content/uploads/2025/05/WordCamp-US-2025-Call-For-Speakers-1.png?resize=652%2C343&#038;ssl=1\" width=\"652\" /></a></figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"0-word-press-release-information\">Developing Gutenberg and WordPress</h2>\n\n\n\n<p><strong>George Mamadashvili</strong> just dropped the <a href=\"https://github.com/WordPress/gutenberg/releases/tag/v20.9.0-rc.1\">Gutenberg 20.9 RC1</a> for everyone to test out, and we’re expecting the final version to go live next week! After WordCamp Europe, I&#8217;ll catch up with Anne McCarthy to record our next Gutenberg Changelog, where we’ll chat about a bunch of stuff, including those two Gutenberg plugin releases, 20.9 and 21.0.</p>\n\n\n\n<div class=\"wp-block-group has-light-background-background-color has-background\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n<p><img alt=\"🎙\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f399.png\" style=\"height: 1em;\" /> The latest episode <a href=\"https://gutenbergtimes.com/podcast/gutenberg-changelog-117-woocommerce-starter-theme-and-blocks/\">Gutenberg Changelog 117 – WooCommerce Starter Theme and Blocks, WordCamp Europe, and Gutenberg 20.7 and 20.8</a> I sat down with Ellen Bauer, WooCommerce product lead and discussed what she is working on, WordCamp Europe, Create Block Theme, WP-CLI, Gutenberg 20.7 and Gutenberg 20.8 releases. </p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img alt=\"Ellen Bauer and Birgit Pauli-Haack recording Gutenberg Changelog 117\" class=\"wp-image-40375\" height=\"184\" src=\"https://i0.wp.com/gutenbergtimes.com/wp-content/uploads/2022/03/Screenshot-2025-05-10-at-12.16.57.png?resize=652%2C184&#038;ssl=1\" width=\"652\" /></figure>\n</div></div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"0-p\">Plugins, Themes, and Tools for #nocode site builders and owners</h2>\n\n\n\n<p><strong>Johanne Courtright </strong>explains how <a href=\"https://groundworx.dev/gutenberg-is-a-game-changer-and-clients-actually-love-it-when-done-right/\"><strong>Gutenberg is a game-changer — and clients actually love it (when done right).</strong></a> When implemented thoughtfully, she found, the Gutenberg editor revolutionizes WordPress by empowering clients with intuitive, flexible content creation. In her experience, clients express genuine satisfaction, as Gutenberg’s block-based approach simplifies editing and design, making website management more accessible and enjoyable for non-technical users.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong>Kevin Batdorf</strong> <a href=\"https://x.com/kevinbatdorf/status/1924334824640451038\">updated</a> his plugin <a href=\"https://wordpress.org/plugins/pattern-css/\"><strong>Pattern CSS</strong></a> . It lets you add CSS scoped to a block, and recently added a floating editor as well as a global CSS editor, making it easy to add custom animations or anything. It&#8217;s parsed via Lightening CSS in WebAssembly as you type, and works well with synced patterns.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong><a href=\"https://bsky.app/profile/zodiac1978.bsky.social\">Thorsten Landsiedel</a></strong> published a plugin called &#8220;<a href=\"https://github.com/Zodiac1978/hide-in-feed\"><strong>Hide Block in RSS feed</strong>,</a>&#8221; which adds a toggle switch to block sidebars for suppressing content in RSS feeds. In his talk at WordCamp Leipzig, he noted that decorative icons/images may display differently in RSS readers. Using this block you can improve readability by suppressing specific blocks in the feeds. The <a href=\"https://github.com/Zodiac1978/hide-in-feed\">plugin is available</a> on GitHub.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong>Weston Ruter</strong>, a long-time WordPress Core committer, explains step-by step how he <a href=\"https://weston.ruter.net/2025/05/17/adding-caption-and-lightbox-to-the-featured-image-block/\"><strong>added caption and lightbox to the featured image block</strong></a>. When Weston Ruter rebuilt his site with the Twenty Twenty-Five theme, he noticed the Featured Image block lacked caption and lightbox features. Both features are available for the Image block. Ruter shared code examples on how he implemented these features in a plugin. Then he also suggested future improvements for WordPress core.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><a href=\"https://wordpress.org/plugins/wm-animations/\"><strong>WM Animations</strong></a> plugin by <strong>Widescreen Media</strong>, a company from Sweden, helps users to add entrance animations like fade-in and slide-in to core blocks. &#8220;You can select animation type and adjust duration/delay per block, directly in the block inspector. Works well with all core blocks and most custom blocks.&#8221; <a href=\"https://widescreen.media/\">Widescreen Media&#8217;s website</a> might be the best demo for this plugin.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong>Andy Fragen</strong>, core contributor and trauma surgeon, authored quite a few <a href=\"https://profiles.wordpress.org/afragen/#content-plugins\">plugins</a>. The <strong><a href=\"https://wordpress.org/plugins/oembed-gist-files/\">oEmbed for GitHub Gist</a> </strong>plugin enables writers to add code from  GitHub Gists via the Embed block to their posts. For classic editor users, you just put the URL on a new line. </p>\n\n\n<section class=\"wp-block-newsletterglue-callout undefined not-color-set\" style=\"border-color: #f9f9e5; border-radius: 22px; border-style: solid; border-width: 0; padding-top: 20px; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; text-align: left; margin-left: 0; margin-right: 0; margin-top: 0px; margin-bottom: 0px; background-color: #f9f9e5;\">\n<p><strong> <a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/\" rel=\"noreferrer noopener\" target=\"_blank\">&#8220;Keeping up with Gutenberg &#8211; Index 2025&#8221;</a> </strong><br />A chronological list of the WordPress Make Blog posts from various teams involved in Gutenberg development: Design, Theme Review Team, Core Editor, Core JS, Core CSS, Test, and Meta team from Jan. 2024 on. Updated by yours truly. The previous years are also available: <strong><strong><a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/keeping-up-with-gutenberg-index-2020/\">2020</a> | <a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/keeping-up-with-gutenberg-index-2021/\">2021</a></strong> | <strong><a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/keeping-up-with-gutenberg-index-2022/\">2022</a></strong></strong> | <strong><a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/gutenberg-index-2023\">2023</a></strong> | <a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/gutenberg-index-2024/\"><strong>2024</strong></a></p>\n</section>\n\n\n<h2 class=\"wp-block-heading\" id=\"3-building-themes-for-fse-and-word-press\">Building Blocks and Tools for the Block editor</h2>\n\n\n\n<p><a href=\"https://wordpress.tv/event/wordcamp-lisboa-2025/\">Video recordings from <strong>Lisboa&#8217;s WordCamp 2025</strong></a> are already available on WordPressTV </p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https://wordpress.tv/2025/05/19/wordpress-gems-for-devs-interactivity-api/\"><strong>WordPress gems for devs: Interactivity API</strong></a> with Milana Cap</li>\n\n\n\n<li><a href=\"https://wordpress.tv/2025/05/19/connecting-custom-fields-from-meta-boxes-to-blocks-and-beyond/\"><strong>Connecting custom fields: From meta boxes to blocks and beyond</strong></a> with Ryan Welcher </li>\n\n\n\n<li><a href=\"https://wordpress.tv/2025/05/19/woocommerce-checkout-block-what-you-missed/\"><strong>WooCommerce Checkout block, what you missed!</strong></a> with Nadir Seghir<br /></li>\n</ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong>Seth Rubenstein</strong>, lead engineer at Pew Research Center, <a href=\"https://x.com/SethRubenstein/status/1923426022285799842\">decided</a> to take a break from regularly scheduled work to play around with an <a href=\"https://github.com/pewresearch/wp-interactivity-api-chrome-extension\"><strong>Interactivity API (iAPI) Inspector Chrome Extension</strong></a>. This tool offers dev tools to highlight iAPI directives and context associated with a block as well as map connections between iAPI stores on a page.</p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https://github.com/pewresearch/wp-interactivity-api-chrome-extension\"><img alt=\"Screenshot of the Interactivity API Inspector Chrome Extension\" class=\"wp-image-40546\" height=\"264\" src=\"https://i0.wp.com/gutenbergtimes.com/wp-content/uploads/2025/05/Screenshot-2025-05-23-at-15.45.53.png?resize=652%2C264&#038;ssl=1\" width=\"652\" /></a></figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong>Jonathan Bossenger</strong> has spent some time the last couple of weeks learning more about <a href=\"https://github.com/Automattic/wp-feature-api\">Feature API</a>, the <a href=\"https://github.com/Automattic/wordpress-mcp\">WordPress MCP</a> plugin and the MCP WordPress remote package. In his latest video, <a href=\"https://www.youtube.com/watch?v=PsrrTZ6Ph3I\"><strong>Are your WordPress plugins and themes ready for AI?</strong></a> he puts it all together using one of his plugins and shows the various steps:  </p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Registering Features with the Feature API Plugin</li>\n\n\n\n<li>Converting Features into Tools with MCP Plugin</li>\n\n\n\n<li>Configuring AI Tools to Use MCP Features</li>\n</ul>\n\n\n<div class=\"wp-block-newsletterglue-showhide ng-block\" width=\"100%\">\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n\n</div></figure>\n</div>\n\n\n<p>Once you watched the video a couple of times, it might be helpful to also read <strong>Jamie Marsland</strong>&#8216;s post on LinkedIn again:  <a href=\"https://www.linkedin.com/pulse/wordpress-sitting-goldmine-feature-api-just-dug-first-jamie-marsland-3sije/?trackingId=qVLCTVZZSniPqxIiHZRpdQ%3D%3D\"><strong>WordPress Is Sitting on a Goldmine — And the Feature API Just Dug the First Tunnel</strong></a></p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p>In this week&#8217;s live stream, <strong>Ryan Welcher</strong> also took a <a href=\"https://www.youtube.com/watch?v=HqLXvOneHHw\" rel=\"noreferrer noopener\" target=\"_blank\"><strong>A first look at the new WordPress Feature API</strong></a>. He calls the Feature API &#8220;a powerful new way of exposing WordPress functionality in a standardized, discoverable way for both server and client-side use.&#8221;</p>\n\n\n<div class=\"wp-block-newsletterglue-showhide ng-block\" width=\"100%\">\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n\n</div></figure>\n</div>\n\n\n<h2 class=\"wp-block-heading\" id=\"what-is-new-in-playground\">What is new in Playground?</h2>\n\n\n\n<p>Roger Williams and I spoke about my upcoming WordCamp EU workshop.&#8221; &#8220;<a href=\"https://europe.wordcamp.org/2025/session/from-zero-to-demo-mastering-wordpress-playground-blueprints/\"><em>From Zero to Demo: Mastering WordPress Playground Blueprints</em></a>&#8220;. The recording is available on YouTube <a href=\"https://www.youtube.com/watch?v=BDBZKjV3Js0\"><strong>WordPress Playground Workshop Preview with Birgit Pauli-Haack</strong></a></p>\n\n\n<div class=\"wp-block-newsletterglue-showhide ng-block\" width=\"100%\">\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n\n</div></figure>\n</div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong>Karthick Murugan</strong>, from the Multidots team,  updated documentation with everything you want to know about the current web instance: <a href=\"https://wordpress.github.io/wordpress-playground/web-instance\"><strong>WordPress Playground web instance</strong></a>. </p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p>Earlier this week, I wrote about the early version of the <a href=\"https://www.npmjs.com/package/@wp-playground/cli\">Playground CLI</a> and how to use it to test your plugin and theme in development or your blueprints locally. <a href=\"https://icodeforapurpose.com/early-version-playground-cli-testing/\"><strong>Early version Playground CLI testing</strong></a>.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p>In <a href=\"https://icodeforapurpose.com/automating-wordpress-playground-screenshots-with-node-js-and-playwright/\"><strong>Automating WordPress Playground Screenshots with Node.js and Playwright</strong></a> I shared the context and code using the JavaScript API to call a with a playwright browser instance to take a screenshot of the Playground site configured with a blueprint.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n<section class=\"wp-block-newsletterglue-callout undefined not-color-set\" style=\"border-color: #eeeeee; border-radius: 26px; border-style: solid; border-width: 0; padding-top: 20px; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; text-align: left; margin-left: 0; margin-right: 0; margin-top: 0px; margin-bottom: 0px; background-color: #f3efe9;\">\n<p><strong><a href=\"https://gutenbergtimes.com/need-a-zip-from-master/\">Need a plugin .zip from Gutenberg&#8217;s master branch?</a></strong><br />Gutenberg Times provides daily build for testing and review. </p>\n\n\n\n<p>Now also available via <a href=\"https://playground.wordpress.net/?blueprint-url=https://gutenbergtimes.com/wp-content/uploads/2020/11/playnightly.json\">WordPress Playground</a>. There is no need for a test site locally or on a server. Have you been using it? <a href=\"mailto:pauli@gutenbergtimes.com\">Email me </a>with your experience</p>\n\n\n\n<p><img alt=\"GitHub all releases\" src=\"https://img.shields.io/github/downloads/bph/gutenberg/total?style=for-the-badge\" /></p>\n</section>\n\n\n<p class=\"has-text-align-center has-small-font-size\"><em>Questions? Suggestions? Ideas? </em><br /><em>Don&#8217;t hesitate to send <a href=\"mailto:pauli@gutenbergtimes.com\">them via email</a> or</em><br /><em> send me a message on WordPress Slack or Twitter @bph</em>.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" />\n\n\n\n<p class=\"has-text-align-center has-small-font-size\">For questions to be answered on the <a href=\"http://gutenbergtimes.com/podcast\">Gutenberg Changelog</a>, <br />send them to <a href=\"mailto:changelog@gutenbergtimes.com\">changelog@gutenbergtimes.com</a></p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n<section class=\"wp-block-newsletterglue-group\" style=\"padding-top: 10px; padding-bottom: 10px; padding-left: 20px; padding-right: 20px; margin-top: 0px; margin-bottom: 0px;\">\n<p>Featured Image: Photo by Ivan Bandura on Unsplash</p>\n\n\n\n<hr class=\"wp-block-separator has-css-opacity is-style-wide\" />\n\n\n\n<p class=\"has-text-align-left\"><strong>Don&#8217;t want to miss the next Weekend Edition? </strong></p>\n\n\n<form action=\"https://gutenbergtimes.com/feed/\" autocomplete=\"on\" class=\"wp-block-newsletterglue-form ngl-form ngl-portrait\" method=\"post\"><div class=\"ngl-form-container\"><div class=\"ngl-form-field\" style=\"margin-bottom: 25px;\"><label class=\"ngl-form-label\" for=\"ngl_email\"><br />Type in your Email address to subscribe.</label><div class=\"ngl-form-input\"><input autocomplete=\"email\" class=\"ngl-form-input-text\" id=\"ngl_email\" name=\"ngl_email\" required=\"required\" style=\"border-radius: 21px;\" type=\"email\" /></div></div><button class=\"ngl-form-button\" style=\"background-color: #005075; border-color: #005075; border-width: 1px; border-style: solid; color: #ffffff; border-radius: 21px;\" type=\"submit\">Subscribe</button><p class=\"ngl-form-text\">We hate spam, too, and won&#8217;t give your email address to anyone <br />except Mailchimp to send out our Weekend Edition</p></div><div class=\"ngl-message-overlay\"><div class=\"ngl-message-svg-wrap\"><svg fill=\"none\" height=\"24\" stroke=\"#fff\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><polyline points=\"20 6 9 17 4 12\"></polyline></svg></div><div class=\"ngl-message-overlay-text\">Thanks for subscribing.</div></div><input id=\"ngl_list_id\" name=\"ngl_list_id\" type=\"hidden\" value=\"26f81bd8ae\" /><input id=\"ngl_double_optin\" name=\"ngl_double_optin\" type=\"hidden\" value=\"yes\" /></form>\n\n\n<hr class=\"wp-block-separator has-css-opacity is-style-wide\" />\n</section>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Sat, 24 May 2025 09:15:08 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:18:\"Birgit Pauli-Haack\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:38;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:58:\"Gravatar: Proven Branding Methods for Professional Coaches\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:32:\"http://blog.gravatar.com/?p=3184\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:58:\"https://blog.gravatar.com/2025/05/23/branding-for-coaches/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:15736:\"<p>Are you looking for a way to differentiate your coaching services in a competitive online market? You&#8217;re not alone. Many coaches struggle to stand out among thousands of others offering similar services.</p>\n\n\n\n<p>Here&#8217;s the good news: <strong>Effective coach branding doesn&#8217;t require massive budgets or complex systems.</strong> Instead, success comes from focusing on a few foundational pillars: Optimizing your digital presence, promoting your services strategically, and tracking performance consistently.</p>\n\n\n\n<p>And no, you don&#8217;t need to hire expensive agencies or completely redesign your business. Small, targeted improvements to your branding can yield significant results in attracting your ideal clients.</p>\n\n\n\n<p>This guide cuts through the theory and provides practical, proven branding techniques specifically for coaches. Each strategy is designed to help you build a distinctive professional identity that resonates with potential clients and positions you as the obvious choice in your coaching niche.</p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Essential elements of a professional coaching brand</strong></h2>\n\n\n\n<p>The foundation of any successful coaching business isn&#8217;t flashy graphics or clever slogans – it&#8217;s a consistent multi-platform presence strategy. This means maintaining a unified professional identity across coaching directories, your website, social media profiles, and professional networks. Tools like <a href=\"https://gravatar.com\">Gravatar</a> can help automate this consistency, ensuring your professional image remains cohesive wherever potential clients encounter you online.</p>\n\n\n\n<p><strong>A big part of that consistency is demonstrating your expertise.</strong> Potential clients need clear evidence of your capabilities through certifications, testimonials, and client success stories prominently displayed in your professional bios and website. These serve as social proof that validates your coaching abilities to skeptical prospects.</p>\n\n\n\n<p>Video content has become a particularly powerful way to showcase expertise. According to <a href=\"https://wistia.com/learn/marketing/video-marketing-statistics\">Wistia&#8217;s 2025 State of Video Report</a>, short-form video content significantly outperforms other formats in engagement rates, with how-to videos under one minute achieving 82% viewer completion. <a href=\"https://www.instagram.com/\">Instagram</a> reels and <a href=\"https://www.tiktok.com/\">TikTok</a> tutorials offer perfect platforms to demonstrate your coaching approach in action.</p>\n\n\n\n<p>To truly stand out, develop proprietary frameworks or methodologies that distinguish your services from generic coaching approaches. This gives clients a concrete system to understand and helps position you as an innovative thinker in your field.</p>\n\n\n\n<p>On top of that, you need to take whatever time you need to identify what makes your coaching unique – your background, approach, client specialization, or results – and weave these elements into a compelling coaching story that resonates with your target audience.</p>\n\n\n\n<p>Now, let&#8217;s explore some practical ways to build these brand pillars.</p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>How Gravatar powers your coaching brand identity</strong></h2>\n\n\n\n<figure class=\"wp-block-image size-full\"><img alt=\"1 – Gravatar homepage\" class=\"wp-image-3187\" height=\"1298\" src=\"https://blog.gravatar.com/wp-content/uploads/2025/04/1-gravatar-new-homepage.png\" width=\"2492\" /></figure>\n\n\n\n<p>Establishing a consistent online presence is one of the biggest challenges for coaches, but thankfully, this is where <a href=\"https://gravatar.com\">Gravatar</a> steps in as a powerful brand management tool. As a &#8220;Globally Recognized Avatar,&#8221; Gravatar can become like a central identity hub that automatically syncs across thousands of platforms, eliminating the frustration of managing multiple profiles.</p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img alt=\"2 – Ronnie Burt Gravatar profile\" class=\"wp-image-3188\" height=\"1323\" src=\"https://blog.gravatar.com/wp-content/uploads/2025/04/2-ronnie-new-gravatar-profile.png\" width=\"1755\" /></figure>\n\n\n\n<p>Think of Gravatar as your <a href=\"https://blog.gravatar.com/2024/11/08/creating-a-digital-business-card/\">digital business card</a> on steroids. It connects your professional image, bio, and credentials across coaching directories, blog comments, professional forums, and social platforms. When potential clients encounter you across different channels, they&#8217;ll recognize your consistent presence immediately, crucial for building recognition in a crowded coaching marketplace.</p>\n\n\n\n<p>The trust factor gets a significant boost with Gravatar&#8217;s verification system. Each link on your profile can display a &#8220;verified&#8221; tick, signalling authenticity to sceptical prospects. In coaching, where trust is everything, these small trust signals make a substantial difference in conversion rates.</p>\n\n\n\n<p>Your Gravatar profile can even live as a <a href=\"https://docs.gravatar.com/2024/05/23/qr-me-this-qr-me-that/\">QR code</a> in your phone&#8217;s digital wallet, making <a href=\"https://blog.gravatar.com/2024/06/16/how-to-network-at-a-conference/\">in-person networking seamless</a>. </p>\n\n\n\n<figure class=\"wp-block-image\"><img alt=\"3 – Adding a Gravatar QR code to your phone wallet \" src=\"https://lh7-rt.googleusercontent.com/docsz/AD_4nXf5MKKCpsP1BhXvYsdilJmK9Ty2TOjDVzHqlY_ikPaU8fj3Y3Fc8LuLNxrpFfbeGzcGlHQj-HEJgYheCu0ssRwG3MOFvYdql30cIUEFHjfwCv0pg977B1coL7VtyIf_7em26gSXiQ?key=sqicWRy8nfW2FmPeb7oslwrq\" /></figure>\n\n\n\n<p>Update your credentials once, and the changes reflect everywhere – saving hours of profile management while maintaining brand consistency.</p>\n\n\n\n<p>Ready to strengthen your coaching brand? <a href=\"https://gravatar.com/\">Get your free Gravatar profile</a> today and bring cohesion to your digital presence.</p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https://gravatar.com/connect/?gravatar_from=blog\"><img alt=\"\" class=\"wp-image-2616\" height=\"729\" src=\"https://blog.gravatar.com/wp-content/uploads/2024/12/free_profile_cta.png\" width=\"3243\" /></a></figure>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Building trust through verified profiles and consistent presence</strong></h3>\n\n\n\n<p>Verification is no longer optional in the coaching industry – it&#8217;s essential. When potential clients research your services, they&#8217;re looking for trust signals that verify your authenticity and expertise. Social media verification acts as a powerful trust marker in a saturated market.</p>\n\n\n\n<p><a href=\"https://www.instagram.com/\">Instagram</a> deserves special attention in your verification strategy. According to <a href=\"https://luisazhou.com/blog/instagram-for-coaches/\">research from Luisa Zhou</a>, this platform is where many coaches successfully find their highest-quality clients, with 54% of Instagram users making purchases after discovering services there. So naturally, verifying your Instagram presence should be a priority.</p>\n\n\n\n<p>Similarly, establishing verified presence on X (formerly Twitter) creates additional credibility touchpoints in your professional ecosystem.</p>\n\n\n\n<p>For coaches using newer platforms like <a href=\"https://blog.gravatar.com/2024/12/03/new-free-domains-and-bluesky-integration/\">Bluesky</a>, Gravatar offers a unique advantage – you can get a <a href=\"https://blog.gravatar.com/2025/02/06/bluesky-handle/\">custom Bluesky domain name</a> and verify it directly through Gravatar, creating an additional layer of professional credibility.</p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img alt=\"4 – Changing the Bluesky domain to a custom one through Gravatar\" class=\"wp-image-3189\" height=\"394\" src=\"https://blog.gravatar.com/wp-content/uploads/2025/04/4-domain-updated-confirmation.png?w=660\" width=\"660\" /></figure>\n\n\n\n<p>Gravatar&#8217;s &#8220;update once, sync everywhere&#8221; system means your verified professional image automatically appears across hundreds of platforms – from WordPress blogs where you guest post to professional forums where you engage potential clients.</p>\n\n\n\n<p>Think of Gravatar as the foundation of your coaching trust architecture. It creates a central verification hub from which <a href=\"https://blog.gravatar.com/2024/12/02/how-can-you-manage-your-digital-footprint/\">all aspects of your digital footprint link back</a>, establishing a cohesive professional identity that builds client confidence at every digital touchpoint.</p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Practical strategies to promote your coaching brand</strong></h2>\n\n\n\n<p>Establishing credibility through a verified online presence remains the cornerstone of successful coach branding. Creating a verified professional presence using Gravatar across coaching platforms and professional networks provides the essential foundation upon which all other brand-building activities should build. This baseline credibility creates the trust necessary for potential clients to consider your services.</p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Position yourself as a thought leader</strong></h3>\n\n\n\n<p>To elevate beyond basic verification, position yourself as a thought leader through specialized content that directly addresses specific pain points in your coaching niche. This approach demonstrates your expertise while providing immediate value to potential clients.</p>\n\n\n\n<p>Effective thought leadership channels include:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https://www.linkedin.com/\"><strong>LinkedIn</strong></a><strong> articles</strong> that dissect complex coaching challenges.</li>\n\n\n\n<li><a href=\"https://www.instagram.com/\"><strong>Instagram</strong></a><strong> carousels</strong> explaining your methodologies (these have 82% higher engagement for coaching content).</li>\n\n\n\n<li><strong>Blog posts</strong> on your website that showcase your unique perspective.</li>\n\n\n\n<li><strong>Email newsletters</strong> with actionable insights.</li>\n</ul>\n\n\n\n<p>The most successful coaches don&#8217;t create generic content – they develop material that speaks directly to their audience&#8217;s most pressing challenges, demonstrating both understanding and solution expertise.</p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Develop your signature framework</strong></h3>\n\n\n\n<p>Creating a distinctive &#8220;signature framework&#8221; dramatically separates your coaching brand from competitors while simplifying your marketing message. For example, a life coach specializing in work-life balance might develop &#8220;The Balance Blueprint&#8221; – a structured, step-by-step process clients follow to achieve harmony between career and personal priorities.</p>\n\n\n\n<p>Your signature framework accomplishes two critical objectives simultaneously:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>It clarifies your methodology for potential clients.</li>\n\n\n\n<li>It creates a memorable brand element that differentiates you from generic coaching approaches.</li>\n</ul>\n\n\n\n<p>This combination builds both trust and recognition – the twin pillars of effective coach branding.</p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Forge strategic partnerships</strong></h3>\n\n\n\n<p>Explore high-value coaching partnerships with complementary service providers and industry experts. A relationship coach might partner with a financial advisor to address money conflicts in relationships, creating a more comprehensive solution while accessing a new client base.</p>\n\n\n\n<p>Additionally, seek opportunities to speak at industry conferences and events. These platforms position you as an authority while creating valuable networking opportunities with potential clients and partners who already recognize your expertise.</p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Measure your brand&#8217;s impact and reach</strong></h3>\n\n\n\n<p>Without tracking key metrics, you&#8217;re essentially operating in the dark, making decisions based on gut feeling rather than data.</p>\n\n\n\n<p><strong>Start by monitoring these fundamental metrics that directly reflect your brand&#8217;s performance:</strong></p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Track not just visitor numbers but engagement metrics like time-on-page and bounce rates.</li>\n\n\n\n<li>Measure shares, comments, and saves (not just likes).</li>\n\n\n\n<li>Monitor conversion rates from brand touchpoints to inquiries.</li>\n</ul>\n\n\n\n<p>Tools like <a href=\"https://marketingplatform.google.com/about/analytics/\">Google Analytics</a> provide comprehensive website insights, while platform-specific analytics like Instagram Insights and LinkedIn Analytics reveal how your content performs across different channels.</p>\n\n\n\n<p><strong>Still, data without action is useless.</strong> Use your metrics to continuously refine your approach:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Identify which topics generate the most engagement and double down.</li>\n\n\n\n<li>Spot underperforming channels and either optimize or reallocate resources.</li>\n\n\n\n<li>Test different content formats to determine what resonates best with your audience.</li>\n</ul>\n\n\n\n<p>When metrics show declining engagement, don&#8217;t just produce more content – produce better content that addresses the specific needs revealed in your data.</p>\n\n\n\n<p>And, once you do get the results you want, make sure you document your success stories – the most compelling brand assets are documented client transformations. Create systematic before-and-after assessments that quantify client progress:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Standardized assessment tools that measure baseline and improvement.</li>\n\n\n\n<li>Periodic progress check-ins that document incremental gains.</li>\n\n\n\n<li>Video testimonials that capture emotional and practical outcomes.</li>\n</ul>\n\n\n\n<h1 class=\"wp-block-heading\"><strong>Take your coaching brand to the next level</strong></h1>\n\n\n\n<p>Building a verified, consistent online presence using tools like Gravatar creates the essential foundation for your coaching brand. This strategic approach eliminates the fragmentation that undermines many coaches&#8217; digital presence while establishing the credibility necessary to convert prospects into clients.</p>\n\n\n\n<p>With Gravatar handling your consistent visual representation across platforms, you&#8217;re free to focus on what truly matters – delivering high-value client interactions through optimized touchpoints. Your social media engagement, website inquiries, and professional forum participation all benefit from the trust architecture you&#8217;ve established.</p>\n\n\n\n<p>To sum it up, here’s what you need for success: </p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>A proprietary methodology that becomes synonymous with your name.</li>\n\n\n\n<li>Diverse content formats that appeal to different learning styles.</li>\n\n\n\n<li>Strategic partnerships that expand your reach into complementary audiences.</li>\n</ul>\n\n\n\n<p>The coaches who succeed don&#8217;t try to implement everything at once. They start with fundamentals, like<a href=\"https://gravatar.com/\"> creating a free Gravatar profile</a>, and systematically build their brand presence over time.</p>\n\n\n\n<p>Remember that brand development is a gradual, ongoing process. Each small improvement compounds, creating a professional presence that stands out in a crowded marketplace. </p>\n\n\n\n<p>Happy branding!</p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https://gravatar.com/connect/?gravatar_from=blog\"><img alt=\"\" class=\"wp-image-2616\" height=\"729\" src=\"https://blog.gravatar.com/wp-content/uploads/2024/12/free_profile_cta.png\" width=\"3243\" /></a></figure>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Fri, 23 May 2025 17:44:13 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:11:\"Ronnie Burt\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:39;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:47:\"Gravatar: What Makes a Digital Avatar Effective\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:32:\"http://blog.gravatar.com/?p=3289\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:62:\"https://blog.gravatar.com/2025/05/23/what-is-a-digital-avatar/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:19145:\"<p>Fun fact: The global digital avatar market is hurtling toward a whopping<a href=\"https://www.grandviewresearch.com/industry-analysis/digital-avatar-market-report\"> <strong>$270.61 billion</strong> by 2030</a>. That’s up from just $18.19 billion in 2023.</p>\n\n\n\n<p>What began as a simple, low-quality profile picture you might put on mIRC or MySpace can now become a full-blown brand asset. The kind that drives clicks, builds trust, and boosts conversions like a charm. </p>\n\n\n\n<p><em>But…</em> not all avatars are created equal. So what separates the forgettable from the phenomenal?</p>\n\n\n\n<p>Effective avatars are <em>engagement machines,</em> and brands that get it right are seeing:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Higher user engagement across channels.</li>\n\n\n\n<li>Sharper brand recall (because yep, that tiny image sticks).</li>\n\n\n\n<li>Better conversion rates on platforms with consistent avatar use.</li>\n\n\n\n<li>Warmer, more personal user experiences that actually build trust.</li>\n</ul>\n\n\n\n<p>This is more than some passing tech phase, it’s a fundamental shift in how digital identity is experienced. As AI-powered avatars and virtual reps get smarter, businesses are tapping into a new kind of connection – fast, human, and scalable.</p>\n\n\n\n<p>In this guide, we’ll walk you through how to build and deploy avatars that <em>work</em>, from brand consistency and personalization to next-gen tools like <a href=\"https://gravatar.com\">Gravatar</a> that simplify your digital identity across the web.</p>\n\n\n\n<p>No more juggling profile pics across platforms. No more brand dissonance. With a smart avatar strategy, you update once and show up everywhere, looking exactly how you want to.</p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https://gravatar.com/connect/?gravatar_from=blog\"><img alt=\"\" class=\"wp-image-2616\" height=\"729\" src=\"https://blog.gravatar.com/wp-content/uploads/2024/12/free_profile_cta.png\" width=\"3243\" /></a></figure>\n\n\n\n<h2 class=\"wp-block-heading\">What makes a digital avatar effective: Definition and importance</h2>\n\n\n\n<p>Digital avatars are not just sci-fi playthings anymore. These digital doppelgängers are the new face of brands and professionals online, popping up everywhere from sales decks to marketing assets and customer chats. </p>\n\n\n\n<p>Here’s the kicker: According to <a href=\"https://pmc.ncbi.nlm.nih.gov/articles/PMC9763494/\">research from the National Institutes of Health</a>, our brains respond to avatars <em>a lot</em> like we respond to real humans. Wild, right? But also incredibly useful. Because that means every time a customer sees your avatar, they’re not just spotting a fancy graphic – they’re building a sense of connection, trust, and familiarity, just like they would with a real-life person.</p>\n\n\n\n<p>Why does that matter? Well:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Avatars act as a consistent visual cue across all your brand’s touchpoints</li>\n\n\n\n<li>They turn dry, technical info into something surprisingly human</li>\n\n\n\n<li>They make your brand <em>stick</em> in people’s minds</li>\n\n\n\n<li>And most importantly, they help you build actual emotional resonance online</li>\n</ul>\n\n\n\n<p>And it’s not just big brands getting in on the avatar action. If you’re building a personal brand, a strong digital avatar can become your secret weapon, a visual shorthand people instantly recognize in comment threads, <a href=\"https://slack.com/\">Slack</a> groups, or <a href=\"https://linkedin.com/\">LinkedIn</a> scroll-athons. </p>\n\n\n\n<p>Of course, different use-cases will call for different strategies. A corporate avatar might need to channel “professional but warm,” while a personal brand might want something that screams “it’s me!” in the best way. Meanwhile, your social avatar? Feel free to let your creativity run wild (meme energy encouraged).</p>\n\n\n\n<p>The point is, the avatar you choose should match its mission. A customer support bot? Friendly and dependable. A sales rep avatar? Confident and persuasive. </p>\n\n\n\n<p>Over the rest of this post, we’ll break down how to tailor your avatar’s personality to fit the context, so you’re always putting your best digital face forward.</p>\n\n\n\n<h3 class=\"wp-block-heading\">Types of digital avatars: From simple icons to interactive representations</h3>\n\n\n\n<p>Let’s start with the basics: The humble headshot avatar. This is your digital calling card. A clean, static image that tells the internet, <em>“Yep, it’s me.”</em> <a href=\"https://gravatar.com/\">Gravatar</a> is the OG here – a global avatar service that ensures your chosen pic pops up consistently across thousands of sites. </p>\n\n\n\n<p><a href=\"https://wordpress.org/\">WordPress</a> blogs, <a href=\"https://github.com/\">GitHub</a> repos, <a href=\"https://slack.com/\">Slack</a> chats, and plenty more. Set it once, and voilà: Instant recognizability, no matter where you roam online.</p>\n\n\n\n<p>In fact, setting up your Gravatar takes less than 5 minutes (likely the best ROI you&#8217;ll ever get in under a coffee break).</p>\n\n\n\n<p><a href=\"https://gravatar.com/profile\"><em>Set it up in five minutes</em></a><em> now, save yourself fifty profile edits later.</em></p>\n\n\n\n<p>Zooming out beyond headshots, the avatar scene gets pretty creative:</p>\n\n\n\n<p><strong>2D customizable avatars</strong> let you tweak everything from eye shape to shoe style (e.g., <a href=\"https://www.bitmoji.com/\">Bitmoji</a>). They’re quirky, fun, and surprisingly simple to build.</p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img alt=\"2D Customizable Avatars\" class=\"wp-image-3294\" height=\"639\" src=\"https://blog.gravatar.com/wp-content/uploads/2025/05/bitmoji-avatars-1.png\" width=\"1500\" /></figure>\n\n\n\n<p><strong>3D static avatars</strong> offer depth, angles, shading, the works. They give your digital self some dimension and make your profile pic feel less…flat.</p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img alt=\"3D Meta Avatars\" class=\"wp-image-3293\" height=\"404\" src=\"https://blog.gravatar.com/wp-content/uploads/2025/05/3dmetaavatars-1.png?w=660\" width=\"660\" /></figure>\n\n\n\n<p><br />In 2022 Meta teamed up with the NFL to enable viewers to outfit their Avatars in the colors of the two Superbowl teams</p>\n\n\n\n<p><strong>3D animated avatars</strong>? Now we’re in Pixar territory. These avatars blink, smile, nod, and generally act like they’re about to ask you how your day’s going. Perfect for adding that human-ish warmth to virtual chats.</p>\n\n\n\n<p>At the frontier, we’ve got <strong>AI-powered avatars</strong>, and <em>this</em> is where things get spicy. Platforms like <a href=\"https://www.heygen.com/\">HeyGen</a> let you build avatars that don’t just look the part – they talk it too. Natural language processing means they can chat, answer questions, and generally hold their own in a conversation without sounding like a 2005 chatbot.</p>\n\n\n\n<figure class=\"wp-block-embed is-type-rich is-provider-embed-handler wp-block-embed-embed-handler wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<div class=\"embed-youtube\"></div>\n</div></figure>\n\n\n\n<p>And the tech’s only getting better. Even <a href=\"https://blog.gravatar.com/2025/05/06/build-your-ai-identity-with-gravatars-new-tool/\">Gravatar is creating AI-generated avatar tools</a>, so anyone – yes, even the design-challenged – can whip up a slick, professional avatar without breaking a sweat.</p>\n\n\n\n<p>The gap between digital you and real you is closing fast. And with these evolving tools, your online presence can be as polished, personable, or playfully weird as you want it to be.</p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>AI-powered avatars: The future of digital identity is already here</strong></h4>\n\n\n\n<p>Gravatar’s shiny <a href=\"https://blog.gravatar.com/2025/05/06/build-your-ai-identity-with-gravatars-new-tool/\">new AI Profile Builder</a>, launched in May 2025, is leading the charge to become the new face (quite literally) of digital identity. And with users saying they feel <a href=\"https://www.emerald.com/insight/content/doi/10.1108/jrim-07-2024-0344/full/html\"><em>more emotionally connected</em> to brands using personalized avatar</a> interactions over the usual click-and-type interfaces, this <em>isn’t</em> just for show.</p>\n\n\n\n<p>Tools like Gravatar’s AI Profile Builder allow you to build smart, secure avatars that actually <em>do something</em>.</p>\n\n\n\n<p>These AI avatars adapt based on where you are and who you’re talking to. Drop into a professional thread? Your avatar turns on the polish. Chiming in on a casual forum? It relaxes the tone. All without you lifting a finger.</p>\n\n\n\n<p>For businesses, this opens up a goldmine: Deeper customer engagement, zero need for juggling multiple digital personas, and bulletproof brand consistency, without compromising on privacy.</p>\n\n\n\n<p>We’re not just putting an AI face on your profile. We’re building a secure, intelligent bridge between your real self and your digital one – one that works across thousands of platforms.</p>\n\n\n\n<p>This means you get to nail that tricky balance between personalization and privacy. </p>\n\n\n\n<p>End result: A smart, responsive avatar that feels genuinely “you”, without handing over your life story to the algorithm gods.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Digital avatars in business: Strategic applications that drive results</h2>\n\n\n\n<p>When businesses keep their avatars consistent across platforms, they create that magical “ah yes, I know you” moment. It&#8217;s instant visual recognition that cements brand identity and reassures your audience they&#8217;re in the right place, whether they’re browsing your website, stalking your socials, or firing off a support ticket.</p>\n\n\n\n<p>And it’s not just about looking slick. A <a href=\"https://centaur.reading.ac.uk/119012/\">2024 University of Reading study</a> showed a significant jump in user interactions when brands used culturally tuned digital avatars in international campaigns. </p>\n\n\n\n<p>Turns out people respond better when your brand feels familiar and relatable, and not like a tourist fumbling through Google Translate.</p>\n\n\n\n<p>But avatars aren’t just for marketing. They’re transforming customer service, too. Virtual assistants with avatar interfaces spark more engagement than plain old text bots. Turns out, people prefer chatting with a “someone” rather than a “something.”</p>\n\n\n\n<p>Case in point: <strong>Lemonade Insurance</strong>.</p>\n\n\n\n<p>Their claims assistant, Jim (an AI avatar), <a href=\"https://aimagazine.com/articles/lemonade-sets-world-record-with-2-second-ai-insurance-claim\">processes requests in <em>literal</em> seconds</a>. Customers now trust it more than traditional reps, and it’s not just about the speed – being presented with a friendly, familiar face turns a cold system into a warm interaction.</p>\n\n\n\n<p>The end result? Happier users who stick around longer and actually enjoy the convo.</p>\n\n\n\n<p>Now, for the pros in the room: Enter <a href=\"https://gravatar.com/\"><em>Gravatar</em></a>.</p>\n\n\n\n<p>Whether you’re replying to a blog comment, debugging on Stack Overflow, or posting in a Slack channel, <a href=\"https://gravatar.com/\">Gravatar</a> has you covered.</p>\n\n\n\n<p>Unlike avatars that change depending on the platform (and leave your brand scattered like confetti), Gravatar keeps everything tidy and cohesive. Set it up once, and your professional avatar just <em>shows up</em> across thousands of platforms without you lifting a finger. It’s recognition on autopilot.</p>\n\n\n\n<p>And for businesses building community platforms? The Gravatar API is your new best friend. It lets users show up with their avatars already in tow – no need for endless image uploads or awkward “who’s who” moments. Just seamless, identity-based connection right out of the box.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Implementation guide: Creating the right avatar solution for your needs</h2>\n\n\n\n<p>Before you go charging into avatar creation mode, pause. Breathe. Ask yourself: <strong>What do I actually need this avatar to </strong><strong><em>do</em></strong><strong>?</strong></p>\n\n\n\n<p>Because the best avatar isn’t just pretty, it’s <em>purpose-built</em>. And the right solution depends entirely on your goals:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Brand consistency</strong> – Need a single, recognizable face across all your digital turf?</li>\n\n\n\n<li><strong>Personal branding</strong> – Want to show up as a thought leader or expert, loud and clear?</li>\n\n\n\n<li><strong>Customer interaction</strong> – Planning to use avatars in live support or sales scenarios?</li>\n\n\n\n<li><strong>Immersive engagement</strong> – Building an experience that needs personality, emotion, and <em>connection</em>?</li>\n</ul>\n\n\n\n<p>Each goal unlocks a different avatar approach, so pick your strategy before picking your style.</p>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><strong>Type of avatar</strong></td><td><strong>Purpose </strong></td><td><strong>Examples</strong></td></tr><tr><td>Static</td><td>Consistent visual branding; establish familiarity and recognition.</td><td>Company logo icon, profile headshot, illustrated character used across web pages and email signatures</td></tr><tr><td>Interactive</td><td>Real-time, personalized customer interaction</td><td>AI chatbot with animated face, live avatar-based support agent</td></tr></tbody></table></figure>\n\n\n\n<p>No matter what your preferred avatar is, if you&#8217;re building a full-blown avatar ecosystem (i.e., membership platforms, technical communities, enterprise apps), then you’ll want to get serious about your tech stack.</p>\n\n\n\n<p>Here’s what to factor in:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Storage</strong> for high-res avatar files</li>\n\n\n\n<li><strong>Content delivery networks (CDNs)</strong> for global speed</li>\n\n\n\n<li><strong>Sync systems</strong> to keep identities aligned everywhere</li>\n\n\n\n<li><strong>API integrations</strong> with your user databases</li>\n</ul>\n\n\n\n<p>This is where Gravatar really shines: Its email-based ID system handles identity, and the REST API makes delivery dead simple. Just hash an email, hit the avatar or profile endpoint, and Gravatar returns consistent, customizable visuals – no storage, no syncing, no fuss. </p>\n\n\n\n<p>Developers get fast, cacheable responses, optional profile data, and fallback image controls – all without bloating your backend or reinventing the wheel.</p>\n\n\n\n<p>Bottom line: Your perfect avatar setup depends on what you&#8217;re building, how techy you&#8217;re feeling, and the kind of connection you want with your audience. Choose wisely, and let your digital self do the heavy lifting.</p>\n\n\n\n<h3 class=\"wp-block-heading\">Digital avatar design best practices</h3>\n\n\n\n<p>When it comes to designing your digital avatar, you want it to be instantly recognizable, reliably familiar, and – above all – consistent wherever it shows up. That visual déjà vu is what builds trust. So, a few pointers:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Always, always go for crisp, high-quality visuals</strong>. If your avatar looks like it was snapped through a potato or cropped with garden shears, it sends a subtle message that details aren’t your strong suit. Not ideal when you&#8217;re aiming to be taken seriously.</li>\n\n\n\n<li><strong>Make sure your avatar scales like a pro</strong>. Whether it’s a teeny-tiny dot in a comment thread or proudly displayed on your profile, it should stay sharp and identifiable. So skip the intricacies – those fine details tend to vanish faster than free Wi-Fi at a cheap café.</li>\n\n\n\n<li><strong>Test everything</strong>. Your avatar might look stunning on your 27-inch monitor, but end up awkwardly cropped on someone’s smartphone. Preview it everywhere before you commit.</li>\n</ul>\n\n\n\n<p>One last pro tip: Set up a <a href=\"https://gravatar.com/\">Gravatar</a> profile. It’s the easy button for keeping your avatar synced across WordPress, Slack, and a ton of other platforms. Update it once, and your whole digital universe stays in step. Clean, consistent, and credible.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Transform your online presence with Gravatar: Start creating your professional digital identity today</h2>\n\n\n\n<p>Tired of uploading your headshot <em>again</em> for the millionth platform? Gravatar is the slick, savvy avatar service that makes you look polished across the internet without breaking a sweat (or opening Photoshop).</p>\n\n\n\n<p>Set up your Gravatar once, and that single image becomes your visual passport across the internet, including websites like <a href=\"https://wordpress.com/\"><strong>WordPress</strong><strong>, </strong></a><a href=\"https://github.com/\"><strong>GitHub</strong><strong>, </strong></a><a href=\"https://slack.com/\"><strong>Slack</strong><strong>, </strong></a><a href=\"https://www.figma.com/\"><strong>Figma</strong><strong>, </strong></a><a href=\"https://mailchimp.com/\"><strong>Mailchimp</strong><strong>, </strong></a><a href=\"https://stackoverflow.com/\"><strong>Stack Overflow</strong><strong>, </strong></a><a href=\"https://openai.com/\"><strong>OpenAI</strong><strong>, </strong></a><a href=\"https://www.atlassian.com/\"><strong>Atlassian</strong><strong>, </strong></a><a href=\"https://www.coinbase.com/\"><strong>Coinbase</strong></a>, and more! </p>\n\n\n\n<p>Whether you’re commenting, collaborating, or contributing, your avatar shows up instantly, building recognition and credibility with every interaction.</p>\n\n\n\n<p>And if you’re creating a platform where identity matters, Gravatar’s APIs are a goldmine:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https://docs.gravatar.com/api/avatars/images/\"><strong>Avatar API</strong></a> – Automatically pulls user avatars so when they register on your website, they don&#8217;t have to upload a new profile pic – instant recognition and zero setup friction.<br /></li>\n\n\n\n<li><a href=\"https://blog.gravatar.com/2024/06/03/profiles-as-a-service/\"><strong>Profiles-as-a-Service API</strong></a> – Pulls bios, links, and other profile data <a href=\"https://blog.gravatar.com/2024/11/07/website-personalization-tools/\">directly from Gravatar</a>, streamlining onboarding and slashing form fatigue.</li>\n</ul>\n\n\n\n<p>Faster dev time, smoother UX, and more trust from day one.</p>\n\n\n\n<p>Oh, and did we mention? <strong>It’s totally free</strong>. No fees, no upsells, no “pro” plan with features locked behind a paywall. Gravatar is used by millions of professionals around the world, and you can join them without spending a penny.</p>\n\n\n\n<p>Just register and sit back as your avatar quietly does its thing, building trust, recognition, and brand alignment across the web.</p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https://gravatar.com/connect/?gravatar_from=blog\"><img alt=\"\" class=\"wp-image-2616\" height=\"729\" src=\"https://blog.gravatar.com/wp-content/uploads/2024/12/free_profile_cta.png\" width=\"3243\" /></a></figure>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Fri, 23 May 2025 17:42:01 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:11:\"Ronnie Burt\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:40;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:67:\"Do The Woo Community: Do the Woo is Sponsoring WordCamp Europe 2025\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:47:\"https://openchannels.fm/?post_type=blog&p=97385\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:70:\"https://openchannels.fm/do-the-woo-is-sponsoring-wordcamp-europe-2025/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:108:\"We\'re exciting to sponsor WordCamp Europe 2025 again. Come by our booth and join the community conversatoin.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Fri, 23 May 2025 10:02:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:41;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:103:\"Felix Arntz: Speculative Loading, or A Brief History of Landing a Performance Feature in WordPress Core\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:30:\"https://felix-arntz.me/?p=2094\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:94:\"https://felix-arntz.me/blog/speculative-loading-history-performance-feature-in-wordpress-core/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:23926:\"<p>Two years ago today, on May 22, 2023, I opened an <a href=\"https://github.com/WordPress/performance/pull/733\">experimental pull request</a> for a new module in the <a href=\"https://wordpress.org/plugins/performance-lab/\">Performance Lab plugin</a>. That little experiment was the very first step on a long road that ultimately led to the &#8220;Speculative Loading&#8221; feature landing in WordPress 6.8 last month (April 2025).</p>\n\n\n\n<p>For those unfamiliar, the Speculative Loading feature enhances performance by speculatively loading pages a user is likely to visit next, which can make navigation feel almost instantaneous. If you want to dive into the technical nitty-gritty, I recommend checking out the <a href=\"https://make.wordpress.org/core/2025/03/06/speculative-loading-in-6-8/\" rel=\"noreferrer noopener\" target=\"_blank\">&#8220;dev note&#8221; post on Make WordPress Core</a>.</p>\n\n\n\n<p>This post, however, isn&#8217;t about the <em>what</em> or <em>how</em> of the feature itself. Instead, I want to pull back the curtain and share the story <em>behind</em> the feature—the milestones, the discussions, and the collaborative effort that took it from a spark of an idea to a reality for millions of WordPress sites. The impact is considerable even for the entire web. Keep reading to the end for concrete numbers. 👇</p>\n\n\n\n<span id=\"more-2094\"></span>\n\n\n\n<h2 class=\"wp-block-heading\">The Spark: An Intriguing Browser API</h2>\n\n\n\n<p>It all began on April 20, 2023, when an internal Google email thread about preloading techniques landed in our team&#8217;s inbox. Part of that thread was a <a href=\"https://docs.google.com/presentation/d/1GK92nCORW5vKd7LgGtTsgy35eqTV7P71l05pHsni8ok/edit?authuser=1\" rel=\"noreferrer noopener\" target=\"_blank\">slide deck</a> for an upcoming <a href=\"https://www.w3.org/2023/09/TPAC/\">TPAC 2023</a> presentation by <a href=\"https://domenic.me/\">Domenic Denicola</a> and <a href=\"https://www.jeremyroman.com/\">Jeremy Roman</a>, who were deeply involved in a new browser-level API called Speculation Rules API.</p>\n\n\n\n<p>Learning about this API, I was immediately excited. The potential performance benefits for the web, including for WordPress, seemed enormous. What particularly caught my eye were &#8220;document-level rules&#8221;, which went beyond loading specific URLs to opting in to loading entire URL patterns (as detailed later in <a href=\"https://developer.chrome.com/blog/speculation-rules-improvements\" rel=\"noreferrer noopener\" target=\"_blank\">this Chrome developers blog post</a>). At that time, this aspect of the API was truly cutting-edge. It required Chrome 113 (which was just about to be released on April 26, 2023) and, crucially, opting into a <a href=\"https://developer.chrome.com/docs/web-platform/origin-trials\">Chrome origin trial</a> because it was such an early feature. Naturally, I signed up straight away.</p>\n\n\n\n<h2 class=\"wp-block-heading\">First Steps: Pull Request for an Experimental Module</h2>\n\n\n\n<p>A few weeks of mulling it over passed, and then on May 19, 2023, I finally decided to dive in and explore how this API could work within WordPress. This led to the creation of that first <a href=\"https://github.com/WordPress/performance/pull/733\" rel=\"noreferrer noopener\" target=\"_blank\">experimental pull request</a> three days later, on May 22nd.</p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img alt=\"Screenshot of the initial GitHub pull request, showing the original description for when it had just been started as an experiment: &quot;The Speculation Rules API is in its early proposal stages and only available in Chrome 108 or newer. The full set of features however, which are needed for this module to work, are only available via origin trial in Chrome 113 or newer. [...]&quot;\" class=\"wp-image-2104\" height=\"593\" src=\"https://felix-arntz.me/wp-content/uploads/2025/05/original-speculation-rules-pull-request-1024x593.webp\" width=\"1024\" /><figcaption class=\"wp-element-caption\">Screenshot of the initial GitHub pull request, showing the original description for when it had just been started as an experiment</figcaption></figure>\n\n\n\n<p>I shared this initial exploration both with my colleagues at Google who were working on the browser API itself and with the broader WordPress Performance Team. The idea was met with a good deal of curiosity and excitement, though everyone acknowledged its experimental nature. The browser API was still very young, and its reliance on an origin trial meant it wasn&#8217;t something we could roll out widely.</p>\n\n\n\n<p>The feedback on the pull request was super helpful, coming from both the Google side and WordPress contributors. We got the pull request into a pretty decent shape so that it could in principle be added to Performance Lab, but it remained an exploration. The WordPress Performance Team had many other priorities, and as long as the core browser functionality was locked behind an origin trial, it didn&#8217;t make sense to push too hard on a plugin that very few could actually use.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Gaining Momentum: Browser API Maturation</h2>\n\n\n\n<p>Time marched on, and then in early November 2023, we received some exciting news: the document-level rules for the Speculation Rules API were slated to become publicly available, no origin trial needed, with the release of Chrome 121 on January 17, 2024.</p>\n\n\n\n<p>This was a significant development. Around the same time, Chrome had also <a href=\"https://developer.chrome.com/docs/devtools/application/debugging-speculation-rules\" rel=\"noreferrer noopener\" target=\"_blank\">introduced DevTools features</a> to help debug speculation rules, and more comprehensive documentation was starting to appear, including on <a href=\"https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API\" rel=\"noreferrer noopener\" target=\"_blank\">MDN</a>.</p>\n\n\n\n<p>This news was the catalyst to get serious about the dormant pull request. I revisited it, updated it to align with the latest WordPress Core changes that had happened in the meantime, and began polishing it towards a Minimum Viable Product (MVP).</p>\n\n\n\n<p>On November 20, 2023, I created a new feature branch for the prospective &#8220;Speculation Rules&#8221; module within the Performance Lab plugin. We opted for a feature branch because:</p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>We needed to ensure that even if the initial PR was merged, the module wouldn&#8217;t be released until the browser API was widely available without the origin trial.</li>\n\n\n\n<li>We anticipated a few follow-up pull requests to build out the full MVP.</li>\n</ol>\n\n\n\n<p>Following further discussions with fellow WordPress Performance Team contributors, I formalized the idea by opening a <a href=\"https://github.com/WordPress/performance/issues/897\" rel=\"noreferrer noopener\" target=\"_blank\">module proposal issue</a> on December 5, 2023. This provided a comprehensive overview of the feature and its intended scope.</p>\n\n\n\n<h2 class=\"wp-block-heading\">First Release of the Plugin</h2>\n\n\n\n<p>Things started moving quickly then. That <a href=\"https://github.com/WordPress/performance/pull/733\" rel=\"noreferrer noopener\" target=\"_blank\">initial pull request</a>, which had evolved from an experiment to a serious feature implementation, was finally merged on December 15, 2023! I immediately opened a <a href=\"https://github.com/WordPress/performance/issues/908\" rel=\"noreferrer noopener\" target=\"_blank\">follow-up issue</a> to track the remaining tasks before our first public release.</p>\n\n\n\n<p>A few relatively straightforward follow-up pull requests (<a href=\"https://github.com/WordPress/performance/pull/938\" rel=\"noreferrer noopener\" target=\"_blank\">#938</a>, <a href=\"https://github.com/WordPress/performance/pull/939\" rel=\"noreferrer noopener\" target=\"_blank\">#939</a>, <a href=\"https://github.com/WordPress/performance/pull/940\" rel=\"noreferrer noopener\" target=\"_blank\">#940</a>) were implemented and merged by mid-January 2024. Concurrently, the WordPress Performance Team was finalizing its annual roadmap, and &#8220;speculative prefetching and prerendering&#8221; (as we often called it then) earned its place as a priority project. You can see it listed on the <a href=\"https://make.wordpress.org/performance/roadmap-2024/#:~:text=Adding%20support%20for%20speculative%20prerendering%20and%20prefetching%20for%20near%2Dinstance%20page%20loads\" rel=\"noreferrer noopener\" target=\"_blank\">2024 roadmap here</a>.</p>\n\n\n\n<p>Meanwhile, a significant holistic discussion had unfolded regarding the structure of the Performance Lab plugin. The decision was made to decouple its modules into individual, standalone plugins. Performance Lab would continue as an optional central orchestrator, but users could also install specific performance features independently. This required a migration effort of the existing modules into plugin shape. I opened a <a href=\"https://github.com/WordPress/performance/pull/946\" rel=\"noreferrer noopener\" target=\"_blank\">pull request (#946)</a> on January 17, 2024, to transition the Speculation Rules module into its own plugin. On that very same day, we submitted this nearly complete plugin to the WordPress plugin directory.</p>\n\n\n\n<p>The review process by the WordPress plugin team was incredibly swift, and the plugin was approved a day later (a huge thank you to them!). While the migration <a href=\"https://github.com/WordPress/performance/pull/946\">pull request (#946)</a> hadn&#8217;t technically been merged yet, all the core code was complete and approved. Therefore we decided to push the release so users could start testing almost immediately after Chrome 121 had just made the browser API widely available. Another day later, on January 19, 2024, the <a href=\"https://wordpress.org/plugins/speculation-rules/#developers\" rel=\"noreferrer noopener\" target=\"_blank\">1.0.0 version of the Speculation Rules plugin launched on WordPress.org</a>. This was a major milestone. Despite that, we kept promotion low-key initially, as a few more enhancements were planned.</p>\n\n\n\n<p>On a personal note, just a few days later, on January 24, 2024, I experienced an even more significant milestone: I became a dad! 👶 As such, I went AFK for a while, enjoying this precious time with my new family. Thankfully, the Speculation Rules plugin was in the capable hands of my teammates at Google and the other WordPress Performance Team contributors – a special shoutout to <a href=\"https://weston.ruter.net/\">Weston Ruter</a>, who has been instrumental in polishing and helping shepherd the feature all the way until stable.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Introducing &#8220;Speculative Loading&#8221;: Promotion and Gaining Traction</h2>\n\n\n\n<p>On February 16, 2024, version 1.0.1 of the Speculation Rules plugin was released with some bug fixes. Perhaps more importantly, this coincided with the Performance Lab 2.9.0 release, which officially added our plugin to its list of associated plugins. This significantly broadened its promotion due to Performance Lab&#8217;s widespread adoption.</p>\n\n\n\n<p>When I returned from my initial parental leave about ten days later, the Speculation Rules plugin was already active on over 500 WordPress sites! Not a massive number in the grand scheme of WordPress, but impressive for a plugin barely a month old.</p>\n\n\n\n<p>Over the following months, we continued to polish the plugin, shipping further enhancements and bug fixes, and promoting it more widely. During this period, the WordPress Performance Team undertook a project to revise plugin names, aiming for clarity by focusing on user-facing benefits rather than underlying technologies. As part of this initiative, the &#8220;Speculation Rules&#8221; plugin was renamed to the &#8220;Speculative Loading&#8221; plugin (see the <a href=\"https://github.com/WordPress/performance/pull/1101\" rel=\"noreferrer noopener\" target=\"_blank\">renaming pull request #1101</a>).</p>\n\n\n\n<p>Following these enhancements, the new name, the maturation of the browser API, and encouraging feedback from other browser vendors (see Mozilla&#8217;s <a href=\"https://github.com/mozilla/standards-positions/issues/620\" rel=\"noreferrer noopener\" target=\"_blank\">standards position</a> and WebKit&#8217;s <a href=\"https://github.com/WebKit/standards-positions/issues/54\" rel=\"noreferrer noopener\" target=\"_blank\">standards position</a>), I collaborated with other contributors to publish a <a href=\"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/\" rel=\"noreferrer noopener\" target=\"_blank\">Make WordPress Core blog post</a> on April 9, 2024. This shared the project more broadly with the WordPress developer community.</p>\n\n\n\n<p>An important decision made early in the plugin’s development was to default to prerendering with &#8220;moderate&#8221; eagerness. This is a more &#8220;aggressive&#8221; setting (offering better performance but potentially more resource-intensive) than what we ultimately shipped in WordPress 6.8. It was a deliberate choice for the plugin, as it allowed us to gather feedback on a more impactful version of the feature from a performance perspective. For WordPress Core, however, we would later opt for a more conservative default (prefetching with &#8220;conservative&#8221; eagerness) to ensure resourcefulness at scale.</p>\n\n\n\n<h2 class=\"wp-block-heading\">The Road to Core: Gathering Evidence and Formal Proposal</h2>\n\n\n\n<p>Both the Speculative Loading plugin and the underlying Speculation Rules browser API continued to gain traction. Six months after that Make Core post:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The plugin had amassed over 40,000 active installations and maintained exclusively 5-star ratings on the WordPress plugin directory.</li>\n\n\n\n<li>Cloudflare <a href=\"https://blog.cloudflare.com/introducing-speed-brain/\" rel=\"noreferrer noopener\" target=\"_blank\">enabled speculative loading for their users</a>, reporting a &#8220;reduction in LCP of 45% on successful prefetches.&#8221;</li>\n\n\n\n<li>Further partnership experiments between Google and companies like Shopify continued to demonstrate the feature&#8217;s positive impact on load times and user experience.</li>\n\n\n\n<li>The Speculation Rules API itself was already being used on <a href=\"https://chromestatus.com/metrics/feature/timeline/popularity/3932\" rel=\"noreferrer noopener\" target=\"_blank\">over 8% of Chrome page loads</a>.</li>\n</ul>\n\n\n\n<p>With such positive signals, even at a considerable scale, it felt like the right time to formally propose the feature for inclusion in WordPress Core. On November 21, 2024, I opened a <a href=\"https://core.trac.wordpress.org/ticket/62503\" rel=\"noreferrer noopener\" target=\"_blank\">WordPress Trac ticket (#62503)</a> proposing the feature for WordPress 6.8. Alongside it, I submitted a <a href=\"https://github.com/WordPress/wordpress-develop/pull/7860\" rel=\"noreferrer noopener\" target=\"_blank\">WordPress Core pull request (#7860)</a> with the proposed code, which was largely a port of the existing plugin.</p>\n\n\n\n<p>As mentioned, while the plugin used &#8220;prerender&#8221; with &#8220;moderate&#8221; eagerness, we opted for a more conservative approach (literally!) for Core, using only &#8220;prefetch&#8221; with &#8220;conservative&#8221; eagerness. At the massive scale of WordPress (impacting over 40% of the web), this was a safer starting point. The implementation, however, was designed to potentially allow for adjustments in the future as the browser API evolves or as confidence in other configurations grows.</p>\n\n\n\n<h2 class=\"wp-block-heading\">The Final Push: Community Feedback and Commitment</h2>\n\n\n\n<p>For the next two months, the Trac ticket and pull request primarily saw feedback from contributors already involved in the development. While valuable, a feature of this significance ideally receives broader input from the wider WordPress Core community, including experienced long-term contributors and committers. In mid-January 2025, we began to more actively solicit this feedback, raising the ticket during the weekly WordPress Core &#8220;dev chat&#8221; and eventually bumping its priority on Trac.</p>\n\n\n\n<p>Aside: It&#8217;s not uncommon for Trac tickets to only receive broader feedback later in the process. This isn&#8217;t ideal, but it&#8217;s often a reality given the limited resources and the sheer volume of ongoing development efforts. Reviewing a notable feature thoroughly takes time, which is a scarce commodity for many contributors. If you want to help, consider <a href=\"https://wordpress.org/five-for-the-future/\">sponsoring WordPress development</a>.</p>\n\n\n\n<p>By early February, we started seeing more engagement from other long-term contributors. This sparked some excellent discussions on the Trac ticket, the pull request, and synchronously on Slack. Some conversations worth highlighting include <a href=\"https://wordpress.slack.com/archives/C02RQBWTW/p1738344132077399\" rel=\"noreferrer noopener\" target=\"_blank\">this Slack discussion</a>, <a href=\"https://core.trac.wordpress.org/ticket/62503#comment:15\" rel=\"noreferrer noopener\" target=\"_blank\">this Trac ticket discussion</a>, and <a href=\"https://github.com/WordPress/wordpress-develop/pull/7860#issuecomment-2641175007\" rel=\"noreferrer noopener\" target=\"_blank\">this GitHub pull request discussion</a>.</p>\n\n\n\n<p>Both general considerations and specific technical details were debated, and much of the final fine-tuning of the implementation occurred during this &#8220;final sprint&#8221;, which took about three weeks. Eventually, the pull request garnered several approvals, and a consensus emerged that the feature was ready for WordPress Core.</p>\n\n\n\n<p>And so, on February 18, 2025, I <a href=\"https://core.trac.wordpress.org/changeset/59837\" rel=\"noreferrer noopener\" target=\"_blank\">committed the feature to WordPress Core</a>! This was a good two weeks before the WordPress 6.8 Beta 1 release was due – a critical deadline, as new features and enhancements must be committed before the first Beta of a release cycle.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Post-Commit and Launch</h2>\n\n\n\n<p>A small follow-up fix was committed a few days later, but overall, the period following the commit was quiet – exactly what you hope for! It indicated no significant issues with the feature, especially during the Beta and Release Candidate (RC) periods.</p>\n\n\n\n<p>While monitoring post-commit feedback, I began working on the &#8220;dev note&#8221; – the official Make WordPress Core blog post that describes a new Core feature for developers, explaining how it works and how it can be customized. Writing such a post is a crucial step to inform the WordPress developer ecosystem about upcoming changes, for example allowing plugin developers to prepare their plugins. Several other WordPress Core Performance Team members collaborated on it, and the <a href=\"https://make.wordpress.org/core/2025/03/06/speculative-loading-in-6-8/\" rel=\"noreferrer noopener\" target=\"_blank\">post was published on March 6, 2025</a>. This is likely the post many of you read if you were already familiar with Speculative Loading in WordPress 6.8.</p>\n\n\n\n<p>And that was it! Nearly two years after the work had started, the Speculative Loading feature officially launched as part of WordPress 6.8 on April 15, 2025.</p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img alt=\"Speculative loading feature as highlighted on the About page of WordPress 6.8: &quot;Near-instant page loads, thanks to Speculative Loading&quot;\" class=\"wp-image-2105\" height=\"489\" src=\"https://felix-arntz.me/wp-content/uploads/2025/05/speculative-loading-feature-wordpress-6-8-1024x489.webp\" width=\"1024\" /><figcaption class=\"wp-element-caption\">Speculative loading feature as highlighted on the About page of WordPress 6.8</figcaption></figure>\n\n\n\n<h2 class=\"wp-block-heading\">Post-Launch: Impact Metrics time!</h2>\n\n\n\n<p>Now that the feature is out there, the final step is to assess its real-world impact. It is great to see the adoption impact already:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>From March 2025 to May 2025, usage of the Speculation Rules API for all navigations (individual page loads) across the web grew from 8.47% to 10.81%, a relative increase of <strong>27.63%</strong>!</li>\n\n\n\n<li>From March 2025 to May 2025, usage of the Speculation Rules API for all origins (entire websites) across the web grew from 0.39% to 18.09%, a relative increase of <strong>4538.46%</strong>! 🤯</li>\n</ul>\n\n\n\n<p><em>Data based on public Chrome datasets. <a href=\"https://colab.research.google.com/drive/1krQWvjK2Zyl01vqcxTM9J1fOQN29gElq\">Please refer to this Colab for the full data.</a></em></p>\n\n\n\n<p>The data strongly suggests that the majority of the feature usage growth across the overall web comes from the WordPress 6.8 launch, because of WordPress&#8217;s large scale and the fact that in the preceding months the feature usage growth was more or less flat. So that&#8217;s an amazing win and goes to show once again the impact that WordPress has on the entire web!</p>\n\n\n\n<p>That said, usage is only a secondary metric. For a performance feature like speculative loading, we ideally want to get an idea on the <em>performance</em> impact of the feature, in particular on LCP. For this, we will need to wait for May data for the <a href=\"https://developer.chrome.com/docs/crux\">Chrome User Experience Report (CrUX)</a>, which is slated to become available in mind-June. I am looking forward to taking a closer look.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Looking Back</h2>\n\n\n\n<p>While the technical behavior of speculative loading is becoming more and more well-documented, with this article I wanted to share the story behind how it all came to be. If you have any questions, please feel free to ask them in the comments!</p>\n\n\n\n<p>If you are interested in the speculative loading feature&#8217;s technical aspects, I recently recorded a <a href=\"https://wptavern.com/podcast\">WP Tavern podcast</a> episode with a technical deep dive, which should air very soon.</p>\n\n\n\n<p>The journey of a WordPress Core feature can be a long and winding road. While the focused development time for the Core commit might appear to be just a couple of months, it&#8217;s often preceded by a much longer period of exploration, experimentation, plugin development, and community feedback.</p>\n\n\n\n<p>To recap the key milestones for Speculative Loading:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>April 2023:</strong> Initial &#8220;discovery&#8221; of the Speculation Rules API.</li>\n\n\n\n<li><strong>May 2023:</strong> First experimental Performance Lab module PR.</li>\n\n\n\n<li><strong>November 2023:</strong> News of broader browser API availability; serious development resumes.</li>\n\n\n\n<li><strong>January 2024:</strong> Standalone &#8220;Speculation Rules&#8221; plugin launched on WordPress.org.</li>\n\n\n\n<li><strong>Spring-Summer 2024:</strong> Plugin renaming to &#8220;Speculative Loading,&#8221; and broader promotion, community outreach, and usage growth.</li>\n\n\n\n<li><strong>November 2024:</strong> Formal proposal for WordPress Core inclusion.</li>\n\n\n\n<li><strong>February 2025:</strong> Feature committed to WordPress Core for version 6.8.</li>\n\n\n\n<li><strong>April 2025:</strong> WordPress 6.8 released with Speculative Loading.</li>\n</ul>\n\n\n\n<p>Today, exactly two years after that first tentative pull request, it’s incredibly rewarding to look back at this journey and celebrate the successful launch of a feature that I believe will make a real difference to WordPress performance.</p>\n<p>The post <a href=\"https://felix-arntz.me/blog/speculative-loading-history-performance-feature-in-wordpress-core/\">Speculative Loading, or A Brief History of Landing a Performance Feature in WordPress Core</a> appeared first on <a href=\"https://felix-arntz.me\">felix-arntz.me</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Thu, 22 May 2025 13:10:27 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:5:\"Felix\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:42;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:83:\"Do The Woo Community: WordCamp Europe 2025 Organizers Share Insights and Excitement\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:32:\"https://openchannels.fm/?p=97345\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:86:\"https://openchannels.fm/wordcamp-europe-2025-organizers-share-insights-and-excitement/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:231:\"This special episode of WordPress Event Talk is all about WordCamp Europe 2025 in Basel, Switzerland, highlighting organizers\' insights on inclusivity, accessibility, childcare, workshops, and volunteer opportunities for attendees.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Thu, 22 May 2025 08:44:05 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:43;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:87:\"WPTavern: #170 – Chris Reynolds on WordPress and Drupal: Differences and Similarities\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:48:\"https://wptavern.com/?post_type=podcast&p=195929\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:100:\"https://wptavern.com/podcast/170-chris-reynolds-on-wordpress-and-drupal-differences-and-similarities\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:58645:\"<details>Transcript<div>\n<p>[00:00:19] Nathan Wrigley: Welcome to the Jukebox Podcast from WP Tavern. My name is Nathan Wrigley.</p>\n\n\n\n<p>Jukebox is a podcast which is dedicated to all things WordPress. The people, the events, the plugins, the blocks, the themes, and in this case, what WordPress and Drupal have in common.</p>\n\n\n\n<p>If you&#8217;d like to subscribe to the podcast, you can do that by searching for WP Tavern in your podcast player of choice, or by going to wptavern.com/feed/podcast, and you can copy that URL into most podcast players.</p>\n\n\n\n<p>If you have a topic that you&#8217;d like us to feature on the podcast, I&#8217;m keen to hear from you and hopefully get you or your idea featured on the show. Head to wp tavern.com/contact/jukebox, and use the form there.</p>\n\n\n\n<p>So on the podcast today we have Chris Reynolds. Chris is a developer advocate at Pantheon, where he brings nearly 20 years of experience in the WordPress community, as well as deep involvement with Drupal and open source technology at large. Prior to his advocacy role, he worked at some of the top WordPress agencies like Human Made and Web Dev Studios. He&#8217;s been active at events like DrupalCon, PressConf, and Word Camps.</p>\n\n\n\n<p>In this episode we set aside the usual WordPress only focus, and turn our attention to two CMSs, WordPress and Drupal. What makes them tick, where they excel and where they might have something to learn from each other.</p>\n\n\n\n<p>Chris draws on his unique perspective working closely with both platforms as Pantheon is one of the few hosts with a 50 50 split between WordPress and Drupal sites, and has a significant footprint in both ecosystems.</p>\n\n\n\n<p>We discuss the similarities and differences between the two open source CMS communities, from the mechanics of flagship events like WordCamps and DrupalCon, to the ways these projects organize their contributors and support community initiatives.</p>\n\n\n\n<p>Chris explains how Drupal&#8217;s model with its association run funding, and project governance, compares to WordPress&#8217;s approach, including how each community approaches plugin and module development, and what role agencies and companies play in contributing to Core and the broader ecosystem.</p>\n\n\n\n<p>If you&#8217;re curious about how open source projects organize themselves, how their communities navigate growth and challenge, and what WordPress can learn from Drupal, and vice versa, this episode is for you.</p>\n\n\n\n<p>If you&#8217;re interested in finding out more, you can find all of the links in the show notes by heading to wp tavern.com/podcast, where you&#8217;ll find all the other episodes as well.</p>\n\n\n\n<p>And so without further delay, I bring you Chris Reynolds.</p>\n\n\n\n<p>I am joined on the podcast today by Chris Reynolds. Hello Chris.</p>\n\n\n\n<p>[00:03:20] Chris Reynolds: Hi. How&#8217;s it going?</p>\n\n\n\n<p>[00:03:22] Nathan Wrigley: You cannot see, dear listener, what I can see. Chris has the most amazing setup where he&#8217;s doing the recording. I guess it&#8217;s an attic or something like that, but it looks like the Starship Enterprise from where I&#8217;m sitting.</p>\n\n\n\n<p>[00:03:34] Chris Reynolds: I&#8217;m working on that.</p>\n\n\n\n<p>[00:03:34] Nathan Wrigley: Yeah, it&#8217;s really nice. Chris is joining us today and we&#8217;re going to have a conversation about the WordPress community. The things that we do well, and perhaps the things that we could improve. And we&#8217;re going to probably use Drupal as a comparison.</p>\n\n\n\n<p>Before we get into that, Chris, I know it&#8217;s a dreadfully banal question, but it&#8217;s always good to scope out where you are and where you stand with WordPress and Drupal and the companies that you work for. So just a moment really to give us your little potted bio of who you are and what have you.</p>\n\n\n\n<p>[00:04:04] Chris Reynolds: Sure. My name is Chris Reynolds, I am a developer advocate at Pantheon. I was formerly a senior software engineer for Pantheon for about three years, before joining the developer relations team around August, right before WordCamp US in September last year.</p>\n\n\n\n<p>I&#8217;ve been in the WordPress community for close to 20 years. I think I&#8217;ve gone back to my first blog posts and my first, like talking about technology that I was using. And I think that I&#8217;ve found references to using WordPress in some capacity back in 2005, so almost exactly 20 years.</p>\n\n\n\n<p>But even before that I was really interested, like as a side hobby in just open source software, playing with Linux and playing with other open source community projects that I found I was really a big fan of one called Ampache for a long time, which was a music sort of library app thing written in PHP. That was really cool. I think it still exists even.</p>\n\n\n\n<p>But yeah, so I&#8217;m a developer advocate at Pantheon. That means I do a lot of these sorts of things, talk about best practices, write a lot of blog posts, get in a lot of trouble, not really, and go to events and stuff like that. So I was at DrupalCon in March. I was at PressConf last month. Probably doing stuff this summer and in the fall.</p>\n\n\n\n<p>[00:05:14] Nathan Wrigley: Just to lean in a little bit on the Pantheon side of things. Pantheon, a hosting company, but very much aligned in two worlds, maybe more than two. But from my perspective, I used to use Drupal exclusively until about 2015. That was my CMS of choice for many, many years. I think Drupal 4, and then finally I jumped ship at Drupal 8 over to WordPress and have been that consistently.</p>\n\n\n\n<p>But Pantheon was around as what felt like at that time, so we are going back more than a decade, the only sort of managed Drupal host, but it definitely had a WordPress side to it as well. Can you just speak to that for us for a moment? That is Pantheon&#8217;s sort of MVP, isn&#8217;t it? It handles managed hosting for both of those platforms. And maybe there&#8217;s more, I don&#8217;t know.</p>\n\n\n\n<p>[00:05:57] Chris Reynolds: Yeah. I mean, I think that from a platform perspective, we obviously do host Drupal and WordPress. We also can host like Next.js and sort of front end sites. But the sort of hidden Pantheon magic is in the kind of DevOps, WebOps we like to call it, layer that happens like somewhere between pushing code and the code being a thing that like site managers and editors and things like work with, right? So automation tools, and we were one of the first providers that used Git by default. Now that&#8217;s not such a big deal anymore, but like that was a big thing within Pantheon for a really long time.</p>\n\n\n\n<p>When I was a developer, the first time that I used Pantheon as a developer when I was back at WebDevStudios was, the thing that was the killer feature for me was we have a thing called Multi Dev, which is, each site has a development, a test, and a live environment. So everybody gets those three things and we have a very specific sort of workflow. Code goes to dev, to test, to live in that order. But we have these Multi Devs, which are entirely separate containers where you can build, you can do all your feature development on a branch in a Multi Dev and see what that looks like before merging it into dev.</p>\n\n\n\n<p>It sounds like maybe not that much now, but I know when I was back in agency life and even when I was working at Human Made and we had built our own sort of stack that had this very similar kind of system, we didn&#8217;t have Multi Dev because spinning up new containers for sites that you&#8217;re just going to destroy at some point in the next couple weeks or days anyway is expensive and hard.</p>\n\n\n\n<p>And so what that meant was the master branch, or the development branch, of all of your code is always really messy and dirty, and you want to keep that away from the code that is going to production, right? Because that&#8217;s where your experimental code is. Maybe you didn&#8217;t back it out entirely. That&#8217;s where like a whole bunch of weird database stuff is going. That&#8217;s like the junk, right? So you want to keep that separate from like your staging branch and your production branch.</p>\n\n\n\n<p>And with Pantheon, the idea is your development branch is just where your finalised code goes, because you can do all that testing in a separate environment and then when you go from dev to test, it&#8217;s not a headache, it&#8217;s just this is production ready code, basically.</p>\n\n\n\n<p>[00:08:10] Nathan Wrigley: Yeah, I remember my recollection of Pantheon was that it was one of those platforms that, well, platform really, it felt more like a platform than a host, if you know what I mean? It just offered more as a layer on top of the typical host that you might find.</p>\n\n\n\n<p>However, you also do a whole bunch of stuff around the Drupal space, but also the WordPress space. I&#8217;m just curious, maybe you don&#8217;t have this information, but maybe as a developer advocate, you do. What would you say, as a percentage, does Drupal represent as opposed to WordPress? You know, is it like an 80, 20 split, a 90, 10, a 50, 50?</p>\n\n\n\n<p>[00:08:40] Chris Reynolds: We&#8217;re almost exactly 50, 50.</p>\n\n\n\n<p>[00:08:42] Nathan Wrigley: Interesting.</p>\n\n\n\n<p>[00:08:43] Chris Reynolds: And we&#8217;ve actually honestly been 50, 50 for about five-ish years, five or six years.</p>\n\n\n\n<p>[00:08:48] Nathan Wrigley: So does that mean that in the Drupal side of things, okay, dear listener, WordPress as a CMS is a giant, it&#8217;s a leviathan of a thing, you know. Occupies a massive amount of the market share. Drupal I think is somewhere in the region of, I think it&#8217;s like 1.2% or something like that.</p>\n\n\n\n<p>[00:09:05] Chris Reynolds: Yeah, we might be creeping up to two-ish, but yeah, it&#8217;s pretty low, yeah.</p>\n\n\n\n<p>[00:09:09] Nathan Wrigley: That then implies that you as a company have, you&#8217;ve got your foot on the pedal more on the Drupal side of things. Maybe the people who are building clever things on top of Drupal are using you much more. You&#8217;re a bigger player in that space than you are inside the WordPress space, even though it&#8217;s, you know, the same in terms of revenue. As a community endeavor, Drupal probably means a lot more to you than WordPress maybe.</p>\n\n\n\n<p>[00:09:32] Chris Reynolds: Yeah, I mean definitely going to DrupalCon for my first time this last March, it&#8217;s definitely, so there&#8217;s Acquia, which is essentially Drupal&#8217;s version of Automattic. Acquia is a company that was founded by Dries, who is the founder of Drupal, and very much like managed Drupal hosting the same kind of thing that Automattic is into, and a lot of the sort of same ideas, at least from a, where it sits in the ecosystem.</p>\n\n\n\n<p>But, you know, you go to a WordCamp and you see the big Automattic booth and you&#8217;ll see a couple other sort of bigger hosting booths. At a DrupalCon it&#8217;s like, there&#8217;s the Pantheon booth and there&#8217;s the Acquia booth, and then there&#8217;s a bunch of little things. We&#8217;re definitely the kind of headliners because between the two of us, I think probably we do own most of those Drupal sites that exist in the ecosystem. But we&#8217;re definitely a bigger fish in that pond, than perhaps the WordPress pond. There&#8217;s also a lot more fish in the WordPress pond.</p>\n\n\n\n<p>It&#8217;s an interesting thing, like for me coming to DrupalCon for the first time, to see just what Pantheon&#8217;s footprint is in contrast to when I go to WordCamps. And, you know, we were big in WordCamps for a long time, and then we kind of pulled back a little bit, and then the intervening time it&#8217;s I think felt by the community like, well, who are you? Where did you go? We&#8217;ve gotten sort of feedback from folks being like, I used to think about Pantheon, but like it&#8217;s been a long time, you laid a lot of people off. Why should I care anymore?</p>\n\n\n\n<p>And that&#8217;s, you know, part of my personal goal is to say, no, this is why you should care. That&#8217;s one of the things that excited me of joining the DevRel team was to go back to our roots and go back into the community, and we still have a really good product that I believed in when I was a developer and I still think is really good as, you know, obviously I think of it as a developer advocate. But like I&#8217;m here because I like the thing. I think we have a good thing.</p>\n\n\n\n<p>[00:11:19] Nathan Wrigley: Do you basically have the exact same platform for both of the CMSs? So I know there&#8217;s all the other stuff that you do, but let&#8217;s just concentrate on Drupal and concentrate on WordPress, those two things. Do you basically have the exact same platform? Or is there some nuance that you can do this on WordPress because of, I don&#8217;t know, WP-CLI or the REST API or whatever it is that you can&#8217;t do in the Drupal side? In other words, if I sign up for a Drupal account, do things look different, behave differently, or is it broadly the same?</p>\n\n\n\n<p>[00:11:45] Chris Reynolds: It is broadly the same. There is sort of individual differences but they&#8217;re very minor. And honestly like, in many ways, I think that when Pantheon, and this is before my time, obviously, but I think when Pantheon jumped into the WordPress boat, it was really more of a, well, we have this stack and we&#8217;re really good at this thing, and WordPress is also a PHP application that has a lot of the same requirements, surely we can just run the exact same stack for WordPress.</p>\n\n\n\n<p>And what&#8217;s sort of evolved over time is like, well, that&#8217;s like 80% true, but it&#8217;s the 20% that&#8217;s really important. And if you just go into building WordPress sites or hosting WordPress sites with the same mentality as you&#8217;re doing Drupal, well, you are going to run into a lot of the growing pains that we ran into, right? Drupal from like a database perspective is far more efficient. The queries are much shorter because the way that it&#8217;s structured is more efficient than WordPress. WordPress, you kind of have to do more sort of optimisation on top. So those are things that we needed to figure out.</p>\n\n\n\n<p>The Drupal space sort of moved toward Solr as their sort of search tool of choice, which is a project from the Apache project. WordPress went into Elasticsearch. So trying to convince a WordPress team to use Solr, in fact, a pretty old version of Solr, is kind of pulling teeth. Like, well, why would I do that when I&#8217;m doing Elasticsearch for everything else? I don&#8217;t know why you would do that, honestly. Like, you should probably use Elasticsearch.</p>\n\n\n\n<p>And so we&#8217;re like actually going in, that&#8217;s a project that&#8217;s on the roadmap as well finally, it&#8217;s something I&#8217;ve been talking about for like three years internally. There&#8217;s little nuances. Drupal obviously since version eight has been using Composer as a fundamental part of how the CMS just works. Whereas WordPress, you&#8217;ve got some people that are using Composer, in fact, last time I was here, two years ago, I was talking about Composer. And I don&#8217;t know that the adoption of Composer has really changed much in the WordPress ecosystem since that time.</p>\n\n\n\n<p>I would like to say that it has. I still think that you should be using Composer. Throwback to the last WP Tavern Jukebox podcast that I was on about Composer. But yeah, so there&#8217;s little differences and I think that that&#8217;s, there&#8217;s not anything from a platform level where your experience is going to be that much different.</p>\n\n\n\n<p>[00:14:00] Nathan Wrigley: Yeah. If you were to take a look at the Pantheon platform, I think quickly poking around on the site, maybe the pricing page or something would give you an intuition that really you are kind of more for the sort of enterprise level, I think would be fair to say. You know, you are trying to get the bleeding edge out of the websites that you&#8217;ve got, and so it&#8217;s, high traffic, that kind of thing.</p>\n\n\n\n<p>But the endeavor today really is to put all of that code stuff to one side and get into the community side of things. So just to reiterate, we threw around a couple of words there, and maybe the listener doesn&#8217;t really know that even there&#8217;s a WordPress community or a Drupal community.</p>\n\n\n\n<p>There really is. There&#8217;s just hundreds, maybe thousands of people who attend events, they might go to a local thing, which we might call them Meetup on the WordPress side of things. I don&#8217;t know if there&#8217;s similar things in Drupal. But then there&#8217;s these bigger events, which we&#8217;d call WordCamps, and then there are bigger ones of those which are kind of flagship WordCamps.</p>\n\n\n\n<p>There&#8217;s one in the US, there&#8217;s one in Asia, and there&#8217;s one in Europe. They happen each year. And thousands of people show up and inhabit the same space, listen to presentations, hang out in the hallway.</p>\n\n\n\n<p>And then you&#8217;ve got the same thing happening on the Drupal side. It&#8217;s called Drupal Con, but forgive my ignorance, I think the DrupalCon thing is a once a year thing and it moves around the globe. It&#8217;s not necessarily in the same space. Have I got that about right?</p>\n\n\n\n<p>[00:15:15] Chris Reynolds: It&#8217;s more than once a year. It&#8217;s actually the equivalent. So DrupalCon is the equivalent of flagship WordCamps. So there&#8217;s a DrupalCon, there was a DrupalCon US in Atlanta this last year. There is going to be a DrupalCon Europe in, where is it? Maybe Vienna, in the fall. There&#8217;s a DrupalCon Asia that&#8217;s just starting to get fired up. That&#8217;s happening I think in, the next one is like 2026, I believe. I think they just had their first one. So very similar, like the Cons in the Drupal space are equivalent to the flagship WordCamps. There&#8217;s also DrupalCamps in much the same way as there are local WordCamps.</p>\n\n\n\n<p>I feel like in the WordPress space, a lot of the local WordCamps kind of, they either blew up and got super big, or they kind of fizzled after Covid, right? I don&#8217;t have a lot of local camps. I don&#8217;t see a lot of local camps anymore. I do see those things happening a little bit in the Drupal space, or at least starting up again.</p>\n\n\n\n<p>[00:16:08] Nathan Wrigley: Yeah so, what we&#8217;re basically painting a picture of here is that we&#8217;ve got two bits of software which basically are trying to achieve the same thing. They&#8217;re a CMS. They&#8217;re trying to make it so that non-technical, as well as technical people, can run a project and put it online. Whether that&#8217;s a website or an e-commerce solution, whatever it may be, you&#8217;re trying to get your stuff out onto the internet. And both of those things will work.</p>\n\n\n\n<p>But also, behind the code is a bunch of people who are willing to go and hang out in the same place, the community, if you like, attend these events. And so there&#8217;s massive similarity. In fact, you know, if you&#8217;re an alien landing, I suspect that you wouldn&#8217;t really know that the two things were different. Okay, there&#8217;s different advertisers in the hall and there&#8217;s different logos and things, but broadly they would probably look really similar.</p>\n\n\n\n<p>However, in the more recent past, and if you don&#8217;t know the story, I&#8217;m not going to go into it too much here, but you can figure it out by looking at various news articles in the WordPress space and what have you. The WordPress community has really been pulled in different directions, let&#8217;s say that. And it&#8217;s curious because no sooner had this happened than some of the more prominent people, Dries Buytaert, who is the founder of Drupal, put out a piece, really as a way of kind of offering, look, this is what Drupal do. We know you&#8217;ve got on the WordPress side things that are not working out for you. Here&#8217;s our model.</p>\n\n\n\n<p>And far be it from me to say whether that is the perfect system. I don&#8217;t really know it, but I was just curious to get your thoughts on what that is. And that&#8217;s going to really occupy the majority of the rest of this podcast. What the Drupal community looks like. What you believe it does well. How it does things differently. So let&#8217;s start there. Let&#8217;s start with Dries&#8217;, what he was telling us about. How does Drupal, the community, how does it do things differently in terms of, I don&#8217;t know, events, the access to the code? So yeah, a conversation around that really. So I&#8217;m just going to throw it over to you, Chris. How is Drupal different than WordPress on that level?</p>\n\n\n\n<p>[00:18:05] Chris Reynolds: Well, I was saying before we got on that I kind of had a crash course in Drupal when I went leading up to, and then immediately following going to DrupalCon. Part of that crash course was at DrupalCon, they actually have a community summit. It&#8217;s similar to like, in WordPress we&#8217;ve had sort of community summits before. At DrupalCon it was really more of like a track, with like presenters and like also conversations. It&#8217;s like space for chatting and hanging out with people.</p>\n\n\n\n<p>But mostly, mostly it was like community related talks in a space, talking about what&#8217;s working, what&#8217;s not working, as well as a sort of a get to know you sort of thing. And that was really helpful. I also did homework before the event in watching a couple of Dries&#8217; last Dries Notes. So Matt has State of the Word, Dries has Dries Notes, which is just like keynote. It&#8217;s basically the same thing, like the same state of the CMS, right?</p>\n\n\n\n<p>I caught up on what was going on in Drupal before the Con. And one of the things that I learned about, and then I followed up and dug into the history a little bit, was we have the same problems, right? WordPress and Drupal have the same fundamental sort of issues from both a contribution standpoint as well as a just organisational, managerial management kind of standpoint.</p>\n\n\n\n<p>And Drupal, or Dries, just kind of got to a point sooner where he&#8217;s like, well, I can&#8217;t do all of these things. So the Drupal Association, and I&#8217;m sure there&#8217;s some Drupalistas that are going to correct me on my history, but as I understand it, the Drupal Association was initially formed to sort of manage events, because Dries knew that they needed to have events. They were having events, they started off just similar to WordPress, small camp things. And they started getting bigger and Dries is like, well, I can&#8217;t do all of the management stuff of this, so I need to like do something, create an organisation that can do that stuff.</p>\n\n\n\n<p>And that was where the Drupal Association first was founded, to sort of manage that thing. And then over time, that evolved into being able to fund, or kind of oversee, directions for where, more of like a community representative in the general sort of CMS development ecosystem, right?</p>\n\n\n\n<p>There is a board. They are elected by the community. They are paid. They manage events, but they also, all of the money that is made after expenses and stuff from DrupalCons and donations and whatever, they have the authority to direct into whatever projects they think would be most valuable for the evolution, or the fulfillment, of the ideals of the Drupal software, right?</p>\n\n\n\n<p>So Dries says, I want to do a thing, and he can go do that thing. The Drupal Association is like, well, I think that what we really need is this kind of thing, and we&#8217;re going to devote some of our resources that we have into hiring some folks to work on that thing.</p>\n\n\n\n<p>So, most recently, where you can kind of see this in action is there&#8217;s been a lot of hype about Drupal CMS. That is a thing that exists because of the Drupal Association, because the Drupal Association saw, okay, I mean, I assume, I&#8217;m reading between the lines. But I assume that you can&#8217;t ignore the sort of declining line of Drupal in the broader ecosystem of CMS usage. But also, there&#8217;s been a really big problem since Drupal seven of a lot of the sites on Drupal seven remain on Drupal seven.</p>\n\n\n\n<p>Drupal seven should be end of life by all accounts. Everything else up to the current version is end of life. Drupal seven isn&#8217;t, because there&#8217;s still, it&#8217;s now just under, but it&#8217;s still close to 50% of Drupal sites are running Drupal seven. It&#8217;s a version of Drupal that&#8217;s about 10 years old.</p>\n\n\n\n<p>And the reason why, there&#8217;s so many people. Drupal historically has always been a thing where, when a new version came along, you kind of killed your old site and rebuilt it in the new version, because it wasn&#8217;t sort of backwards compatible. WordPress has gotten around that by just remaining backwards compatible all throughout its history.</p>\n\n\n\n<p>Drupal seven to Drupal eight was the first version to introduce Composer. We talked about Composer and how a Composer&#8217;s been part of Drupal for a really long time. that was the cutoff. So that was a pretty big shift. And there&#8217;s a lot of people, teams, organizations that have not made, or have been reluctant to make that shift because it&#8217;s a, it&#8217;s a rebuild. It&#8217;s a full site rebuild.</p>\n\n\n\n<p>It&#8217;s not just, we can just migrate the thing over. You have to rebuild your site. You do need to migrate your stuff over, but also you need to rebuild your site. So in the intervening time, WordPress has gained adoption and acceptance and grown into 43%. And so now we&#8217;ve got these Drupal seven sites where it&#8217;s like, well, we need to rebuild anyway. Do we rebuild the site in Drupal 10, 11? Or do we rebuild the site in WordPress where I&#8217;m never going to have this problem ever again.</p>\n\n\n\n<p>And that&#8217;s where a lot of that like, bar graph, a lot of those sites have moved to WordPress. Some of them have stayed on Drupal, but it&#8217;s a declining number, right?</p>\n\n\n\n<p>So obviously, folks inside Drupal see this and know that it&#8217;s happening, and know that they need to do something about it. So Drupal CMS is basically like a layer on top of the latest version of Drupal, which is 11. It&#8217;s got a far nicer installation screen. I wrote a blog post about this on the Pantheon blog, I think. It&#8217;s got a far nicer installation screen, that actually walks you through, stepping through like what type of site, what type of content you want to have on your site. To actually get you thinking about the site that you&#8217;re building before you just hit install. Which I find to be amazingly refreshing.</p>\n\n\n\n<p>And then beyond that the admin interface is far less cluttered. I know one of my personal gripes about working with Drupal, even up until, up until now, like up until before Drupal CMS is that there&#8217;s too many buttons, there&#8217;s too many menus, there&#8217;s too much stuff. Like, I don&#8217;t know where stuff is.</p>\n\n\n\n<p>This feels a lot more familiar, partially because I think it kind of resembles the WordPress admin a little bit. You know, sidebar on the left, menus. And it feels just more, more familiar to me. And then also they have built in some new architectural things like, recipes are a thing where, a recipe, Drupal has modules, WordPress has plugins. Modules generally need a lot of configuration, to get them actually working.</p>\n\n\n\n<p>When you install a module, it&#8217;s not like it just works outta the box. A lot of WordPress plugins, you install a plugin, it just works outta the box. So a recipe is like, here is, maybe a collection of modules, maybe a specific module, but it&#8217;s probably a combination of a bunch of different modules, but also the configuration that goes along with them.</p>\n\n\n\n<p>So when you install a recipe, it&#8217;s like, here&#8217;s the stuff that you probably will need. You&#8217;re most likely to need this stuff in this order, configured with these settings, and then you can do whatever you need after that. But like, here&#8217;s the go bag and now you can move on. So, one of the really interesting recipes for Drupal CMS is the SEO recipe.</p>\n\n\n\n<p>And that is interesting because they&#8217;re using a Yoast module. The Yoast module is literally taking the JavaScript of Yoast SEO from the WordPress plugin and throwing it into Drupal. And what&#8217;s fascinating about that is it doesn&#8217;t have all of the other stuff that comes with the Yoast plugin, it&#8217;s just the traffic light system, and the scanning the text system and it&#8217;s, so it&#8217;s the best possible implementation of Yoast that I&#8217;ve seen because it&#8217;s all of the good stuff.</p>\n\n\n\n<p>They&#8217;ve also built an AI recipe. And that&#8217;s interesting because when that is configured, you can actually talk to an AI chat bot inside your Drupal instance and ask it questions about Drupal or about your site. You could say, hey, I need to create an event content type. I&#8217;m gonna be hosting events. They&#8217;re this type of thing. I need to have a, like a, date picker and whatever, and we are taking attendees and you can tell that the chat bot that that&#8217;s the thing that you need. And it will, to the best of its ability, build that content type inside Drupal for you.</p>\n\n\n\n<p>So the WordPress equivalent is, I have a podcast and I need an episode post type. I just talk to a chat bot, and it magically creates that episode post type for me with like the Gutenberg blocks I need. That makes it an audio format or whatever. And, it&#8217;s just there for you. It&#8217;s like, great, thank you chat bot. As a WordPress developer, I think that&#8217;s really cool. Because that&#8217;s kind of the thing that I want, is like I know how to do some things, but I really don&#8217;t know any of the buttons and gears and gizmos in the Drupal admin.</p>\n\n\n\n<p>But if I have a chat bot to sort of help guide me through, I know I can figure out the rest of the way, or I can see how it did the thing, and I can figure out, oh okay, so that&#8217;s what I need to do. And so all of these things are geared toward the idea of just getting more people using Drupal and lowering the barrier to entry.</p>\n\n\n\n<p>Because one of the big things with Drupal is it&#8217;s always been really developer centric, really highly technical, and you need sort of skilled individuals to even just manage the site. So if we lower that barrier to entry, you can target the people that are already using WordPress, the sort of content level people or the site administrators that don&#8217;t have a lot of technical experience.</p>\n\n\n\n<p>That&#8217;s all like basically because the Drupal Association put money, funding that they had into backing these very specific projects.</p>\n\n\n\n<p>[00:27:25] Nathan Wrigley: It is kind of a curious idea, isn&#8217;t it? It&#8217;s like a subset of the CMSs capabilities put into this one project, Drupal CMS. Which has like a target audience in mind. So it&#8217;s like a blogger, or a podcaster or something like that. You know, it&#8217;s for content creators. That was the message I got from when I read all of the, the marketing bits and pieces that came out.</p>\n\n\n\n<p>But also addressing the need for it to look nice. That was always an area I thought WordPress excelled at. When you logged into the WordPress admin, it was night and day looking at a Drupal admin. Everything was consistent. Everything looked modern and clean and easy to understand. On the Drupal side, it was, it was much more difficult to understand. But also things like updating plugins. Backwards compatibility on the WordPress side, always much more straightforward. On the Drupal side, much more difficult.</p>\n\n\n\n<p>And so this is such a curious experiment. Putting it into the hands of people who might want a blog, or whatever it may be, and hopefully making it more straightforward. And the website for it, I will link to it in the show notes, it&#8217;s just so kind of modern and appealing and friendly and, Drupal never, for me at least when I got to Drupal eight, for the exact reasons that you described, that&#8217;s all of my sites would have stayed on Drupal seven.</p>\n\n\n\n<p>It definitely wasn&#8217;t that kind of warm and fuzzy welcome to everybody kind of thing. But now it really look like it&#8217;s leaning into that. But getting back to your main point, that was funded from the inside by some, facets, some internal mechanisms, some body inside the Drupal Association that decided that&#8217;s what we need to do. This is where the money&#8217;s going. But are you saying that decision making was divorced from Dries?</p>\n\n\n\n<p>[00:29:02] Chris Reynolds: Dries leads the technical architecture. And Dries will like say we need to do a thing. And he may be personally involved in the leadership of doing that thing, but mostly he&#8217;s like at a director level. Like, go my people and go forth and do stuff. And the Drupal Association says, okay, well one of the things that Dries said we need to do is X. So how can we make X happen? And in the case of recipes, it meant getting agencies and people from agencies involved. Create like a coalition. Like there&#8217;s a bunch, it wasn&#8217;t just one agency. It was like a bunch of people from different agencies are working on this thing together. Which is another thing that I find really interesting about the Drupal ecosystem.</p>\n\n\n\n<p>I have thoughts about that too. But in this context, yeah, I get a bunch of different people to work on this thing. Um. Whether it&#8217;s the SEO recipe. Whether it&#8217;s the AI recipe, and they, I think the way that it sort of broke down is, and it might have been even Dries that conceptualized the idea of recipes and it&#8217;s like, okay, go out and implement this thing.</p>\n\n\n\n<p>But when they did, it was like, okay, if we&#8217;re gonna do this thing, we need these types of recipes from the get go, from day one. We need SEO, we need whatever. We need AI, we need content things, so that people have an idea of what a recipe is and can start building their own recipes.</p>\n\n\n\n<p>[00:30:15] Nathan Wrigley: So they&#8217;re bound into it? You can&#8217;t install Drupal CMS without those things. They&#8217;re just there.</p>\n\n\n\n<p>[00:30:20] Chris Reynolds: It supports the recipes, and in the installation process, when you&#8217;re doing the Drupal CMS installation, that screen that I was talking about, where it&#8217;s like asking you the type of site you want to build, those types of sites in quotations, correspond to sets of recipes that align with each of those things.</p>\n\n\n\n<p>It doesn&#8217;t ask you about AI in the installation screen, but it does sort of say like, oh, do you want this type of content or that type of content? And then we, based on your selection, it automatically installs those recipes for you.</p>\n\n\n\n<p>[00:30:48] Nathan Wrigley: So it&#8217;s installing things based upon a wizard at the beginning, but the principle being though that you the end user, not really interacting with anything apart from oh, I would like that. Yes, please. I would like that. And then you finally get to the end of the wizard, wait for a few moments. The modules get installed, activated, and they&#8217;re pre-configured to behave in a way which is likely to be the best that you can get.</p>\n\n\n\n<p>[00:31:08] Chris Reynolds: To get you as close to what you want as possible. And the goal, the roadmap, is Dries wants to actually take that one step further, and do sort of site templates where if a recipe is a collection of modules and configuration, a template would be like, I want to build a real estate site. So I download this template, or I install this template and then click a button or two and it gives me a real estate site with the configuration that I might need to have a real estate site.</p>\n\n\n\n<p>And obviously I can go in and customize things, but I have a starting point. One of the things that I heard a lot when I was talking to people within Drupal, among other things, there&#8217;s not really a marketplace as much for stuff, for software, for add-ons in the way that there is in WordPress. And there&#8217;s not really in particular, there&#8217;s not really the same sort of like theme or a repository, or a place to go for commonly used or shared themes in the way that we have the Themes Repository. Mostly you have like the default things and then you&#8217;re building your own.</p>\n\n\n\n<p>So, as a user, having a template that maybe comes with a theme that is specifically tuned for that type of site is a really big win, because there really isn&#8217;t an alternative in the current ecosystem within Drupal.</p>\n\n\n\n<p>[00:32:23] Nathan Wrigley: Yeah, that&#8217;s, really worth leaning into because again, please interrupt me if what I&#8217;m about to say doesn&#8217;t actually match reality anymore. But when I was using Drupal, there was basically no commercial plugin system. Everybody had kind of leaned into the same thing for the same problem.</p>\n\n\n\n<p>So if you wanted to put a form on your website, there were a few, but there was this one called Webform, and it was just the one everybody leaned into it. And so rather than in the WordPress space where you&#8217;ve got, you know, you&#8217;ve got a few repository ones that are free and easy to use, and then you&#8217;ve got the commercial ones that you can pay for and they add different features and support levels and all that kind of thing.</p>\n\n\n\n<p>In the Drupal space, it felt like there was just this one kind of community endeavor to do the thing. Yeah, so if you wanted something to display data, Views was the thing you used. The Views module, and I think that did actually get rolled into Core. So it&#8217;s there. My point being, there isn&#8217;t this sort of, shattering is the wrong word, but in the WordPress space, there&#8217;s often a dozen, more than a dozen, there&#8217;s multiple alternatives. So you have to go and find the right thing.</p>\n\n\n\n<p>In the Drupal space, it feels more like, okay, for that problem, we have this module, and everybody leans into it. So I&#8217;m presuming that all the people who contribute in the community to the code and what have you, they&#8217;ll all finesse that version. But that means therefore, that when you come to build the CMS, there&#8217;s basically this one way of doing it? Okay, if you want forms, we&#8217;re going to use that module. And if we&#8217;re going to add this feature for real estate or what have you, here&#8217;s the modules that we&#8217;re going to add in. And the jigsaw of those modules will make it work. And that&#8217;s different from WordPress. WordPress has much more leaned into commercial plugins and kind of figure out which ones you want for yourself.</p>\n\n\n\n<p>[00:34:04] Chris Reynolds: Yeah, that was one of the things that I didn&#8217;t know going into DrupalCon that I learned while I was there. It&#8217;s a really different approach, and I actually kind of appreciate the Drupal model because the community is built around more of an idea of, if I build a form plugin and you build a form plugin, and mine is the defacto form plugin or.</p>\n\n\n\n<p>In the Drupal space, it&#8217;s really more of a, well, let me talk to you and see what ideas you have that we can bring into the canonical one and just collectively like integrate those things. And that&#8217;s, that is a thing that happens more often than not in Drupal. That&#8217;s why you don&#8217;t see the competition, the competing modules for different things.</p>\n\n\n\n<p>Because if you had a competing thing, or you had a different idea, you would contribute it to the one module that does that thing. Or if you had a different thing, then you might be invited to do the same, right?</p>\n\n\n\n<p>In the WordPress space, it&#8217;s like I want to protect my form module or my form plugin because right now it&#8217;s free, but tomorrow I might want to sell it, and I want to keep my intellectual property to myself and not contribute because, you know, I might wanna make a buck on this later.</p>\n\n\n\n<p>And, I kind of like the other thing better because it&#8217;s more, it is more of a community. Like I get like wanting to make money and everybody wants to make money and have a form plug in. Like, that&#8217;s great. Like I&#8217;m not going to say Gravity Forms shouldn&#8217;t exist or anything like that. Gravity Forms is amazing. But I do think that building an ecosystem around contributing to a collective, or a community based solution for the thing, where everybody has a, a say or a seat at the table, is a really, I don&#8217;t know, possibly overly idealistic, but very optimistic sort of view of how we can contribute to software.</p>\n\n\n\n<p>I find it really nice. Like it feels good. Like it feels less like we&#8217;re all trying to grab our little piece of territory, you know?</p>\n\n\n\n<p>[00:35:53] Nathan Wrigley: It feels to me like that moment when you first install Linux. And you realize, wow, there&#8217;s a free OS that I can put on my computer. And there&#8217;s just something quite remarkable about that. That a bunch of people got together and, really pointed everything at this one solution. I suppose that is the choice that you&#8217;re going to make. Really, that there is something right in there.</p>\n\n\n\n<p>You know, the commercial side of WordPress has probably been its single biggest accelerator. The fact that people could build businesses on it. And they could have a living. They could obviously refine and finess and dedicate real time entire lifetimes, in many cases. Get staff on, support staff and what have you. Pay all of those people because they&#8217;ve cracked this nut and everybody wants a piece of it.</p>\n\n\n\n<p>Whereas on the Drupal side, it&#8217;s much more, let&#8217;s go for egalitarian, let&#8217;s say that. But it, also, I suppose, means that at the moment where something doesn&#8217;t work you probably have to either understand how to maintain that yourself or hire a developer.</p>\n\n\n\n<p>So there&#8217;s a bit of a trade off there. And I presume, like I said, I imagine that&#8217;s why there was this acceleration of WordPress&#8217;s popularity because the people who maybe were buying these plugins had that intention, I just want a website. I don&#8217;t want to learn how to code. I&#8217;m not interested in that.</p>\n\n\n\n<p>I can see over here, look, I can buy that. It&#8217;s $97 a year. That&#8217;s perfect. That&#8217;ll satisfy me perfectly. Whereas maybe more on the Drupal side, it&#8217;s okay, that kind of works, but not entirely. I now need to make it work and obviously the community can do that.</p>\n\n\n\n<p>So that leads me then to the next question, which is, who the heck builds Drupal? So in the WordPress space, if you&#8217;re listening to this, you probably have an understanding of that. There&#8217;s a lot of volunteers, but there&#8217;s also a lot of companies that will dedicate a proportion of their time. We have this idea of Five for the Future. And so 5% of whatever it is that you want to give, be that time or money, or what have you. And so there&#8217;s this idea of community massively, but also corporations, businesses, putting time in. Is it the same basically on the Drupal side? Is that how it works?</p>\n\n\n\n<p>[00:37:51] Chris Reynolds: Yeah, largely. One of the things that I think you&#8217;ll notice that is a little bit of a distinction between WordPress and Drupal, from the events again. Is going through like the showroom, the sponsors floor. And at a WordCamp you see the hosts obviously, but then you see a lot of like plugin development shops, and that&#8217;s pretty much what I would expect, right? Big plugin or theme development shops and WordPress hosts. And a lot of the WordPress hosts are doing plugin development, and like, that&#8217;s sort of the thing.</p>\n\n\n\n<p>In Drupal, and at DrupalCon, obviously we have the hosts. And we had a, I mean, CKE Editor was there. That was kind of weird to me. I don&#8217;t know, like it&#8217;s in Drupal. It was weird to have like a library have a booth space. That seemed weird to me. But like it&#8217;s a lot of agencies, because agencies are the ones that are doing the work, and I&#8217;ve never seen an agency or maybe not since very small, like local WordCamps, have I seen an agency with a sponsorship, a booth space at a WordCamp.</p>\n\n\n\n<p>But that is, that&#8217;s where it is. And it&#8217;s agencies that do a lot of that Core contribution, because they&#8217;re also in the weeds working with clients and building these things for their Drupal customers. And so like, the SEO recipe that I was talking about, like at DrupalCon we, Pantheon has booth demos. Acquia also has booth demos, which means we can talk about, like do demos of our platform, whatever. What we actually did was bring in guest speakers from like agencies and universities and whatever that are actually using Drupal and Pantheon and to talk about their implementation of the cool stuff that they&#8217;re doing, because that works better.</p>\n\n\n\n<p>And one of the people that I talked to was about the SEO recipe, and he is at an agency and he worked with other people at other agencies, competing agencies even, to make this SEO recipe. So it&#8217;s, that&#8217;s where the contribution comes from. But again, like it&#8217;s the same sort of thing.</p>\n\n\n\n<p>Dries said 10 years ago, wrote a blog post about the maker taker problem, as he defines it. And then again in September, in relation to the current state of things in the WordPress ecosystem, because that&#8217;s a thing that he&#8217;s been thinking about for a long time. It&#8217;s obviously a thing that Matt&#8217;s been thinking about for a long time.</p>\n\n\n\n<p>Like it&#8217;s not, again, we&#8217;re not that different. We have the same fundamental problems. At the Community Summit at DrupalCon, one of the topics of conversation was getting more people involved, a younger generation involved into Drupal development, which is the exact same conversation we&#8217;re having in WordPress as well.</p>\n\n\n\n<p>Like, how do we appeal to a younger audience? It&#8217;s all the same stuff, right? And there was at some point like a contribution like pie chart. Again, similar to the pie chart that could be displayed at a WordCamp. You know, Automattic does a big chunk of that pie chart.</p>\n\n\n\n<p>And then you&#8217;ve got, you know, maybe Google does a smaller part of that pie chart and maybe like Bluehost or whatever. Similar pie chart. Acquia does a lot of the big part of the, of that pie chart. And then like other agencies are noted around, and then there&#8217;s like an other category, right, of just like individual contributors. It&#8217;s a very similar breakdown.</p>\n\n\n\n<p>[00:40:47] Nathan Wrigley: It&#8217;s interesting because obviously you alluded to the fact that WordPress has been in a state of flux since September. But Dries, I presume prompted by the situation that arose out of WordCamp US. He wrote a piece very much timed after that. So I presume it was in, there was some sort of correlation in his head. And he was laying out how Drupal have, not solved, but how they just have a different approach to that. And I can&#8217;t remember every single detail, but there was some curious examples in the Drupal community, like this kind of, I&#8217;m going to say pay to play thing.</p>\n\n\n\n<p>In other words, if you as a company, let&#8217;s say Pantheon may fit into this perfectly, if Pantheon steps through certain hoops and can prove that they did this thing and this thing and this thing for the community, for the Drupal project. If you step through those hoops, you then get, kind of, merit on the other side.</p>\n\n\n\n<p>You can, for example, turn up to DrupalCon as a sponsor. My understanding is that maybe it&#8217;s only certain tiers, I&#8217;m not really sure. But you can&#8217;t sponsor DrupalCon unless you have jumped through those hoops. And we don&#8217;t really have anything on the WordPress side like that. We have Five for the Future, but it&#8217;s hard to pin down. It&#8217;s hard to figure out who did what and what have you, because there aren&#8217;t the same sort of goalposts, but it feels like the goalposts are a bit more nailed down on the Drupal side.</p>\n\n\n\n<p>[00:42:03] Chris Reynolds: There is a process of nailing things down. I don&#8217;t know that it goes to the level of, like you can&#8217;t actually sponsor, because obviously Pantheon does sponsor and we&#8217;ve been, on the other end of being told that we don&#8217;t contribute enough to both WordPress and Drupal. But that also depends on how you define contribution really. And I have thoughts about that. The merit thing, it&#8217;s just where you&#8217;re drawing the lines in the sand. And Drupal has, Dries has his particular lines and the things that make you a contributor to the ecosystem, and what that means in Drupal.</p>\n\n\n\n<p>And then, to a degree, I mean, yeah, like you said, Five for the Future is kind of, sort of that thing, but it&#8217;s also kind of amalgamous and like it&#8217;s honor based. There&#8217;s not really a real sense of tracking or, you could kind of, sort of track things, I guess. But it&#8217;s very wibbly wobbly.</p>\n\n\n\n<p>But my perspective on contribution always has always been, one of the things, I know we&#8217;re not supposed to talk about what was talked about at PressConf, but Brad Williams, who I, was my former boss said, he was talking about Five for the Future and was talking about how Web Dev was very early on an adopter of Five for the Future, and I was there at the time, so I remember this. So it&#8217;s not just Brad&#8217;s words that I&#8217;m repeating. And the way that he approached Five for the Future was very much in the umbrella of if you&#8217;re doing anything WordPress related that is open source, we are counting that as a Five for the Future project, right. And that was how I understood Five for the Future.</p>\n\n\n\n<p>That was kind of how it was presented back in 2014 or whatever when Matt first threw the idea out to the, out to the ecosystem. And since then it&#8217;s sort of become this thing where contribution to WordPress really means Core contributions, or contributions in very specific ways. And it doesn&#8217;t mean all of this other stuff over here, including an up to theme development, plugin development.</p>\n\n\n\n<p>Even if that stuff is on .org, even if that stuff is open source, that&#8217;s not included in contribution. But I&#8217;m very much in the side of the bucket where like, well, everything is kind of contribution. We wouldn&#8217;t know how good WordPress scales to like enterprise level sites that are running it today, that are driving the adoption of WordPress, and driving the bar in like the visibility of WordPress, if it wasn&#8217;t for just hosts that are running the thing and making sure that it operates properly. And the teams like 10up and Human Made, and whoever who are like then, oh, to get this working at its best, fastest, most optimized state we need to do some enhancements. Either through the plugin ecosystem or contributing back to Core, so that we can push this code to these hosts, or platforms, or softwares as a service or whatever so that they operate for these clients that we&#8217;re building.</p>\n\n\n\n<p>So like I kind of feel like everything should be, even if you are a taker, in the language of Dries, that doesn&#8217;t necessarily mean that you&#8217;re not pushing the ecosystem forward. And I have that critique for both of our BDFLs, right? Because they both have very similar ideas.</p>\n\n\n\n<p>Like I think that the contribution title could be applied and should be applied more broadly, because everything that we&#8217;re doing is driving the project forward. A lot of the stuff that I write is like GitHub actions, or like plugins or things that are still broadly available to, and publicly available, and they&#8217;re open source and they&#8217;re for the community, but they&#8217;re not technically contribution, because contribution is narrowed down into this very specific definition.</p>\n\n\n\n<p>[00:45:30] Nathan Wrigley: It&#8217;s kind of curious, you know, if you were to cast your mind back 20 years, the beginning of both Drupal and WordPress, just even the idea that they would still be around for one thing, you know, that that software wouldn&#8217;t have just come and eaten them up and there would be like a two year lifespan.</p>\n\n\n\n<p>[00:45:44] Chris Reynolds: And that there&#8217;s an open source solution for these things.</p>\n\n\n\n<p>[00:45:46] Nathan Wrigley: And it&#8217;s going and it&#8217;s kept rising and it&#8217;s kept being used. That&#8217;s just so curious. But also the teething pains of that. The idea that, you know, it started with Matt, and it started with Dries, and then people got on board and it grew. And then in the case of Drupal, and in the case of WordPress, it just grew to the point where these individuals can no longer handle everything.</p>\n\n\n\n<p>You know, you described how Dries needed to sort of say, can somebody handle the events please? Because that&#8217;s just not where I want to be. The same, presumably on the WordPress side. And now we&#8217;re into giant communities. Really, really complicated communities. A lot of differing opinions, a lot of different maybe even politics, but a lot of different backgrounds, geography, the whole thing.</p>\n\n\n\n<p>It&#8217;s this international thing. And it&#8217;s difficult. It&#8217;s really, really hard to get it right. But what I&#8217;m taking from this conversation. Is that maybe Drupal do things differently, but they have way more in common than we have as differences.</p>\n\n\n\n<p>But also maybe there are some things that WordPress does better. Maybe there are some things that Drupal does better. And it would be very, very interesting if the two communities could kind of collide more, and share those ideas and we pick the best of each of them. It&#8217;s never gonna be perfect, but maybe that&#8217;s something that in the future, given that really at a very core level we&#8217;re not in competition with each other, it would be very nice if those conversations could take place.</p>\n\n\n\n<p>And I think you&#8217;ve laid the groundwork for a lot of that and explained how one project is not that dissimilar to the other one. So, that&#8217;s it.</p>\n\n\n\n<p>Chris, thank you so much for chatting to me today. I really appreciate it. That was very enlightening.</p>\n\n\n\n<p>[00:47:22] Chris Reynolds: Thank you for having me. I always love chatting with you.</p>\n</div></details>\n\n\n\n<p>On the podcast today we have <a href=\"https://www.linkedin.com/in/chrissreynolds/\">Chris Reynolds</a>.</p>\n\n\n\n<p>Chris is a developer advocate at Pantheon, where he brings nearly 20 years of experience in the WordPress community, as well as deep involvement with Drupal and open source technology at large. Prior to his advocacy role, he worked at some of the top WordPress agencies like Human Made and WebDevStudios. He’s been active at events like DrupalCon, PressConf, and WordCamps.</p>\n\n\n\n<p>In this episode, we set aside the usual WordPress-only focus, and turn our attention to two CMSs, WordPress and Drupal, what makes them tick, where they excel, and where they might have something to learn from each other.</p>\n\n\n\n<p>Chris draws on his unique perspective working closely with both platforms, as Pantheon is one of the few hosts with a 50/50 split between WordPress and Drupal sites, and has a significant footprint in both ecosystems.</p>\n\n\n\n<p>We discuss the similarities and differences between the two open source CMS communities, from the mechanics of flagship events like WordCamps and DrupalCon, to the ways these projects organize their contributors and support community initiatives.</p>\n\n\n\n<p>Chris explains how Drupal’s model, with its association-run funding and project governance, compares to WordPress’s approach, including how each community approaches plugin and module development, and what role agencies and companies play in contributing to Core and the broader ecosystem.</p>\n\n\n\n<p>If you’re curious about how open source projects organise themselves, how their communities navigate growth and challenge, and what WordPress can learn from Drupal (and vice versa), this episode is for you.</p>\n\n\n\n<h2 class=\"wp-block-heading\">Useful links</h2>\n\n\n\n<p><a href=\"https://pantheon.io/\">Pantheon</a></p>\n\n\n\n<p><a href=\"https://ampache.org/\"> Ampache</a></p>\n\n\n\n<p><a href=\"https://www.drupal.org/association/drupalcon\"> DrupalCon</a></p>\n\n\n\n<p><a href=\"https://pressconf.events/\">PressConf</a></p>\n\n\n\n<p><a href=\"https://webdevstudios.com/\"> WebDevStudios</a></p>\n\n\n\n<p><a href=\"https://humanmade.com/\"> Human Made</a></p>\n\n\n\n<p><a href=\"https://www.acquia.com/\"> Acquia</a></p>\n\n\n\n<p><a href=\"https://dri.es/about\"> Dries Buytaert</a></p>\n\n\n\n<p><a href=\"https://automattic.com/\"> Automattic</a></p>\n\n\n\n<p><a href=\"https://solr.apache.org/\">Solr</a></p>\n\n\n\n<p><a href=\"https://www.elastic.co/elasticsearch\"> Elasticsearch</a></p>\n\n\n\n<p><a href=\"https://getcomposer.org/\"> Composer</a></p>\n\n\n\n<p><a href=\"https://wptavern.com/podcast/68-chris-reynolds-on-why-to-use-composer-with-wordpress\"> Chris on a previous episode of the WP Tavern Jukebox podcast talking about Composer</a></p>\n\n\n\n<p><a href=\"https://www.drupal.org/community/events?field_event_type_value=drupalcamp&amp;field_event_address_country=All\"> DrupalCamps</a></p>\n\n\n\n<p><a href=\"https://dri.es/solving-the-maker-taker-problem\">Solving the Maker-Taker problem</a></p>\n\n\n\n<p> Dries Notes &#8211; <a href=\"https://dri.es/state-of-drupal-presentation-september-2024\">State of Drupal presentation (September 2024)</a></p>\n\n\n\n<p><a href=\"https://www.drupal.org/association\"> Drupal Association</a></p>\n\n\n\n<p><a href=\"https://yoast.com/yoast-seo-for-drupal/\">Drupal  Yoast module</a></p>\n\n\n\n<p><a href=\"https://new.drupal.org/home\">Drupal CMS</a></p>\n\n\n\n<p><a href=\"https://www.drupal.org/docs/8/core/modules/views\">Drupal Views</a></p>\n\n\n\n<p><a href=\"https://www.gravityforms.com/\">Gravity Forms</a></p>\n\n\n\n<p><a href=\"https://wordpress.org/five-for-the-future/\">Five for the Future</a></p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Wed, 21 May 2025 14:00:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:14:\"Nathan Wrigley\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:44;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:99:\"Do The Woo Community: From Functional to Scalable: WooCommerce Solutions with an Enterprise Mindset\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:47:\"https://openchannels.fm/?post_type=blog&p=96868\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:101:\"https://openchannels.fm/from-functional-to-scalable-woocommerce-solutions-with-an-enterprise-mindset/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:209:\"Some insight on agencies who focus on enterprise-level solutions for mid-market WooCommerce clients, emphasizing customized, scalable technologies and decoupled architectures to enhance reliability and growth.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Wed, 21 May 2025 09:11:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:45;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:71:\"Do The Woo Community: One For the Road via PressConf with Adam and Emma\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:32:\"https://openchannels.fm/?p=97297\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:74:\"https://openchannels.fm/one-for-the-road-via-pressconf-with-adam-and-emma/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:262:\"During PressConf 2025, hosts and guests highlighted the significance of in-person connections within the WordPress community, emphasizing candid conversations, relationship-building, emotional moments, and the event\'s business focus, inspiring future gatherings.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Tue, 20 May 2025 13:06:42 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:46;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:88:\"Do The Woo Community: How to Say No to Feature Requests Without Upsetting Your Customers\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:47:\"https://openchannels.fm/?post_type=blog&p=96857\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:91:\"https://openchannels.fm/how-to-say-no-to-feature-requests-without-upsetting-your-customers/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:212:\"The challenges of declining customer feature requests while maintaining goodwill. Strategies include transparent communication, offering alternatives, and using data for prioritization, preserving product vision.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Tue, 20 May 2025 08:00:00 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:47;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:75:\"Do The Woo Community: Your Website Could Use a Changelog to Fuel Creativity\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:47:\"https://openchannels.fm/?post_type=blog&p=96643\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:88:\"https://openchannels.fm/why-every-website-needs-a-changelog-and-how-it-fuels-creativity/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:221:\"Website changelogs, often overlooked, document progress and small victories. They provide transparency, spark creativity, and offer audiences insight into a site\'s evolution—important for all creators, not just techies.\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Mon, 19 May 2025 10:35:15 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:8:\"Bob Dunn\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:48;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:75:\"Weston Ruter: Adding Caption &amp;amp; Lightbox to the Featured Image Block\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:33:\"https://weston.ruter.net/?p=34581\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:92:\"https://weston.ruter.net/2025/05/17/adding-caption-and-lightbox-to-the-featured-image-block/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:21544:\"<p>Earlier this year I re-built this site using the <a href=\"https://wordpress.org/themes/twentytwentyfive/\">Twenty Twenty-Five</a> theme, finally adopting a <a href=\"https://wordpress.org/documentation/article/block-themes/\">block theme</a> over the veritable <a href=\"https://wordpress.org/themes/twentytwenty/\">Twenty Twenty</a> classic theme I had been using. In this rebuild, one thing that I had trouble with is the featured image. In the Twenty Twenty theme, a <a href=\"https://github.com/WordPress/wordpress-develop/blob/8b466fce082b5b8731cebca85469ae1978318504/src/wp-content/themes/twentytwenty/template-parts/featured-image.php#L27-L36\">caption is rendered</a> under the featured image if one is set on the underlying <code>attachment</code> post in the Media Library. In the Twenty Twenty-Five theme, however, no caption is shown by the <a href=\"https://wordpress.org/documentation/article/post-featured-image-block/\">Featured Image block</a>:</p>\n\n\n\n<div class=\"wp-block-columns is-not-stacked-on-mobile is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large has-custom-border wp-lightbox-container\"><img alt=\"Single template of Twenty Twenty theme showing an article about the Bison with an image of the Bison as the featured image. A caption appears below the Bison image.\" class=\"has-border-color has-accent-4-border-color wp-image-34604\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/twentytwenty-single-template.png?resize=394%2C700&#038;ssl=1\" style=\"border-width: 1px;\" width=\"394\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button><figcaption class=\"wp-element-caption\">Caption shown with featured image in the Twenty Twenty theme.</figcaption></figure>\n</div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large has-custom-border wp-lightbox-container\"><img alt=\"Single template of Twenty Twenty-Five theme showing an article about the Bison with an image of the Bison as the featured image. A caption does not appear below the Bison image.\" class=\"has-border-color has-accent-4-border-color wp-image-34605\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/twentytwentyfive-single-template.png?resize=394%2C700&#038;ssl=1\" style=\"border-width: 1px;\" width=\"394\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button><figcaption class=\"wp-element-caption\">Caption for featured image omitted in the Twenty Twenty-Five theme.</figcaption></figure>\n</div>\n</div>\n\n\n\n<p>I was expecting the Featured Image block to have an &#8220;Add caption&#8221;/“Remove caption” button in the block toolbar. This is available in the regular Image block, but it is absent in the Featured Image block:</p>\n\n\n\n<div class=\"wp-block-columns is-not-stacked-on-mobile is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large has-custom-border wp-lightbox-container\"><img alt=\"Block editor showing an Image block selected with the caption appearing below the image and the &quot;Remove Caption&quot; button being hovered over in the block toolbar.\" class=\"has-border-color has-accent-4-border-color wp-image-34606\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/twentytwentyfive-block-editor-image-block.png?resize=624%2C700&#038;ssl=1\" style=\"border-width: 1px;\" width=\"624\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button><figcaption class=\"wp-element-caption\">Image block in the block editor with “Remove caption” button hovered.</figcaption></figure>\n</div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large has-custom-border wp-lightbox-container\"><img alt=\"Site editor showing a Featured Image block selected with there not being any caption displayed and no block toolbar button for captions.\" class=\"has-border-color has-accent-4-border-color wp-image-34607\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/twentytwentyfive-site-editor-featured-image-block.png?resize=638%2C700&#038;ssl=1\" style=\"border-width: 1px;\" width=\"638\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button><figcaption class=\"wp-element-caption\">Featured Image block without any “Add caption” button shown in the block toolbar.</figcaption></figure>\n</div>\n</div>\n\n\n\n<p>It turns out there is a 3-year old Gutenberg issue (<a href=\"https://github.com/WordPress/gutenberg/issues/40946\" title=\"[Post Featured Image]: add option to display image caption/credit\">#40946</a>) about this missing capability in the Featured Image block. But this isn&#8217;t the only missing feature from the block. In addition to the caption, something else I was missing is the ability to open the featured image in a lightbox, something which the Image block exposes by selecting the link option to “Enlarge on click”. The Featured Image block does not have this Link button in the block toolbar but instead just has a “Link to Post” setting toggle in the block sidebar:</p>\n\n\n\n<div class=\"wp-block-columns is-not-stacked-on-mobile is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large has-custom-border wp-lightbox-container\"><img alt=\"Block editor with the Link block toolbar button having been clicked, showing the Link options to &quot;Link to image file&quot;, &quot;Link to attachment page&quot;, and &quot;Enlarge on click&quot;. The last option is focused.\" class=\"has-border-color has-accent-4-border-color wp-image-34608\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/image-block-enlarge-on-click.png?resize=625%2C700&#038;ssl=1\" style=\"border-width: 1px;\" width=\"625\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button><figcaption class=\"wp-element-caption\">Link submenu showing “Enlarge on click” option for Image block.</figcaption></figure>\n</div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large has-custom-border wp-lightbox-container\"><img alt=\"Site editor showing showing the Featured Image block selected, bit without there being a Link button in the block toolbar. The block sidebar is expanded to show a single setting available: &quot;Link to Post&quot;.\" class=\"has-border-color has-accent-4-border-color wp-image-34609\" height=\"500\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/featured-image-block-block-sidebar.png?resize=700%2C500&#038;ssl=1\" style=\"border-width: 1px;\" width=\"700\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button><figcaption class=\"wp-element-caption\">Block toolbar missing Link button but showing “Link to Post” setting in the block sidebar for the Featured Image block.</figcaption></figure>\n</div>\n</div>\n\n\n\n<p>There is also an open Gutenberg issue to add this lightbox capability to the Featured Image block (<a href=\"https://github.com/WordPress/gutenberg/issues/57849\" title=\"Featured Image block: Lightbox / Expand use case \">#57849</a>).</p>\n\n\n\n<p>Because I want these features now before they get implemented in Gutenberg, I&#8217;ve put together a couple plugins (on GitHub) that extend the Featured Image block with these missing capabilities:</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https://github.com/westonruter/featured-image-block-with-caption\">Featured Image Block with Caption</a></li>\n\n\n\n<li><a href=\"https://github.com/westonruter/featured-image-block-with-lightbox\">Featured Image Block with Lightbox</a></li>\n</ul>\n\n\n\n<p>These are active on this site, so you can see above how the featured image is enhanced with a caption and lightbox.</p>\n\n\n\n<p>While the Gutenberg issue for adding a caption has a <a href=\"https://github.com/WordPress/gutenberg/issues/40946#issuecomment-1682973710\">workaround</a> involving the registration of a new block variation, I wanted there to be the same &#8220;Add caption&#8221; block toolbar button which is available on the Image block, and I wanted to be able to see a placeholder for how the caption would look in the Site Editor. So this is what I implemented:</p>\n\n\n\n<div class=\"wp-block-columns alignwide is-not-stacked-on-mobile is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large has-custom-border wp-lightbox-container\"><img alt=\"Site Editor showing the Featured Image block selected and a new &quot;Add caption&quot; button appearing in the toolbar.\" class=\"has-border-color has-accent-4-border-color wp-image-34613\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/featured-image-block-with-add-caption-button.png?resize=636%2C700&#038;ssl=1\" style=\"border-width: 1px;\" width=\"636\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button><figcaption class=\"wp-element-caption\">Featured Image block in the Site Editor with an “Add caption” button appearing in the block toolbar. </figcaption></figure>\n</div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large has-custom-border wp-lightbox-container\"><img alt=\"Site Editor showing the Featured Image block selected and the &quot;Add caption&quot; button being selected in the block toolbar. A placeholder caption appears below the image.\" class=\"has-border-color has-accent-4-border-color wp-image-34614\" height=\"700\" src=\"https://i0.wp.com/weston.ruter.net/wp-content/uploads/2025/05/featured-image-block-with-caption-placeholder-shown.png?resize=636%2C700&#038;ssl=1\" style=\"border-width: 1px;\" width=\"636\" /><button class=\"lightbox-trigger\" type=\"button\">\n			<svg fill=\"none\" height=\"12\" viewBox=\"0 0 12 12\" width=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n				<path d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" fill=\"#fff\">\n			</svg>\n		</button><figcaption class=\"wp-element-caption\">Caption placeholder appearing in Featured Image block in the Site Editor.</figcaption></figure>\n</div>\n</div>\n\n\n\n<p>Selecting “Add caption” sets a new <code>showCaption</code> block attribute to <code>true</code>, without making any changes to the block markup. This means there won&#8217;t be any block validation errors when the plugin is deactivated. When the block attribute is present, a <code>render_block</code> filter in PHP injects the caption into the block&#8217;s markup on the frontend. On my site, I edited the Single template to show the caption in the Featured Image block, but I left the caption off for the block on the Home template in order to keep the blog index clean. Editing the text of a Featured Image block&#8217;s caption is not done inline in the block editor as is done with the Image block; instead, editing the featured image caption requires either selecting the image in the Media Library in the post editor, opening the image in the <a href=\"https://wordpress.org/documentation/article/media-library-screen/#attachment-details\">Media Library screen</a>, or opening it in the seldom-accessed <a href=\"https://wordpress.org/documentation/article/edit-media/\">Edit Media screen</a>.</p>\n\n\n\n<p>The plugin to implement a lightbox for the Featured Image block is much simpler, and there is no UI. There&#8217;s simply another <code>render_block</code> filter which checks to see if the “Link to Post” setting is enabled, and if not, then it enables the “enlarge on click” functionality. Normally the “Link to Post” setting is not enabled on the Single template, allowing the featured image to open in a lightbox the same as any other Image block which have lightbox enabled. The implementation was trivial because all it needed to do is enqueue the same script module and stylesheet as the Image block does, and then it passes the block content into the same <a href=\"https://github.com/WordPress/wordpress-develop/blob/6.8.1/src/wp-includes/blocks/image.php#L128-L248\">function</a> used by the Image block. In the end, the Featured Image block&#8217;s markup looks very similar to the Image block&#8217;s markup:</p>\n\n\n<pre class=\"wp-block-code alignwide has-small-font-size\"><span><code class=\"hljs language-diff\"><span class=\"hljs-comment\">--- image-block.html</span>\n<span class=\"hljs-comment\">+++ featured-image-block.html</span>\n<span class=\"hljs-meta\">@@ -1,11 +1,12 @@</span>\n &lt;figure\n 	data-wp-context=\'{\"imageId\":\"68293cf73baf0\"}\'\n 	data-wp-interactive=\"core/image\"\n<span class=\"hljs-deletion\">-	class=\"wp-block-image size-full wp-lightbox-container\"</span>\n<span class=\"hljs-addition\">+	style=\"aspect-ratio: auto\"</span>\n<span class=\"hljs-addition\">+	class=\"wp-block-post-featured-image wp-lightbox-container\"</span>\n &gt;\n 	&lt;img\n 		alt=\"\"\n<span class=\"hljs-deletion\">-		class=\"wp-image-8\"</span>\n<span class=\"hljs-addition\">+		class=\"attachment-post-thumbnail size-post-thumbnail wp-post-image\"</span>\n 		data-wp-class--hide=\"state.isContentHidden\"\n 		data-wp-class--show=\"state.isContentVisible\"\n 		data-wp-init=\"callbacks.setButtonStyles\"\n<span class=\"hljs-meta\">@@ -25,6 +26,7 @@</span>\n 			http://localhost:10013/wp-content/uploads/2025/05/American_bison_k5680-1-1536x1002.jpg 1536w,\n 			http://localhost:10013/wp-content/uploads/2025/05/American_bison_k5680-1-2048x1336.jpg 2048w\n 		\"\n<span class=\"hljs-addition\">+		style=\"width: 100%; height: 100%; object-fit: cover\"</span>\n 		width=\"2560\"\n 	/&gt;&lt;button\n 		class=\"lightbox-trigger\"</code></span></pre>\n\n\n<p>Ultimately, I <a href=\"https://github.com/WordPress/gutenberg/issues/57849#issuecomment-2704434044\">think</a> the Featured Image block could be deprecated in favor of adding a “Use featured image” source to the Image block. This would allow all of its features to be re-used in a featured image context. I suppose “Link to Post” would have to be added as one of the Link options when the featured image is used as the source.</p>\n\n\n\n<p>I hope this is helpful for you with building sites with block themes while waiting for these features to land in the core Featured Image block!</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" />\n\n\n\n<p>Where I&#8217;ve shared this:</p>\n\n\n\n<ul class=\"wp-block-social-links is-layout-flex wp-block-social-links-is-layout-flex\"><li class=\"wp-social-link wp-social-link-bluesky  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://bsky.app/profile/weston.ruter.net/post/3lpg5cfpvj22d\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6.3,4.2c2.3,1.7,4.8,5.3,5.7,7.2.9-1.9,3.4-5.4,5.7-7.2,1.7-1.3,4.3-2.2,4.3.9s-.4,5.2-.6,5.9c-.7,2.6-3.3,3.2-5.6,2.8,4,.7,5.1,3,2.9,5.3-5,5.2-6.7-2.8-6.7-2.8,0,0-1.7,8-6.7,2.8-2.2-2.3-1.2-4.6,2.9-5.3-2.3.4-4.9-.3-5.6-2.8-.2-.7-.6-5.3-.6-5.9,0-3.1,2.7-2.1,4.3-.9h0Z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">Bluesky</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-linkedin  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://www.linkedin.com/posts/westonruter_adding-caption-lightbox-to-the-featured-activity-7329712341493698561-3GQE\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M19.7,3H4.3C3.582,3,3,3.582,3,4.3v15.4C3,20.418,3.582,21,4.3,21h15.4c0.718,0,1.3-0.582,1.3-1.3V4.3 C21,3.582,20.418,3,19.7,3z M8.339,18.338H5.667v-8.59h2.672V18.338z M7.004,8.574c-0.857,0-1.549-0.694-1.549-1.548 c0-0.855,0.691-1.548,1.549-1.548c0.854,0,1.547,0.694,1.547,1.548C8.551,7.881,7.858,8.574,7.004,8.574z M18.339,18.338h-2.669 v-4.177c0-0.996-0.017-2.278-1.387-2.278c-1.389,0-1.601,1.086-1.601,2.206v4.249h-2.667v-8.59h2.559v1.174h0.037 c0.356-0.675,1.227-1.387,2.526-1.387c2.703,0,3.203,1.779,3.203,4.092V18.338z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">LinkedIn</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-twitter  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://x.com/westonruter/status/1923947578217071045\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M22.23,5.924c-0.736,0.326-1.527,0.547-2.357,0.646c0.847-0.508,1.498-1.312,1.804-2.27 c-0.793,0.47-1.671,0.812-2.606,0.996C18.324,4.498,17.257,4,16.077,4c-2.266,0-4.103,1.837-4.103,4.103 c0,0.322,0.036,0.635,0.106,0.935C8.67,8.867,5.647,7.234,3.623,4.751C3.27,5.357,3.067,6.062,3.067,6.814 c0,1.424,0.724,2.679,1.825,3.415c-0.673-0.021-1.305-0.206-1.859-0.513c0,0.017,0,0.034,0,0.052c0,1.988,1.414,3.647,3.292,4.023 c-0.344,0.094-0.707,0.144-1.081,0.144c-0.264,0-0.521-0.026-0.772-0.074c0.522,1.63,2.038,2.816,3.833,2.85 c-1.404,1.1-3.174,1.756-5.096,1.756c-0.331,0-0.658-0.019-0.979-0.057c1.816,1.164,3.973,1.843,6.29,1.843 c7.547,0,11.675-6.252,11.675-11.675c0-0.178-0.004-0.355-0.012-0.531C20.985,7.47,21.68,6.747,22.23,5.924z\"></path></svg><span class=\"wp-block-social-link-label screen-reader-text\">Twitter</span></a></li>\n\n<li class=\"wp-social-link wp-social-link-mastodon  wp-block-social-link\"><a class=\"wp-block-social-link-anchor\" href=\"https://mastodon.social/@westonruter/114526760610405491\"><svg height=\"24\" version=\"1.1\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M23.193 7.879c0-5.206-3.411-6.732-3.411-6.732C18.062.357 15.108.025 12.041 0h-.076c-3.068.025-6.02.357-7.74 1.147 0 0-3.411 1.526-3.411 6.732 0 1.192-.023 2.618.015 4.129.124 5.092.934 10.109 5.641 11.355 2.17.574 4.034.695 5.535.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.129.539c-2.165-.074-4.449-.233-4.799-2.891a5.499 5.499 0 0 1-.048-.745s2.125.52 4.817.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.507.475-6.507zm-4.024 6.709h-2.497V8.469c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.312v3.349h-2.483v-3.35c0-1.536-.602-2.312-1.802-2.312-1.085 0-1.628.655-1.628 1.944v6.119H4.832V8.284c0-1.289.328-2.313.987-3.07.68-.758 1.569-1.146 2.674-1.146 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.304z\"></svg><span class=\"wp-block-social-link-label screen-reader-text\">Mastodon</span></a></li></ul>\n<p>The post <a href=\"https://weston.ruter.net/2025/05/17/adding-caption-and-lightbox-to-the-featured-image-block/\">Adding Caption &amp; Lightbox to the Featured Image Block</a> appeared first on <a href=\"https://weston.ruter.net\">Weston Ruter</a>.</p>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Sun, 18 May 2025 03:28:23 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:12:\"Weston Ruter\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}i:49;a:6:{s:4:\"data\";s:21:\"\n	\n	\n	\n	\n	\n	\n	\n	\n	\n	\n\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";s:5:\"child\";a:2:{s:0:\"\";a:5:{s:5:\"title\";a:1:{i:0;a:5:{s:4:\"data\";s:121:\"Gutenberg Times: 14 plugins for the block editor, Gutenberg 20.8, Studio 1.15.1, Woo 9.9 and more — Weekend Edition 330\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"guid\";a:1:{i:0;a:5:{s:4:\"data\";s:35:\"https://gutenbergtimes.com/?p=40398\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:4:\"link\";a:1:{i:0;a:5:{s:4:\"data\";s:125:\"https://gutenbergtimes.com/14-plugins-for-the-block-editor-gutenberg-20-8-studio-1-15-1-woo-9-9-and-more-weekend-edition-330/\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:11:\"description\";a:1:{i:0;a:5:{s:4:\"data\";s:27364:\"<p>Hi there,</p>\n\n\n\n<p>This weekend I am at WordCamp Leipzig and spent Friday night and Saturday with about 70 WordPressers from the German community. It&#8217;s my third year attending this small, low-key WordCamp. This year, it had way more session submissions than speaker slots, and it sold out tickets with a waiting list. Congratulations to the organizing team. <img alt=\"🎉\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f389.png\" style=\"height: 1em;\" /> </p>\n\n\n\n<p>With the European Accessibility Act (EAA) set to take effect on June 28, 2025, the selection of three talks focused on accessibility is both timely and highly relevant-making them especially interesting to me. I am also looking forward to Hans-Gerd Gerhard&#8217;s walk through practical examples for block theme implementations. Talks on site performance, e-commerce, error handling and UX for Gen Z round up the <a href=\"https://leipzig.wordcamp.org/2025/zeitplan/\">session schedule</a>. Although it&#8217;s a low-key WordCamp the video team is amazing. The sessions will be recorded and uploaded to WordPressTV the same or the following day. Session are in German, though. </p>\n\n\n\n<p>Save the Date for <a href=\"https://us.wordcamp.org/2025/\">WordCamp US</a>! It&#8217;ll take place from August 26 to August 29. 2025. The call for speakers and sponsors will come out on May 19, 2025, so keep an eye out. If all goes well, I will return to WordCamp US after three years, to finally see my WordPress friends from a previous life again. <img alt=\"🎉\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f389.png\" style=\"height: 1em;\" /> Will I  see you in Portland, OR, too? </p>\n\n\n\n<p>I could call today&#8217;s newsletter, <em>The Plugin Edition</em>, as it mentions 14 plugins that will help with content creation, making a visual impact and organizing your site. It&#8217;s actually 16 plugins if you count Gutenberg and WooCommerce as well. Have fun browsing, and please hit reply if you have any opinion or other plugins to mention. Listing those plugins here doesn&#8217;t mean I recommend them, you would need to test them for yourself. I just wanted to surface them as it&#8217;s a bit difficult to find new plugins in the WordPress repository.</p>\n\n\n\n<p>Have a lovely weekend! </p>\n\n\n\n<p>Yours, <img alt=\"💕\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f495.png\" style=\"height: 1em;\" /><br /><em>Birgit</em></p>\n\n\n\n\n<section class=\"wp-block-newsletterglue-group\" style=\"padding-top: 10px; padding-bottom: 10px; padding-left: 20px; padding-right: 20px; margin-top: 0px; margin-bottom: 0px;\">\n<div class=\"wp-block-group has-light-background-background-color has-background\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>Table of Contents</strong></p>\n\n\n\n<nav class=\"wp-block-table-of-contents\"><ol><li><a class=\"wp-block-table-of-contents__entry\" href=\"https://gutenbergtimes.com/14-plugins-for-the-block-editor-gutenberg-20-8-studio-1-15-1-woo-9-9-and-more-weekend-edition-330/#0-word-press-release-information\">Developing Gutenberg and WordPress</a></li><li><a class=\"wp-block-table-of-contents__entry\" href=\"https://gutenbergtimes.com/14-plugins-for-the-block-editor-gutenberg-20-8-studio-1-15-1-woo-9-9-and-more-weekend-edition-330/#0-p\">Plugins, Themes, and Tools for #nocode site builders and owners</a><ol><li><a class=\"wp-block-table-of-contents__entry\" href=\"https://gutenbergtimes.com/14-plugins-for-the-block-editor-gutenberg-20-8-studio-1-15-1-woo-9-9-and-more-weekend-edition-330/#more-single-blocks-and-block-collections-from-the-wordpress-plugin-repository\">More single blocks and block collections from the WordPress plugin repository</a></li></ol></li><li><a class=\"wp-block-table-of-contents__entry\" href=\"https://gutenbergtimes.com/14-plugins-for-the-block-editor-gutenberg-20-8-studio-1-15-1-woo-9-9-and-more-weekend-edition-330/#3-building-themes-for-fse-and-word-press\">Building Blocks and Tools for the Block editor.</a></li></ol></nav>\n</div></div>\n</section>\n\n\n<h2 class=\"wp-block-heading\" id=\"0-word-press-release-information\">Developing Gutenberg and WordPress</h2>\n\n\n\n<p><strong>George Mamadashvili</strong> released <a href=\"https://github.com/WordPress/gutenberg/releases/tag/v20.8.0\"><strong>Gutenberg 20.8</strong></a> on May 14, 2025. Here are the features, Ellen Bauer and I discussed on the podcast episode&#8221;</p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Create block package: added flag for text domain during scaffolding. (<a href=\"https://github.com/WordPress/gutenberg/pull/69802\">69802</a>)</li>\n\n\n\n<li>Guide component customization: next and previous button text. (<a href=\"https://github.com/WordPress/gutenberg/pull/69907\">69907</a>)</li>\n\n\n\n<li>Search functionality for page templates and patterns. (<a href=\"https://github.com/WordPress/gutenberg/pull/69667\">69667</a>)</li>\n\n\n\n<li>Meta box fixes and widget editor locking. (<a href=\"https://github.com/WordPress/gutenberg/pull/69958\">69958</a>)(<a href=\"https://github.com/WordPress/gutenberg/pull/69984\">69984</a>)</li>\n\n\n\n<li>Ability to edit HTML for invalid blocks.(<a href=\"https://github.com/WordPress/gutenberg/pull/69902\">69902</a>)</li>\n\n\n\n<li>Spacer block update preventing negative width in row blocks.(<a href=\"https://github.com/WordPress/gutenberg/pull/68845\">68845</a>)</li>\n\n\n\n<li>Box sizing property updates to prevent design overflow.(<a href=\"https://github.com/WordPress/gutenberg/pull/70014\">70014</a>)</li>\n\n\n\n<li>Block bindings API documentation improvements and limitations.(<a href=\"https://github.com/WordPress/gutenberg/pull/68583\">68583</a>)</li>\n\n\n\n<li>Block Styles:  add copy and code for style_data to documentation (<a href=\"https://github.com/WordPress/gutenberg/pull/69920\">69920</a>)</li>\n</ul>\n\n\n\n<p>The changelog is <a href=\"https://github.com/WordPress/gutenberg/releases/tag/v20.8.0\">available on the GitHub repo</a>. </p>\n\n\n\n<div class=\"wp-block-group has-light-background-background-color has-background\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n<p><img alt=\"🎙\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f399.png\" style=\"height: 1em;\" /> The latest episode <a href=\"https://gutenbergtimes.com/podcast/gutenberg-changelog-117-woocommerce-starter-theme-and-blocks/\">Gutenberg Changelog 117 – WooCommerce Starter Theme and Blocks, WordCamp Europe, and Gutenberg 20.7 and 20.8</a> I sat down with Ellen Bauer, WooCommerce product lead and discussed what she is working on, WordCamp Europe, Create Block Theme, WP-CLI, Gutenberg 20.7 and Gutenberg 20.8 releases. </p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img alt=\"Ellen Bauer and Birgit Pauli-Haack recording Gutenberg Changelog 117\" class=\"wp-image-40375\" height=\"184\" src=\"https://i0.wp.com/gutenbergtimes.com/wp-content/uploads/2022/03/Screenshot-2025-05-10-at-12.16.57.png?resize=652%2C184&#038;ssl=1\" width=\"652\" /></figure>\n</div></div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"0-p\">Plugins, Themes, and Tools for #nocode site builders and owners</h2>\n\n\n\n<p><strong>Mike McAlister</strong> announced <a href=\"https://olliewp.com/the-future-of-wordpress-site-building-starts-with-ollie-pro-2-0/\"><strong>the release of Ollie Pro 2.0</strong></a>. The update introduces a redesigned dashboard, a setup wizard to streamline site configuration, and starter sites, with which users could launch a complete website fast. For developers, a child theme creator is included to enable safe code customizations. The release also expands the pattern library with hundreds of professionally designed layouts and styles, all accessible through an improved pattern browser. </p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img alt=\"\" class=\"wp-image-40453\" height=\"373\" src=\"https://i0.wp.com/gutenbergtimes.com/wp-content/uploads/2025/05/Screenshot-2025-05-12-at-9.11.42%E2%80%AFAM-1536x879-1.webp?resize=652%2C373&#038;ssl=1\" width=\"652\" /></figure>\n\n\n\n<p><strong>Michael Pretty</strong>, code wrangler at WooCommerce, recently shared some great news: <a href=\"https://developer.woocommerce.com/2025/05/13/woocommerce-9-9-will-deliver-massive-admin-performance-gains/\"><strong>WooCommerce 9.9 will bring significant admin performance improvements.</strong></a> In his post, he outlined the key factors and changes behind faster admin screen rendering and quicker action execution for Woo merchants. These updates promise a noticeably smoother and more efficient experience when managing your store. You can start testing the with the <a href=\"https://developer.woocommerce.com/2025/05/12/woocommerce-9-9-pre-release-updates/\">Woo 9.9 Beta version</a>. WooCommerce 9.9 is scheduled for release on June 2, 2025, just before WordCamp Europe. </p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p>If you often write tutorials with code examples, you need to check out the <strong><a href=\"https://code-block-pro.com/\">Code</a><a href=\"https://wordpress.org/plugins/code-block-pro/\"> Block Pro</a></strong> plugin by <strong>Kevin Batdorf</strong>. You can make your code look as beautiful as the rest of your site. The plugin offers dozens of different themes, and specific syntax highlighting for hundreds of programming languages. If you feel the code section gets too long with the “Click to see more” feature, you can collapse code blocks at any line, letting visitors expand only what they need. Also, very handy are line highlighting and blurring of surrounding code, which helps readers to quickly recognize the code section that you want them to focus on. I’ve only scratched the surface of what Code Block Pro can do in my own posts. You can get the plugin <a href=\"https://wordpress.org/plugins/code-block-pro/\">from the WordPress repository</a>.</p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https://gutenbergtimes.com/seven-steps-to-a-custom-block-theme-anders-norens-weekend-workflow/#second-task-update-theme-json\"><img alt=\"\" class=\"wp-image-40456\" height=\"368\" src=\"https://i0.wp.com/gutenbergtimes.com/wp-content/uploads/2025/05/Screenshot-2025-05-15-at-15.03.42.png?resize=652%2C368&#038;ssl=1\" width=\"652\" /></a><figcaption class=\"wp-element-caption\"><a href=\"https://gutenbergtimes.com/seven-steps-to-a-custom-block-theme-anders-norens-weekend-workflow/#second-task-update-theme-json\">Screenshot from my post on Block Theme building.</a> </figcaption></figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p>In her latest tutorial, <strong>Anne Katzeff </strong>explored <a href=\"https://www.askdesign.biz/blog/2025/05/layout-and-design-with-row-and-stack-blocks/\"><strong>how the Row and Stack blocks expand the layout and design</strong></a> possibilities for your site. She discusses all the different settings, and styles options for these Group block variations.  </p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img alt=\"Screenshot from Anne Katzeff\'s tutorial with her amazing art! \" class=\"wp-image-40481\" height=\"390\" src=\"https://i0.wp.com/gutenbergtimes.com/wp-content/uploads/2025/05/Screenshot-2025-05-16-at-14.10.48.png?resize=652%2C390&#038;ssl=1\" width=\"652\" /></figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong>Hans-Gerd Gerhards</strong> introduced his <strong><a href=\"https://haurand.com/plugin-shrinking-logo-sticky-header/\">&#8220;Plugin Shrinking Logo Sticky Header”</a></strong>. The plugin lets you &#8220;add a modern sticky header with smooth, animated shrinking effects for both the header and the site logo.&#8221; You have full control over the heights for default and shrunken states and also use your site&#8217;s colors for styling. The post also entails the link for downloads videos and screenshots. The plugin in in the approval queue for the WordPress directory. </p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"more-single-blocks-and-block-collections-from-the-wordpress-plugin-repository\">More single blocks and block collections from the WordPress plugin repository</h3>\n\n\n\n<p>I am amazed at the creativity of plugin authors to always find missing features to add to WordPress. Some even you didn&#8217;t know you were missing. <img alt=\"🧐\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f9d0.png\" style=\"height: 1em;\" /> Over the last few days,  I found several single blocks and block collections in my RSS Feeds.  I have not tested them.  Use at your own risk. If you do try some, please let me know how it went. <a href=\"mailto:pauli@gutenbergtimes.com\">Email me. </a></p>\n\n\n\n<p><a href=\"https://wordpress.org/plugins/nasio-blocks/\"><strong>Nasio Blocks</strong></a>  by <strong>Nasio Themes</strong> &#8211; A newcomer on the WordPress repository. Welcome to the WordPress space! <img alt=\"👋\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f44b.png\" style=\"height: 1em;\" /> &#8220;Post slider, Content slider, Gallery slider, Accordion and Icon blocks. Features a template library with predefined demo content (block patterns) to speed up the page creation process.&#8221; so they say. </p>\n\n\n\n<p><strong><a href=\"https://wordpress.org/plugins/flipbox-block/\">Flipbox Block</a> by <a href=\"https://gutenbergkits.com/\">GutenbergKits</a></strong> &#8220;Flip box Block &#8211;  &#8220;A flip box is an interactive UI element that flips between two sections on hover or click.&#8221; and &#8220;You can create unlimited design possibilities&#8221;. I remember when I build such a flip box w/ vanilla JavaScript in a static HTML page for a memory game some time in the early 2000s. Now I just can install a block for it.</p>\n\n\n\n<p><a href=\"https://wordpress.org/plugins/photo-block/\"><strong>Photo Block</strong></a> by <a href=\"https://x.com/ronaldhuereca\"><strong>Ronald Huereca</strong></a>, in his 20th year of his WordPress.org account. <img alt=\"🎉\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f389.png\" style=\"height: 1em;\" /> He built into it advanced image customization, full caption support, responsive styling, and global styles. Alone from the screenshots on the plugin page I feel a bit overwhelmed with the vast number of customizations.You&#8217;ll find a ton of filters, too. To see it in action, you can <a href=\"https://app.instawp.io/launch?t=photo-block&amp;d=v2\">spin up a demo site</a></p>\n\n\n\n<p><a href=\"https://wordpress.org/plugins/pibe-parallax-image-block-and-effects/\"><strong>PIBE – Parallax Image Block and Effects</strong></a> by <strong>Emiliano Lorenzi,</strong> also a newcomer to the space! Welcome to you, too! <img alt=\"👋\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f44b.png\" style=\"height: 1em;\" /> His plugin &#8220;allows you to add modern, animated images to your site, whether you want to add depth with parallax, capture your visitors’ attention with hover transitions, or highlight content with stylish overlays.</p>\n\n\n\n<p><strong>Bhargav (Bunty) Bhandari,</strong> WordPress developer author of the <a href=\"https://wordpress.org/plugins/thread-block/\">Thread</a> and <a href=\"https://wordpress.org/plugins/polls-block/\">Polls</a> blocks, has released a new plugin called: <strong><a href=\"https://wordpress.org/plugins/explicit-media-block/\">Explicit Media Block</a></strong>. This block is an image/media block public likes and shareable links, turning your site into an interactive content hub, Instagram like as you so will.</p>\n\n\n\n<p><a href=\"https://wordpress.org/plugins/primekit-blocks/\"><strong>Primekit Blocks</strong></a> by <strong>SupreoX Limited</strong> with contains three blocks. The most intriguing would be for me the Animated Text Block to show for animated text effects for your headings and content. The other two are Call to Action (CTA) block and a Copyright block. </p>\n\n\n\n<p><strong><a href=\"https://wordpress.org/plugins/groundworx-carousel/\">Groundworx Carousel</a></strong> by <a href=\"https://x.com/groundworxdev\"><strong>Johanne Courtright</strong></a>, a longtime WordPress developer and freelancer from the US, published her first plugin in the repository. With the carousel, built with native core blocks,  you can display slides with any inner blocks. Using the Splide.js library it supports responsive options, breakpoint-based layouts, and advanced design controls. On GitHub, Courtright also provides <a href=\"https://github.com/groundworx-dev/groundworx-carousel#example-variations\">instructions and code examples</a> on how to extend the plugin to fit any site&#8217;s needs. </p>\n\n\n\n<p><a href=\"https://wordpress.org/plugins/better-navigation-block-styles/\"><strong>Better Navigation Block Styles</strong></a> by <a href=\"https://x.com/marctv\"><strong>Marc Tönsing</strong></a>. Tönsing aims to refine the native mobile menu with to ensure better spacing, alignment, and readability by injecting Additional CSS. </p>\n\n\n\n<p><a href=\"https://wordpress.org/plugins/ghostlabs-cycle-block-lite/\"><strong>Cycle Block: Lite</strong></a> by <b>Ghos</b><strong>t Labs</strong>, also a newcomer to the WordPress repository, Welcome! <img alt=\"🎉\" class=\"wp-smiley\" src=\"https://s.w.org/images/core/emoji/15.1.0/72x72/1f389.png\" style=\"height: 1em;\" /> The team&#8217;s first plugin enables user to display different content for each page load. You can rotate headlines, and create randomized call-to-actions. The description and screenshot offer more use cases where this plugin might be helpful.  On their website you find a few more plugins: City blocks for location-based content and Ghostwriter block, using AI for content creation. </p>\n\n\n\n<p><strong><a href=\"https://wordpress.org/plugins/wpmozo-blocks-and-addons/\">WPMozo Blocks and Addons</a></strong> by <a href=\"https://elicus.com/about-us/\"><strong>Elicus</strong></a> provides plenty of Custom blocks to use, a few sliders, a flip box, tilt image, before-and-after comparisons block. You can see it all in action on <a href=\"https://wpmozoblocks.com/\">the demo site.</a> I found the <a href=\"https://wpmozoblocks.com/interactive-image-card/\">interactive image card</a> to be quite interesting. The <a href=\"https://wpmozoblocks.com/separator/\">Separator block</a> is probably one I would use if I had to spruce up a wall of text or so. </p>\n\n\n\n<p>Which reminds me: On the WordPress Developer blog, <strong>Justin Tadlock</strong> wrote a tutorial about <a href=\"https://developer.wordpress.org/news/2023/07/beyond-block-styles-part-2-building-a-custom-style-for-the-separator-block/\"><strong>Building a custom style for the Separator block</strong></a>, just in case you are tempted to get into block style building without creating a Custom block. </p>\n\n\n\n<p>That&#8217;s it for now. Please keep in mind that I don&#8217;t have any aspiration to be comprehensive when curating plugins. I would also be delighted, if you want to <a href=\"mailto:pauli@gutenbergtimes.com\">email me</a> asking me to check out your plugin. </p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n<section class=\"wp-block-newsletterglue-callout undefined not-color-set\" style=\"border-color: #f9f9e5; border-radius: 22px; border-style: solid; border-width: 0; padding-top: 20px; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; text-align: left; margin-left: 0; margin-right: 0; margin-top: 0px; margin-bottom: 0px; background-color: #f9f9e5;\">\n<p><strong> <a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/\" rel=\"noreferrer noopener\" target=\"_blank\">&#8220;Keeping up with Gutenberg &#8211; Index 2025&#8221;</a> </strong><br />A chronological list of the WordPress Make Blog posts from various teams involved in Gutenberg development: Design, Theme Review Team, Core Editor, Core JS, Core CSS, Test, and Meta team from Jan. 2024 on. Updated by yours truly. The previous years are also available: <strong><strong><a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/keeping-up-with-gutenberg-index-2020/\">2020</a> | <a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/keeping-up-with-gutenberg-index-2021/\">2021</a></strong> | <strong><a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/keeping-up-with-gutenberg-index-2022/\">2022</a></strong></strong> | <strong><a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/gutenberg-index-2023\">2023</a></strong> | <a href=\"https://make.wordpress.org/core/handbook/references/keeping-up-with-gutenberg-index/gutenberg-index-2024/\"><strong>2024</strong></a></p>\n</section>\n\n\n<h2 class=\"wp-block-heading\" id=\"3-building-themes-for-fse-and-word-press\">Building Blocks and Tools for the Block editor.</h2>\n\n\n\n<p><strong>Felix Arntz,</strong> a developer at Google and the author of the <a href=\"https://wordpress.org/plugins/ai-services/\">AI services plugin</a>, has authored a tutorial detailing the process by which individuals can utilize this plugin to create artificial intelligence tools, such as <a href=\"https://felix-arntz.me/blog/writing-a-wordpress-plugin-to-generate-image-alt-text-with-ai-services/#more-1987\">an image alt text generator</a>.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><a href=\"https://bsky.app/profile/2ndkauboy.bsky.social\"><strong>Bernhard Kau</strong></a> published a tutorial on <a href=\"https://kau-boys.com/4107/wordpress/adding-a-custom-panel-to-query-monitor\"><strong>how to add a custom panel to Query Monitor</strong></a>. Query Monitor should be in every WordPress developer toolbox, and how to customize it is a very useful skill to have. <br /></p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p class=\"has-small-font-size\">In last week&#8217;s live stream, <strong>Jonathan Bossenger</strong> explored <a href=\"https://www.youtube.com/watch?v=AwxE-R7OsVU\"> how to use the Feature API</a>. He figured out how to hook up Woo&#8217;s LMS, Sensei and register its lessons as tools. Then he instructed an AI agent to create a lesson from a markdown file. </p>\n\n\n\n<p class=\"has-normal-font-size\">Automattic introduced a<a href=\"https://github.com/Automattic/wp-feature-api\"> new Feature API</a> for WordPress. It allows AI agent tools to interact with sites in more structured ways—unlocking new possibilities for plugins and automation.</p>\n\n\n\n<p class=\"has-small-font-size\"><strong>Jamie Marsland</strong> posted on LinkedIn, why that&#8217;s important: <a href=\"https://www.linkedin.com/pulse/wordpress-sitting-goldmine-feature-api-just-dug-first-jamie-marsland-3sije/?trackingId=qVLCTVZZSniPqxIiHZRpdQ%3D%3D\"><strong>WordPress Is Sitting on a Goldmine — And the Feature API Just Dug the First Tunnel</strong></a></p>\n\n\n<div class=\"wp-block-newsletterglue-showhide ng-block\" width=\"100%\">\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n\n</div></figure>\n</div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n\n<p><strong>Nick Diego</strong> has tested the latest Studio v 1.5.1, the new local development app by WordPress.com, release and wrote a tutorial on how to use the new features: <a href=\"https://wordpress.com/blog/2025/05/12/preferences-studio/\"><strong>Customize Your WordPress Development Workflow: New Preferences in Studio</strong></a>. I made Studio my only local development tool installed.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n<section class=\"wp-block-newsletterglue-callout undefined not-color-set\" style=\"border-color: #eeeeee; border-radius: 26px; border-style: solid; border-width: 0; padding-top: 20px; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; text-align: left; margin-left: 0; margin-right: 0; margin-top: 0px; margin-bottom: 0px; background-color: #f3efe9;\">\n<p><strong><a href=\"https://gutenbergtimes.com/need-a-zip-from-master/\">Need a plugin .zip from Gutenberg&#8217;s master branch?</a></strong><br />Gutenberg Times provides daily build for testing and review. </p>\n\n\n\n<p>Now also available via <a href=\"https://playground.wordpress.net/?blueprint-url=https://gutenbergtimes.com/wp-content/uploads/2020/11/playnightly.json\">WordPress Playground</a>. There is no need for a test site locally or on a server. Have you been using it? <a href=\"mailto:pauli@gutenbergtimes.com\">Email me </a>with your experience</p>\n\n\n\n<p><img alt=\"GitHub all releases\" src=\"https://img.shields.io/github/downloads/bph/gutenberg/total?style=for-the-badge\" /></p>\n</section>\n\n\n<p class=\"has-text-align-center has-small-font-size\"><em>Questions? Suggestions? Ideas? </em><br /><em>Don&#8217;t hesitate to send <a href=\"mailto:pauli@gutenbergtimes.com\">them via email</a> or</em><br /><em> send me a message on WordPress Slack or Twitter @bph</em>.</p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" />\n\n\n\n<p class=\"has-text-align-center has-small-font-size\">For questions to be answered on the <a href=\"http://gutenbergtimes.com/podcast\">Gutenberg Changelog</a>, <br />send them to <a href=\"mailto:changelog@gutenbergtimes.com\">changelog@gutenbergtimes.com</a></p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" />\n\n\n<section class=\"wp-block-newsletterglue-group\" style=\"padding-top: 10px; padding-bottom: 10px; padding-left: 20px; padding-right: 20px; margin-top: 0px; margin-bottom: 0px;\">\n<p>Featured Image: Photo by Fran Jacquier on Unsplash</p>\n\n\n\n<hr class=\"wp-block-separator has-css-opacity is-style-wide\" />\n\n\n\n<p class=\"has-text-align-left\"><strong>Don&#8217;t want to miss the next Weekend Edition? </strong></p>\n\n\n<form action=\"https://gutenbergtimes.com/feed/\" autocomplete=\"on\" class=\"wp-block-newsletterglue-form ngl-form ngl-portrait\" method=\"post\"><div class=\"ngl-form-container\"><div class=\"ngl-form-field\" style=\"margin-bottom: 25px;\"><label class=\"ngl-form-label\" for=\"ngl_email\"><br />Type in your Email address to subscribe.</label><div class=\"ngl-form-input\"><input autocomplete=\"email\" class=\"ngl-form-input-text\" id=\"ngl_email\" name=\"ngl_email\" required=\"required\" style=\"border-radius: 21px;\" type=\"email\" /></div></div><button class=\"ngl-form-button\" style=\"background-color: #005075; border-color: #005075; border-width: 1px; border-style: solid; color: #ffffff; border-radius: 21px;\" type=\"submit\">Subscribe</button><p class=\"ngl-form-text\">We hate spam, too, and won&#8217;t give your email address to anyone <br />except Mailchimp to send out our Weekend Edition</p></div><div class=\"ngl-message-overlay\"><div class=\"ngl-message-svg-wrap\"><svg fill=\"none\" height=\"24\" stroke=\"#fff\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><polyline points=\"20 6 9 17 4 12\"></polyline></svg></div><div class=\"ngl-message-overlay-text\">Thanks for subscribing.</div></div><input id=\"ngl_list_id\" name=\"ngl_list_id\" type=\"hidden\" value=\"26f81bd8ae\" /><input id=\"ngl_double_optin\" name=\"ngl_double_optin\" type=\"hidden\" value=\"yes\" /></form>\n\n\n<hr class=\"wp-block-separator has-css-opacity is-style-wide\" />\n</section>\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}s:7:\"pubDate\";a:1:{i:0;a:5:{s:4:\"data\";s:31:\"Sat, 17 May 2025 05:55:22 +0000\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}s:32:\"http://purl.org/dc/elements/1.1/\";a:1:{s:7:\"creator\";a:1:{i:0;a:5:{s:4:\"data\";s:18:\"Birgit Pauli-Haack\";s:7:\"attribs\";a:0:{}s:8:\"xml_base\";s:0:\"\";s:17:\"xml_base_explicit\";b:0;s:8:\"xml_lang\";s:0:\"\";}}}}}}}}}}}}}}}}s:4:\"type\";i:128;s:7:\"headers\";O:48:\"WpOrg\\Requests\\Utility\\CaseInsensitiveDictionary\":1:{s:7:\"\0*\0data\";a:9:{s:6:\"server\";s:5:\"nginx\";s:4:\"date\";s:29:\"Fri, 13 Jun 2025 11:43:08 GMT\";s:12:\"content-type\";s:8:\"text/xml\";s:13:\"last-modified\";s:29:\"Fri, 13 Jun 2025 11:30:18 GMT\";s:4:\"vary\";s:15:\"Accept-Encoding\";s:15:\"x-frame-options\";s:10:\"SAMEORIGIN\";s:16:\"content-encoding\";s:2:\"br\";s:7:\"alt-svc\";s:19:\"h3=\":443\"; ma=86400\";s:4:\"x-nc\";s:9:\"HIT ord 2\";}}s:5:\"build\";s:14:\"20230522125458\";}','no'),(3320,'_transient_timeout_feed_mod_d117b5738fbd35bd8c0391cda1f2b5d9','1749858189','no'),(3321,'_transient_feed_mod_d117b5738fbd35bd8c0391cda1f2b5d9','1749814989','no'),(3322,'_transient_timeout_dash_v2_88ae138922fe95674369b1cb3d215a2b','1749858189','no'),(3323,'_transient_dash_v2_88ae138922fe95674369b1cb3d215a2b','<div class=\"rss-widget\"><ul><li><a class=\'rsswidget\' href=\'https://wordpress.org/news/2025/06/wceu-2025-a-community-celebration-in-the-swiss-sun/\'>WCEU 2025: A Community Celebration in the Swiss Sun</a></li><li><a class=\'rsswidget\' href=\'https://wordpress.org/news/2025/05/announcing-the-formation-of-the-wordpress-ai-team/\'>Announcing the Formation of the WordPress AI Team</a></li></ul></div><div class=\"rss-widget\"><ul><li><a class=\'rsswidget\' href=\'https://blog.gravatar.com/2025/06/12/vibe-better-with-custom-llm-instructions/\'>Gravatar: Vibe Better With Custom LLM Instructions</a></li><li><a class=\'rsswidget\' href=\'https://blog.gravatar.com/2025/06/12/professional-headshot-tips/\'>Gravatar: 10 Essential Tips for DIY Professional Headshots</a></li><li><a class=\'rsswidget\' href=\'https://ma.tt/2025/06/clay/\'>Matt: Play With Clay</a></li></ul></div>','no'),(3324,'_site_transient_timeout_wp_remote_block_patterns_674068de1407634310e5f304d042616b','1749818692','no');
