EP05 – Does google think your WordPress site is slow?

Jason Tucker: [00:00:00] This is episode number five of dev branch. Does Google think your WordPress site is slow, brought to you by our friends over at silver press. They make local WordPress development, easy. Check them out  over at serverpress.com. And the query, our new show on WPwatercooler Network hosted by our own. Jason Cosper ask him a question on the query.

@JasonTucker on Twitter. My website is JasonTucker.blog.

Steve Zehngut: [00:00:27] Steve Zehngut

I’m the founder of Zeek interactive and I run the OC WordPress Meetup

Sé Reed: [00:00:35] I’m Sé Reed and I’m Sereedmedia on all the things.

Russell Aaron: [00:00:38] my name is Russell Aaron. I do things with WordPress in Las Vegas.

Jason Cosper: [00:00:42] It’s Jason Cosper AKA Fat Mullenweg.

Jason Tucker: [00:00:47] Help us out over on Patreon. Go to WPwatercooler’s patron Page at patreon.com/wpwatercooler

and subscribed to this content on YouTube  and  ring the bell. We’d appreciate it.

We’ll be talking about, website performance, speed performances, dealing with front end and back end performance. And just kind of all of, all of those.

Ooh. Alright. . It’s still open about that. as always wins when, whenever we’re talking about this sort of stuff, you

Russell Aaron: [00:01:20] know, we have Cassper who

Jason Tucker: [00:01:21] is a, he’s,

Steve Zehngut: [00:01:24] he’s great at, at,

Jason Tucker: [00:01:26] you know, Server performance in dealing with server stuff and making sure that all of those things are working well.

Jason Cosper: [00:01:31] And

Jason Tucker: [00:01:31] then.

Jacob takes care of all of like front end web development stuff. And so it’s like between those two folks,

Russell Aaron: [00:01:40] you know, we bring me yo, yo, yo, yo, yo, yo say that some stuff I do some stuff. Come on. Yo.

Steve Zehngut: [00:01:45] I’m just, I’m just the eye candy.

Russell Aaron: [00:01:48] I mean, that’s true. That’s very true. That’s very true.

Jason Tucker: [00:01:53] So let’s talk a little bit about, you know, does Google think your website is slow?

Steve Zehngut: [00:01:57] And I

Jason Tucker: [00:01:57] think it’s knew where to run.

Steve Zehngut: [00:02:01] It’s rhetorical say rhetorical,

Jason Tucker: [00:02:03] if you were to run your website through that, what, how, how, you know, would it be slow and most of the time yeah, it is slow. And it’s also

Steve Zehngut: [00:02:10] like really. Bad. Right. Let’s start by talking about the, that, that you’re running it through. Cause you said if you’re running it through there, so there’s, there are several metrics tools that you can use to measure your

Russell Aaron: [00:02:22] website, right?

Yeah.

Steve Zehngut: [00:02:25] the, the, the, that can be a couple of different things, right? We use, we use, Google page speed, Google page speed insights. We use web.dev.

We use GT

metrics and then built right into your browser into Chrome. At least there’s a lighthouse measuring tool in the, in the dev tools. So, anybody else using any other measuring sticks for,

Jason Cosper: [00:02:47] I can’t talk about that as this is a family show.

However,

Jason Tucker: [00:02:51] it’s not a family show at this point, bro.

Russell Aaron: [00:02:54] minor. All negative numbers. Am I doing something wrong?

Jason Cosper: [00:03:00] no. So, White house is also available for Firefox now. Yep. That is something that if you’re not all tied up in the Google ecosystem, and I know that, plenty of people are using Chrome nowadays. Like it’s, it’s the. The dominant browser, but as someone who uses Firefox, I appreciate having that available.

I like using a webpage test@webpagetest.org. they have a ton of different metrics. They run white house tests. people, tend to lean on GT metrics, which, uses some outdated stuff. Like why slow in their measurements? why slow is a tool that’s been abandoned for? Several years now, but they’re still touting it.

And people are still using those metrics as something that they should like do to optimize their site

Steve Zehngut: [00:03:58] a little, by the way, it’s still the best name out of all of these measuring tools.

Jason Cosper: [00:04:02] Absolutely.

Russell Aaron: [00:04:04] I mean, I mean,

