Our Homepage Went From 14 MB to 1.6 MB. Here’s What Our AI SEO Agent Found.

1. Measure before touching anything

Pull the full Lighthouse JSON from the PageSpeed Insights API. The score is the least useful part of it. The parts that told us where to look:

• lcp-breakdown-insight: which element is the LCP and how long its render delay is. Ours was the homepage H1, held back by render-blocking CSS.
• network-requests sorted by transferSize: the 7.5 MB video and the eight reCAPTCHA copies were the top nine rows.
• bootup-time: CPU time per script. reCAPTCHA 3,412 ms, the theme’s slider script 1,373 ms, Rocket Loader 1,123 ms.
• network-dependency-tree-insight: request chains. This is where the stylesheet → old stylesheet → icon font chain showed up.
• server-response-time: 150 ms. That ruled out the host before anyone spent time in server logs.

Run each page at least twice. Our homepage scored 31 and then 42 on back-to-back runs with nothing changed.

2. Inventory every script, then find where it comes from

Fetch the page as a logged-out visitor (logged-in users skip the page cache and get extra admin assets) and list every <script>, <link> and <style> with its id, source, type and position. Our homepage had 49 scripts. Then trace each one:

• A plugin’s assets live under /wp-content/plugins/<slug>/, so the path names the plugin.
• Code snippet plugins need their code searched directly. WPCode’s admin search only matches snippet titles, so the agent opened each snippet and searched its code for the script’s hostname.
• Scripts with type="text/plain" and a consent attribute are held by the consent manager until a visitor opts in. They still run in Lighthouse if your default is opt-in for US visitors.
• Scripts with a rewritten type like type="9ee35…-text/javascript" are being handled by Cloudflare Rocket Loader.

3. Scan every page on the site

The homepage told us what was heavy. A scan of all 257 sitemap URLs told us where each feature was actually used, which is what makes it safe to remove an asset from the pages that don’t need it. Per page we recorded HTML size, bytes of pasted Figma data, whether a CF7 form, HubSpot form, video, slider or comment form rendered, and every SVG under /uploads/. Then each SVG was checked for an embedded image:

const svg = await fetch(url).then(r => r.text());
const hasRaster = /data:image\/(png|jpe?g|webp)/.test(svg);

4. Strip pasted Figma data

The pasted data sits in attributes like data-buffer="<!--(figma)…" and data-metadata="<!--(figmeta)…". One regular expression removes it from the final HTML on every page:

$html = preg_replace( '/\sdata-(?:buffer|metadata)="(?:&lt;|<)!--\(fig[^"]*"/i', '', $html );

The better long-term habit is pasting into the builder as plain text (Cmd+Shift+V) so the data never gets saved in the first place.

5. Turn photos-in-SVG back into real images

The agent rendered each SVG in a browser canvas at twice its display size and exported it as WebP, then compared every original and converted logo side by side before uploading anything:

const img = new Image();
img.src = URL.createObjectURL(new Blob([svgText], { type: 'image/svg+xml' }));
await img.decode();
const c = document.createElement('canvas');
c.width = w * 2; c.height = h * 2;
c.getContext('2d').drawImage(img, 0, 0, c.width, c.height);
const webp = await new Promise(r => c.toBlob(r, 'image/webp', 0.86));

26 files went from about 3.4 MB to about 430 KB, with transparency kept. A 2× WebP has double the pixel size of the SVG it replaces, so any <img> tag without width and height attributes gets the SVG’s original dimensions added. Every logo was then measured on the live page at the same size as before.

6. Stop videos downloading before play

Set preload="none" and give the video a poster frame. The agent captured each poster from the video itself by seeking two seconds in and drawing the frame to a canvas, about 28 KB each:

<video preload="none" poster="/wp-content/uploads/2026/10/poster.webp" …>

The homepage stopped downloading 7.5 MB on load. The video still starts as soon as someone presses play.

7. Load the form, and its reCAPTCHA, when it’s needed

The HubSpot embed script is removed from the HTML and each hbspt.forms.create() call is wrapped in a queue. A small loader fetches the embed on the visitor’s first scroll, tap or keypress, or straight away if the form is within 400 px of the screen:

var q = window.alHsQ = window.alHsQ || [], go = false;
function load() {
  if (go) return; go = true;
  var s = document.createElement('script');
  s.src = 'https://js-na2.hsforms.net/forms/v2.js';
  s.onload = function () { var f; while ((f = q.shift())) f(); q.push = function (fn) { fn(); }; };
  document.head.appendChild(s);
}
['scroll', 'pointerdown', 'keydown', 'touchstart', 'mousemove'].forEach(function (e) {
  addEventListener(e, load, { passive: true });
});
new IntersectionObserver(function (es) { if (es.some(function (x) { return x.isIntersecting; })) load(); },
  { rootMargin: '400px' }).observe(document.querySelector('#hubspotForm'));

