Page Performance Issues

Foundry
1

I’m using RWC, Foundry v2 Theme, no special fonts, mostly Webp images, and very little other stacks. My Google Search Console shows 65 indexed pages, with ZERO page experience. Every page has large LCP’s, Layout shifts, and Cache isn’t served efficiently.

Not sure what happened, back in April I had great Seach Console numbers. I’ve been working on Foundry3 re-build, but time has been tight.

Trying to tweek my F2 to get back in the game and I’m COMPLETELY bamboozled. I’ve tried deleting info, changing whatever and now I just need some guidance.

Website: customdrains.com (most tweeked page: Stainless Products | Drains - Traps - Cleanouts) and it give me BAD performance numbers.

The page loads fast ( I think), but it’s telling me a lot of page shifts, a lot of chaining “critical request”, etc. etc.

Would anyone be interested in taking a look and give me some direction ??

I’m finding that all of this is going way beyond my pay grade !! I started of with MS Frontpage, then migrated to Rapidweaver in 2014. However, it’s getting more complicated OR I’m trying to make it more complicated than it should be.

Copied from Pagespeed Insights:
0–4950–8990–100

[image]

METRICSExpand view

First Contentful Paint

2.4 s

Largest Contentful Paint

3.4 s
Element
Stainless Products Drains - Traps - Cleanouts

Phase % of LCP Timing
TTFB 19% 650 ms
Load Delay 0% 0 ms
Load Time 0% 0 ms
Render Delay 81% 2,790 ms

Total Blocking Time

310 ms

Cumulative Layout Shift

0.432

Speed Index

2.7 s

  • Captured at Aug 1, 2023, 3:45 PM EDT
  • Emulated Moto G Power with Lighthouse 10.3.0
  • Single page load
  • Initial page load
  • Slow 4G throttling
  • Using HeadlessChromium 114.0.5735.179 with lr
2

Google seems to be heavily weighting page shifts these days. You can use the “Performance” tab in the dev tools of the Chrome browser to get more insight into the layout shifts on a page.

I looked at the page you indicated is your most heavily tweaked and it appears that your logo image is causing the biggest layout shift, so I’d start by fixing that. It looks like you’re using a Fluid Image stack for the image. It’s got a width set to “792”, but not a height. Because the browser doesn’t know both the height and width, it can’t determine how much vertical space to reserve for the image while it’s loading, so it has to load the image and adjust the page’s content after, which causes the layout shift by moving content down the page. I don’t know what setting are available in that stack, but you should set the width and height of the image in it.

Unfortunately, it can take a lot of trial and error to track down issues like this and you often need to fix, test and fix until you get to a point that it’s good enough.

3

Thanx DLH. I’ve changed the Fluid Image stack to the Weavers Space Starter Pack - Image to include height. Works a little better, but more items showing up.

Trying to utilize the KISS method, but it ain’t working so easy.

Ugh…