Jacob Arriola: [00:04:06] automated. so, you know, as part of your continuing integration, every time you do a deploy, you can trigger a lighthouse, tasks as well.

Russell Aaron: [00:04:17] I mean, th th there’s also things to think about too. Like the, the technology itself is abandoned, but I mean, it’s still good recommendations when it says use the CDN, you know, don’t forget to expire headers. I mean, it’s still good advice. It’s just, you know, not the thing that you should be benchmarking against.

Jason Cosper: [00:04:35] Alright.

Jason Tucker: [00:04:38] That’s it.

So what things are, what things are these tools planning about? Like what is it the, is it because the images are too big? Is it because we installed every plugin that has every version of jQuery installed?

Russell Aaron: [00:04:53] Yes.

Sé Reed: [00:04:55] Google suddenly hates every image version except for the one that’s like the brand new one.

What is it?

Russell Aaron: [00:05:00] What would it be? Well, Pete, where

Sé Reed: [00:05:04] literally nothing exists except that. Thanks.

Jason Cosper: [00:05:07] Cool.

Jason Tucker: [00:05:08] The maca doesn’t even open web P it’s like, what am I supposed to do with this thing?

Russell Aaron: [00:05:14] We had him out. GIF is just gone. Now. Gift no longer matters. It doesn’t matter the name. It’s all about wimpy now.

Steve Zehngut: [00:05:22] So Jason, where

Sé Reed: [00:05:23] are they?

Reports?

Steve Zehngut: [00:05:26] Those reports can be daunting. They can be confusing. They can be overwhelming. There’s a lot of information in those reports. and some of it’s relevant, some of it’s not. but, but you know, it is important to understand what those things are.

Russell Aaron: [00:05:41] So when you go for Jacob, when you’re.

Jacob Arriola: [00:05:47] I think too, like the thing to point out as, yeah, as soon as what March or June, then you web vitals metric was introduced by Google.

If you’re not sure what that is pretty much is, is the way that Google kind of changed the way that they measure performance. in determining whether, you know, your site is faster, slow. but you can think about it in three different ways. Like. How long does it take your, your site, your page to load how easy it is to interact and how much does it really move around?

so those are measured by things called least largest Contentful paint. that’s a buzzword, so largest Contentful paint, pretty much measures. How long does it take, you know, for the biggest thing in the viewport to render on the page. And that could be something like an image, a video, an iframe, a text note, like an H one or something like that.

yeah, the

Russell Aaron: [00:06:37] first load forever.

Sé Reed: [00:06:38] Those H ones.

Russell Aaron: [00:06:40] Yeah. Okay. Especially if they’re styled is their style, just get out of here. Huh?

Jacob Arriola: [00:06:46] The thing the thing is, yeah. The thing about largest paint is, is like a really common design pattern. The last. The years has been that typical hero, right? At the top of the page, we’ve got a big background image. and what we’ve noticed is a lot of our clients is that’s, you know, becoming, an impact to the largest Contentful pain.

So as soon as that happened, a lot of our clients came back to us like, Hey, all of a sudden, my, you know, my lighthouse performance was in the eighties. Now it’s in the sixties, like what happened overnight and you know, more often than, okay.

Steve Zehngut: [00:07:19] And if you, well, if you. If you have, if you, if you have clients that are complaining about this, this happened across the board to everybody.

So Google turned on this metric right at the end of may, early June. And so any most websites just got themed immediately. Once this metric

Jacob Arriola: [00:07:36] was turned off for nothing,

Steve Zehngut: [00:07:38] making no changes.

Sé Reed: [00:07:40] I had a friend who was doing, like they had some business model that was based off of, I don’t even, I didn’t follow the whole thing, but they literally were like, well, Google just took that entire business model away and may close the business.

They were just like launching it. And then they were like, just kidding. Google destroyed that pretty great.

Steve Zehngut: [00:07:58] Yeah, Jacob pointed out to me, right at that same time, a New York times actually changed their design in response to that by, by taking their articles and moving the feature image below the fold.

Jacob Arriola: [00:08:09] So that largest Contentful

Steve Zehngut: [00:08:10] paint only judges what’s above, like above the fold on the first scroll.

Russell Aaron: [00:08:15] See what they did is

Steve Zehngut: [00:08:16] yeah. In the viewport. So they took their, their feature image, which was at the top and just moved it down the page. To get around that LCP score.