On pages where the form sits near the top, like our call booking page, it still loads right away. The real fix there is the form’s own CAPTCHA setting, which is a spam-versus-speed decision we’re making separately.

8. Remove assets only where they aren’t used

All of the fixes above run in one WordPress output filter. It sees the finished HTML for each logged-out page view, so every removal can check what the page actually contains:

if ( false === strpos( $html, 'class="wpcf7-form' ) ) {
    // no Contact Form 7 form on this page: drop CF7 and its add-ons' CSS and JS
}
if ( ! preg_match( '/<(?:video|audio)\b/i', $html ) ) {
    // no media: drop the MediaElement player
}
if ( false === strpos( $html, 'comment-respond' ) ) {
    // no comment form: drop comment-reply.js
}

Editors and the page builder see the page untouched, and turning the snippet off and clearing the cache undoes everything. Once the dead form embeds were removed from the four old posts, Contact Form 7 and five other unused plugins were switched off entirely.

9. Break the stylesheet chain without changing a pixel

Removing the old imported stylesheet looked tempting. The agent tested it first by comparing the computed style of every element with and without it, and 40 elements changed, including icons on buttons. So it stayed. Instead, the child stylesheet is served without its @import lines and the imported files are linked directly in the same order, so the browser fetches them in parallel and the cascade is identical:

<link rel="stylesheet" id="x-child-stack-css" href="…/pro-child/framework/css/dist/site/stacks/integrity-light.css">
<link rel="stylesheet" id="x-child-css" href="…/uploads/al-speed/pro-child-style-1765176863.css">

The same computed-style comparison on three pages (1,799, 1,157 and 961 elements) found zero differences. Cloudflare Fonts then served the Google Font from our own domain with font-display: swap.

10. Defer every script, keep the order

To retire Rocket Loader we needed our own way to stop scripts blocking the page. External scripts get defer. Inline scripts can’t be deferred directly, so each one becomes a deferred data: URI. Deferred scripts run in document order after the HTML is parsed and before DOMContentLoaded, so jQuery still runs before its plugins, and data a script reads is still defined before that script runs:

// inline script → deferred, same position, same global scope
'<script defer data-cfasync="false" src="data:text/javascript;base64,' . base64_encode( $code ) . '"></script>'

Left alone: JSON-LD, speculation rules, modules, consent-gated tags and the consent manager, which has to run first. data-cfasync="false" tells Rocket Loader to skip each script. The site has no Content-Security-Policy that blocks data: scripts and no document.write, the two things that would have ruled this out.

Two things went wrong in testing, and both are worth knowing before you try this:

• Filter order broke consent gating. Our consent controller also rewrites the HTML on output, turning marketing tags into inert text/plain until a visitor opts in. It recognizes tags by their code. Our deferral ran first, base64-encoded the inline code, and the consent controller no longer recognized it, so on test requests the ad pixel and a retired tracker loaded without consent. The fix was to run deferral in its own output buffer started earlier (WordPress priority -1000, one step before the consent controller’s -999), which makes it the outermost buffer and therefore the last to run. Output buffers unwind from the inside out, so the one you start first runs last. Normal visitors never saw the bug, because it only ran behind a test flag.
• Deferred decoration caused layout shift. Two of our own scripts insert decorative dividers and widgets on DOMContentLoaded. Once everything was deferred, the first paint could land before those inserts, and the logo strip jumped by up to 0.41 CLS. Those two scripts need no library, so they now stay inline at the end of the page and run their handlers immediately, before first paint. CLS dropped to 0.006–0.010, lower than the 0.065 the live site had been showing.

The agent then checked the homepage, About, blog, call page, glossary search, PPC keyword tool and AI query classifier for console errors and working interactions with deferral on.

11. Test like you mean it

• Ship behind a flag. Every change went live first behind a URL parameter, so only test requests saw it. Regular visitors kept the old page until the change was verified.
• Verify logged out. A separate browser with no WordPress login checked console errors, image sizes, the video player and the form on every changed page type.
• Compare fairly. Our host bypasses the page cache for URLs with query strings, so A/B runs used query strings on both sides.
• Use medians. Three or more runs per side, alternating A and B, because single lab runs swung by 20+ points.