Sé Reed: [00:08:26] I had that conversation. I’m working with two, well, three clients on new sites that they’re going to be doing. And I’m, I’m saying they’re all like, Oh, we want the big image.

And I was like, well, actually you don’t anymore. And you’re going to be a hundred. But the curve, because in about a year or two, you’re going to see the design shift. Like you’re going to see Google leading this design shift away from that. And it won’t happen right away because it always, there’s a trickle down effect where it takes a while to get to people.

But we’re going to start to see that across the board where the design is going to change, and it’s no longer going to be that. Big thing. That’s also not accessible in a lot of cases. Like the big thing with the, the text and the opaque or the opacity. So it’s basically going away. I’m excited to see what the next design thing led by.

Google’s.

Russell Aaron: [00:09:14] And

Steve Zehngut: [00:09:15] we’re just, we’re just heading, everything’s going to be Amtrak,

I

Jacob Arriola: [00:09:19] think too, like, like, you know, the single, you know, the single post page, I think

Russell Aaron: [00:09:23] it’s just

Jacob Arriola: [00:09:23] been the defacto where you’ve got the featured image and then title. And I think designers and developers were both at fault for just defaulting to that when we’re building things. Right. And like, if we start to think about like, Yeah.

If we, if we, if we start to think about like, what’s the value proposition of that featured image of being at the top, like. I mean, does it really offer that much? you know, can we just

Russell Aaron: [00:09:49] put it, some pictures are worth a thousand words, you know?

Sé Reed: [00:09:52] I mean, that’s the Instagram of the web, you know what I mean?

It’s like following that Instagram first, like

Russell Aaron: [00:10:00] we put all the images.

Sé Reed: [00:10:01] Yeah. Like even on Instagram, we put all the text in images.

Russell Aaron: [00:10:05] Interesting that you say that because Facebook does the opposite, it goes. It goes texts, whatever. And then it puts your, your media below. That’s very interesting that same company, but they offer two different ways on different platforms.

It’s very interesting. Say, isn’t that what Twitter does to Twitter, loads of content and then media and everything. Both very interesting. Wow.

Jacob Arriola: [00:10:25] So Elsie LCP has been a big conversation internally, you know, Julie. Making our clients sites faster, but the other metric is the first input delay metric on web vitals.

And that, that measures, how long does it take for my site or my application to become interactive, meaning my sites there. And I’m pressing a button, but will the site respond to that button? Click, add to cart, whatever.

Sé Reed: [00:10:50] Click, click, click, click, click. Yeah, we’ll respond

Steve Zehngut: [00:10:53] to that

Russell Aaron: [00:10:55] basically.

Jacob Arriola: [00:10:57] And so it’s important because as a user, that’s frustrating, you see a button there, you want to click on it, you want to press on it and nothing’s happening.

You’ll get frustrated. So that’s, that’s the other metric that, Impacts your score, as well as that first

Russell Aaron: [00:11:09] know stuff like that comes in. I immediately think of style and Z indexing and something’s below something and you have a div over top, or maybe there’s a, you know, but there’s also maybe the asset that JavaScript that controls that.

Isn’t loaded yet, you know? So, so there there’s other facets too, you know, it’s not just is the button missing or can I see it? It’s, you know, everything it takes to make that button work, you know, that’s got to load quickly and that’s one of the biggest things that I can’t stress enough when we talk about page speed is cash is great.

Cash is just, you know, throwing up this, this blanket really quick, kind of like throwing up a poster, but you want your server we’re on the backend to be caching objects. So queries and stuff like that. You want it to be doing that. But those two don’t mean anything. If you’re loading 10,000 JavaScript files on the head or you’re loading 19 different CSS styles.

And so, you know, these plugins like a WP rock and stuff, they’re, they’re wonderful, but they’re not a one stop solution because they don’t. They can’t determine should this script be loading on this page, should this script learning on this page? So, you know, when we talk about optimization and speed and why scores matter, it’s because you might be running the latest, greatest, best version of, but you’re still missing this thing because you’re saying.

So loading this Dasha Khan style sheet, that doesn’t mean anything, or you’re still loading this JavaScript. That’s only used on your about page. And you know, these tools can help you identify stuff like this. And this is a common thing that we see in the WordPress community when it comes to support, which is how do I speed at my site?

Why is this taking forever and, and you know, what, what are we going to do to fix it? You know? And, and all the articles in the world can’t point out more than enough. There’s a lot of things here,

Steve Zehngut: [00:12:58] what we’re going to do to fix it, but I’ll

Russell Aaron: [00:12:59] go ahead and Wikipedia.

Sé Reed: [00:13:00] And then we like, no, just kidding.

Jacob Arriola: [00:13:03] I think two’s, you know, dealing, you know, bringing this back into WordPress, you know, sometimes you don’t have control of. These assets coming in. Right? So if you have a plugin or a series of plugins that bring in their own

Russell Aaron: [00:13:15] analytics,

Jacob Arriola: [00:13:16] analytics, or JavaScript or library, bring it in. Yeah. Maybe they’re bringing in font awesome or

Russell Aaron: [00:13:23] whatever.

Yeah,

Jacob Arriola: [00:13:25] so you can do everything you can, but again, you’re limited. Go ahead.

Jason Cosper: [00:13:30] I was going to say that there’s been a lot of talk. No, it’s no problem. there’s been a lot of talk around, how, developers are going to kind of keep their foothold in a post Gutenberg world. Where people can kind of construct their own sites.

Conveniently. I think that that site optimization and helping people understand, how to optimize their site is, is a good Avenue for people to start exploring if they want to still have it. Yeah. The, the, the site builder. Who who basically, you know, we’ll take a theme and, and throw it together who aren’t as, as deeply technical as some developers are.

it might be a good idea to start looking into, optimizing and learning, site performance, you know, standards to, to kind of, secure. Your paycheck a

Russell Aaron: [00:14:29] little bit. And if he keeps, you know, having vulnerability is all the time, you know, like you’re, you’re, you’re not going to be using Devi anymore.

You might be using Gutenberg with, with the way that things might be going. So understanding how WordPress core and Gutenberg works and speeding that up can really help doing things like Ella mentor and, and, you know, things down the road. So that’s very interesting that you bring that up, that, that, that, like you can, you can offer this service now speed optimization is the thing you could always offer, but you could just have an optimization shop and that’s all that you do.

That’s, that’s very interesting.

Jacob Arriola: [00:15:07] So, so one of,

Steve Zehngut: [00:15:08] one of the things that,

Russell Aaron: [00:15:10] shots I’m going to call it op shop

Steve Zehngut: [00:15:13] one of the things though. One of the things that a page builder introduces, whatever, no matter what page builder you’re using elemental or BeaverBuilder, it doesn’t matter. all those page builders introduced a page density, right.

And, and an increase in page density. So the amount of HTML that those page builders. W

Jacob Arriola: [00:15:31] create,

Steve Zehngut: [00:15:32] does have a, an impact on your page speed score. Right? And so one of the things that we do is, is, you know, a lot of those sites that we we’re kind of moving away from, page builders, by using, you know, much slimmer frameworks, like a tailwind CSS, we’re purging the CSS to make sure that the CSS is as small as possible.

And all those things are important because we, we mentioned third-party scripts, you know, the third party scripts. I’m in third party or excuse me,

Jacob Arriola: [00:15:58] external CSS,

Steve Zehngut: [00:15:59] those all affect that page speed score.

Russell Aaron: [00:16:01] So, so when, when you’re looking on GT metrics and it shows you like your page speed, and it says 1.8 and then it shows you the size of the page.

And it says like 350 kilobytes, and then it says requests and it says 80 that’s like you’re requesting 80 different things of JavaScript CSS. A gift, whatever it is, all these images that’s yeah. Sandwich, corn, dog, whatever, you know, your, your, your, your ketchup napkins are over there anyways. You’re, you’re, you’re asking all these things to load it.

And I think what Steve is saying is, you know, by default you load these page builders, you’ve got 15 just out of the box. And, and, you know, it’s your job to look at those and is this effectively what we want to do? Or is this leaving a big footprint?

Steve Zehngut: [00:16:50] So there’s, there is a way to resolve these tough. And one of the ways to, sorry, my audio just cut out one of the ways to, or one of the other things to think about.

Cause we, we mentioned third-party scripts, we mentioned plugins and, and the kind of third party, scripts that, those, those, add. One or the other, I’m going to call it dangerous tools that you can add to your website is Google tag manager, right? It’s a Google, Google tag manager,

Russell Aaron: [00:17:15] right. Of tag manager.

Steve Zehngut: [00:17:16] No,

Russell Aaron: [00:17:17] I do not. Okay. I

Steve Zehngut: [00:17:19] do not. And I’ll tell you why. Right? Like manager is the purpose of it is to sort of standardize your tags, have your, all your tags in one place, make it easy to add and edit tags that are on your website. Problem with it is Google tag manager in the hands of, of somebody who does not understand what those terms mean can be very dangerous and very,

Jacob Arriola: [00:17:38] yeah.

A serious

Steve Zehngut: [00:17:39] impact on your, on your page speed score. So if you’re, if you’re giving it, you’re adding Google tag manager and your client, it is adding the tags themselves. that’s problematic. And what we find is yeah, when there were inheriting slow sites, one of the first places we look is Google tag manager,

Jacob Arriola: [00:17:56] and

Steve Zehngut: [00:17:56] typical we’ll find,

Russell Aaron: [00:17:57] you know,

Jacob Arriola: [00:17:58] 2030, 50, a

Steve Zehngut: [00:18:00] hundred tags that have been added to Google tag manager and not maintained.

Russell Aaron: [00:18:04] Right. So snow. So they’re just firing on page because they met some kind of thing and it’s not even being used properly. How does

Sé Reed: [00:18:12] Google, Google tag manager? It’s just like the keyword stuffing of now. Like what is even like, I, I’ve not seen it.

Russell Aaron: [00:18:19] Totally. Yeah. We use tag manager at the Plaza. So what we do is we have a.

CMS that, all of, well, yeah, all of our emails and stuff. So like when something loads, that’s how we’re handling cookies and that’s how we’re handling tracking and tag manager. I’m sorry, since that’s how we get like all that kind of stuff, but we also take data from there and that’s how we’re using tag manager to send analytic data, to track e-commerce cells.

Like, you know, we can look in there and I have a lot of different scripts that are running. Collect JavaScript variables and do things like that. So it is effective, but like Steve saying, if that, if you have one variable that’s wrong on that, it slows down the entire site,

Jacob Arriola: [00:19:02] the

Steve Zehngut: [00:19:02] difference, right. Says, you know what you’re doing,

Russell Aaron: [00:19:04] right.

Yeah. Thank you for saying that, but you do not have it on video, but,

Steve Zehngut: [00:19:09] but you do know what you’re doing. And so what we find is, is a lot of times people will. Just add a whole bunch of tags and tag manager, right? Replace them with something else. Like an add tag, maybe they’ll put one ad network in they’re now going to replace it with a different ad network, or maybe they’re putting in a different tracking script or, or different form or something else.

And they don’t remove the old tags when they’re not using.

Russell Aaron: [00:19:29] That’s the worst or when you like migrate, like, Hey, we’re using, you know, male champion. Now we’re going to go to this other thing. Now, did I get all the scripts off of here? Like, you know, that whole process of migration, Justin in tag manager alone sucks.

And like Steve was saying, if you’re not using it right. You know, you can embed it all you want, but you know, it’s slowing down that first time, the first bite it’s impacting that, that first thing that Jacob was saying, I mean, like everything. Yeah, everything here kind of goes together. And this all comes back to when you’re loading a page on your site, you want the minimum stuff required.

Sé Reed: [00:20:10] I have a question about that last content content

Jacob Arriola: [00:20:15] content,

Sé Reed: [00:20:17] which really sounds like largest content, full pain. I don’t know if anyone else hears that

Russell Aaron: [00:20:21] every time. That’s what I hear.

Sé Reed: [00:20:24] So if you’re loading background images, Any, any tips on like lazy loading those or like you can’t really lazy load those, but what’s the

Steve Zehngut: [00:20:36] lazy load has no effect on SEP.

Russell Aaron: [00:20:38] Yeah, I

Sé Reed: [00:20:38] know. Well, I mean, I mean, well, it’s not on the screen, so

Russell Aaron: [00:20:42] it doesn’t matter.

Steve Zehngut: [00:20:43] And you still, even if you’re lazy load, you still, you cannot affect that LCP.

Russell Aaron: [00:20:48] Not

Sé Reed: [00:20:48] it’s not on the screen, so it doesn’t matter, but it’s great. Like you’re not scrolling to it. So it has it doesn’t, it’s not counted

Russell Aaron: [00:20:54] in that metric.

If the image is in the viewport, you can’t, you can’t lazy load that. And I, I, you know, so that that’s not gonna

Sé Reed: [00:21:03] help there some form of that for background images,

Russell Aaron: [00:21:07] Jacob chalk,

Sé Reed: [00:21:10] I’m asking

Russell Aaron: [00:21:11] you to take, go, Jacob, go.

Jacob Arriola: [00:21:14] So are you asking, can you lazy load a background image?

Sé Reed: [00:21:17] Well, not busy load I’m lazy load. So like, is there a way to like, Like I still have background images that would, basically not impact that.

Russell Aaron: [00:21:28] So you prioritize

Jacob Arriola: [00:21:29] what we sound like, what? Well, we noticed that we didn’t find any solutions for that. So on the Zeke homepage, we had the typical hero background image with text overlaid, with the tagline. Right. Very common. and so the solution that we came up with was to use a base 64, inline SVG pattern, right.

A really small one. And just repeat it. Right. Repeat it. You’re only

Sé Reed: [00:21:54] loading a tiny little, little thing yourself. Yeah.

Jacob Arriola: [00:21:56] And because it’s, it’s base 64, the browser painted itself, it doesn’t make an HTTP request out to a CDN or something like that. Right. So that instead of, you know, a background image, which is secondary, right.

That the main, the main focus of that element is the copy. so the, the background image is secondary. So we just replaced a, I think we had Steve, right? Like some kind of like a.

Steve Zehngut: [00:22:20] A

Jacob Arriola: [00:22:20] mobile device with someone writing for me.

Steve Zehngut: [00:22:23] Yeah. Once. Well, I’ll tell you the reason we did it was once that LCP score was introduced, right.

the Zeke site, which we were in the nineties, went down to the seventies. Like we took a 20 point hit just for having a background image.

Sé Reed: [00:22:36] Not the 1990s to clarify. No, it kind of feels like it. Okay. So your solution was no background image, tiny little pixel loading, but what if you, the design, like, what if you really can’t get away from it?

Like, this is like, you know, you’re really like,

Russell Aaron: [00:22:54] I have this off, not just going to fight to have detect. I have this on my homepage now. And so I’m using Gutenberg and I’m using a, the, the cover and I’m using WP rocket to, to handle that. And I have a good web host to help me with that. And it converts to web P I mean, I think you have to do all of those.

That’s. The new minimum, like, like seriously, you have to optimize every, if you need an image in it, you have to optimize the delivery of it or else you’re just going to shoot yourself in the foot.

Jacob Arriola: [00:23:25] Yeah. If there’s no getting around to it, say with, with the designer and maybe, you know, internally with the client, you’re, you’re interacting with that.

It has to be that way. yeah, he’d have to come and go with,

Russell Aaron: [00:23:36] even that I’m looking at my largest Contentful paint and that’s, I have 3.5, I have a score of 91 and all my stuff looks good, but, but that, that image right there is affecting that. So, you know, I might have to go to a small 25 by 25, base 64 code.

Thanks. Thanks for the tip.

Jacob Arriola: [00:23:56] The other, the other metric I want to make sure we talk about is the, Is the layout shifting? it’s called see CLS

Jason Cosper: [00:24:06] layout shift. Yeah.

Russell Aaron: [00:24:07] Cassper yeah. So zero. So

Jacob Arriola: [00:24:10] what that, what that measures is, you know, unexpected layout shift. And actually, even though it has nothing to do with like how long it, which takes to download or your JavaScript that actually impacts your performance score.

And what that means is, you know, it could be anything like a flash of, on style of content, meaning, you know, you ever go to a page and sometimes it’s just like, Pure writes him out. And then the CSS kicks in, right. That the page is moving. or if you have ads, right. Maybe the first, you know, the, the page downloads first and then all of a sudden, an ad comes in and, you know, shifts the page adjusting.

And so those things, even though they may not seem like they have performance implications, Google uses that to measure your sites.

Russell Aaron: [00:24:49] Is that different than like a CSS animation or, or is this saying that okay.

Jacob Arriola: [00:24:54] Okay. That means, that means the page has unexpectedly shifted. Right.

Russell Aaron: [00:24:59] What we expect the page to do is this, and there’s another thing before, after is what you’re saying

Jacob Arriola: [00:25:04] after.

Right.

Russell Aaron: [00:25:05] Okay.

Jacob Arriola: [00:25:06] Think about it as just read enough

Russell Aaron: [00:25:07] to make the bigger,

Jacob Arriola: [00:25:09] like an ad came in, you know, you’re reading a post and all of a sudden an ad came in and like, Wait, where was I, you know, in reading that, or images is a really important thing, because if you don’t provide image, dimensions, meaning width and height attributes to an image, the browser has no way to know what aspect ratio it needs to calculate while it’s painting the browser.

So it’s kind of going to be empty. And then once the image comes in, even if it’s lazy load, it’s like, Oh, this is supposed to be like a 16 by nine ratio. Let me plop it in here. So if you don’t provide with an height attributes, You’re going to get a deemed on your CLS, which is going to ding you on your performance as well.

So CLS isn’t important. It is an important thing to take a look at, even though you may not think that it has, you know, performance implications. Absolutely. Does.

Jason Cosper: [00:25:55] And really, like you said, Jacob, one of the easiest things you can do there is making sure that your images, I have a width and height element to them.

that is, cause I, I don’t know about anybody else, but when you’re on your phone, when you’re just browsing the web and you’re reading an article and something lazy load, something drops in as you’re reading the article and you’re you start reading a sentence and then all of a sudden, the whole article shifts down.

Because they decided to go back in there.

Jacob Arriola: [00:26:26] It sucks

Russell Aaron: [00:26:27] or, or a video or something. Yeah, man,

Jason Cosper: [00:26:30] it’s all good. And Google realizes that that sucks and they’re not wrong. Like, and so, actually having that in place, that’s, that’s a really easy fix to, to take care of that. so you don’t have your, your customers do that and you won’t get impacted by

Jacob Arriola: [00:26:51] totally.

Yeah. Was

Sé Reed: [00:26:52] that the answer to my question?

Jacob Arriola: [00:26:55] The cannot be laid out shift

acronym is, I mean, yeah, the short answer was you have to have it. Yeah. If you have to have it use web P use a really small image

Russell Aaron: [00:27:06] and try to use a smaller image and optimize, optimize, optimize. And even then it doesn’t work.

Steve Zehngut: [00:27:14] People should answer this questions next

Jacob Arriola: [00:27:15] week.

Jason Cosper: [00:27:16] I think we

Sé Reed: [00:27:17] should, the next step branch,

Jason Tucker: [00:27:20] I think we should.

And I think, I think one of the things that we really need to look at is the, the fact that plugins come with all this stuff built in and you have to deal with the repercussions of the things that are built into the plugin.

Russell Aaron: [00:27:32] And how do you manage that?

Jason Tucker: [00:27:34] And if you’re not somebody who’s skilled enough to be able to do this, how do you approach it?

And, and

Jacob Arriola: [00:27:39] even if you are

Jason Tucker: [00:27:40] skilled, you still have to like, worry

Steve Zehngut: [00:27:41] about

Jason Tucker: [00:27:42] plugins and stuff.

Russell Aaron: [00:27:44] Yeah.

Sé Reed: [00:27:47] How do you keep adding plugins to solve the problem? When plugins are adding more problems, more prevalent, more plugging? No problem.

Steve Zehngut: [00:27:55] I think you should tune in next week to find out

Russell Aaron: [00:27:57] you’re like, you’re like, there’s a plugin. I got to sneak up very quickly on this plugin to get it. That’s how you, that’s how you tackle it.

Jason Tucker: [00:28:06] Hey, well, here’s our outro. Thank you very much for listening. We really appreciate it. Talk to y’all.

No, it’s going to be fine. Look, say, and all it’s playing. It’s just, it’s just the video. Look, see, so go check us out.

Yeah, exactly. You can

Russell Aaron: [00:28:20] do that. Hey,

Jason Tucker: [00:28:22] Hey, look, I went, I went the easy way here and I wanted to make sure we weren’t going to be played some crazy music. Talk to y’all later.

Russell Aaron: [00:28:30] Bye.