Transcript Of This Video

[00:00:00.28]
Okay, so I recently had a client sign up for a service that I recently launched, literally maybe a week and a half ago. It’s called WPSpeedFix. So basically, it’s a service where somebody can come to me with a site that’s just not running as fast as it probably should. And we’ll get the numbers up. We’ll get the Core Web Vitals to where they’re passing, and we’ll get the site performance scores up. And so he came to me with an issue with his membership site. We’ll go over that in a little bit. And what I want to do here in this video is just nerd out with you a little bit on some of the changes that I made, some of the things that I found, and we were able to get his numbers up. And I’m not going to dive real deep into each one. This is not a tutorial. This is just going to be some of the things that I found on his site in the process of fixing up the performance, and some things you might want to consider and look into on yours if you’ve got a similar situation. So let’s get going.

[00:01:00.03]
All right, so this is the website that we optimize. This is how it currently stands now after we’ve done everything. Now, it’s in Spanish. It’s going to be a little harder for me to say, Transform a dos… You could see. Okay, I’m not even going to try. So this was an issue at first. I thought, well, this is going to make things interesting because when I logged into WordPress, everything was in Spanish, and so I had to change my language profile, that type of thing. I don’t usually have to deal with that type of thing, but it is what it is here. He has this chat widget. I did talk to him about it because widgets like this do definitely have a negative impact on site performance, but because he says he does use it to increase his conversions, we decided to leave it. So this was not going to be a site that we were able to get a Perfect 100 on for a few different reasons, because sometimes, and this is one of the things you need to keep in mind when you do performance optimization, is that Perfect 100s are not necessary.

[00:02:00.17]
Sometimes you need to have certain things on there where it’s good for the site, or it’s good for conversions, or something like that. In an ideal world, for speed purposes, you would take it off, but because it does more good than that does harm, we leave it, okay? And you have to take those judgments into account. Now, if we come over to GTmetrix, this is where we started. This was literally the first performance report that I did. We were getting a C, a 68 on performance. You can see that our largest content, full paint, was not in a passing score. The other thing to make note of is if we come down here, our page size was beefy. We were at over six and a half megabytes in size on the homepage. We had just a lot going on here. Now, where we were able to get it to, this is the most recent one. We’ve now got it up to an A. We’re getting a 94 on performance. We’ve got all of our core web vitals that are in the green. And if you pop down here to our page details, we’ve We gave this thing down to 1.69 megabytes.

[00:03:02.23]
So we basically took this thing down almost five megabytes in size, which was just a lot. That has a really massive impact on the performance. Now, there were some things that I’m not able to do. For example, we’re still loading up a fair amount of CSS. There’s some structural things. And at the very end of this performance optimization, I told him that we’re at a point now where we’ve gotten the score pretty good. However, in order to take it further, we would have to make some actual changes to the site that would be noticeable to the public. We would have to actually change some stuff about how the site is put together. We elected not to do that. So we basically kept it where we have it. And so it was a pretty good improvement. So now let’s talk about a little bit of what we actually did. Okay, so this is a pretty simple site on the front-end because we basically have a homepage, and then it is a login, and then everything else is behind the scenes. Basically, he was running 50 plugins at the same time, which is quite a bit, but this is a Buddy Boss membership site.

[00:04:10.11]
So it’s a Buddy Boss site with LearnDash. I think he had Game Oppressive in there. There’s a lot of things going on on this membership site, but almost all of it was behind the scenes. The only part that was out in the public was the homepage that I just showed you. The other thing is that he was on SiteGround. Now, he was concerned about SiteGround, And in fact, because he saw me talking about xCloud, apparently, he actually, at one point, moved the site over to xCloud, wasn’t particularly happy with the situation over there. I think it had more to do with the lack of customer support, which is a thing. I mean, xCloud, they’re beefing up their support. But let’s face it, the target audience of xCloud is not the same as the target audience of SiteGround. And so he ended up putting it back on SiteGround. So one thing I will mention is that SiteGround is a good solid host. Their performance is really good. One thing I noticed when I logged into the back end of his site is that, considering it’s running 50 plugins at the same time, it was pretty snappy in there.

[00:05:11.22]
And so I’m not concerned about the horsepower of his host. Sometimes when people have me work on the performance of their site, we do need to deal with their web hosting. But in his case, with SiteGround, he was on the go geek plan with them. I’m not concerned about his web hosting. So the first thing that we wanted to do was we did a plugin audit, and we need to start stripping out the plugins that are not being utilized, and there were a few, okay? The first thing I noticed is that he was running Sitekit for for connecting up Google services, but it wasn’t even connected. So we turned that thing off. We don’t need it. The other thing is that he was running essential add-ons for Elementor. Now, Elementor has its own payload. It already is. If you’re If you’re going to use Elementor, you are going to have additional payload on the site. But he was using a lot of Elementor, so we weren’t going to strip that out of there. But when it came to essential add-ons, it’s a perfectly good add-on for Elementor. However, if you go over to the panel, you can see which widgets are actually turned on.

[00:06:19.16]
He had most of them turned on, but when I asked him, he was only actually using one of them. He was using one of the add-ons for the essential add add-ons plugin, even though the whole plugin was there and he had probably 30 or 40 widgets enabled. And the add-on that he was actually using, or the widget, was just a countdown Timer on the dashboard of the membership site. Well, it happens that Elementor has a countdown Timer built into it already. So we just switched it over, and then one by one, we just started disabling all the widgets of essential add-ons, make sure that everything looked okay. At the end of the day, we found out, well, we don’t need essential add-ons anymore, and I disabled the plug-in. So essential add-ons was gone. That makes a pretty big difference. Now, another thing is that I saw that he was running a lot of performance-related plug-ins. Certainly, I could tell he was trying to solve his performance issues by just throwing everything at it. Now, he was running WP Rocket. He had NGINX in there, Redis for object caching. He had the Cloudflare plugin on there.

[00:07:28.23]
He also had the SiteGround Optimizer. Now, here’s the thing. If you’re on SiteGround, use their SiteGround Optimizer plugin. It’s actually pretty good. It does a lot of the real important stuff, and it obviously works really well with SiteGround. So here’s the thing. He was in an interesting situation here where he had SiteGround Optimizer turned on, but he had WP Rocket caching everything. Right there, that’s duplicate functionality. Those two plugins do very similar things. He did not need WP Rocket. He was even paying for WP WP Rocket, but he simply did not need it. He was basically caching the site multiple times. And so we turned off WP Rocket. Now, NGINX and Redis, there’s a pretty good chance those two plugins were coming in from him his experiment with xCloud Hosting because they do use it, and it probably got migrated over. But I know that we don’t need that stuff on SiteGround, so I turned off NGINX and Redis. Now, as far as the Cloudflare plugin, we don’t need that either. He is running his DNS through Cloudflare. Interestingly, he also had the proxy turned on over on Cloudflare, which means that things were just being cached all over the place.

[00:08:41.15]
Now, ultimately, we definitely kept the proxy on because Cloudflare is incredibly fast. But that being said, he does not need the Cloudflare plugin, so we turned that off as well. And so basically, at the end of the day, in terms of the performance plugins, I removed everything except for SiteGround Optimizer. I did ultimately put the PerfMatters plugin on there. I’ll talk about that in a minute, but that’s where we left it. That was a lot of plugins that came off the line. Now, also in the plugin audit, I noticed he was running WP Forms. Now, I’m not going to sit here and say, Well, that was causing a performance problem. But one thing about WP Forms, along with a lot of the awesome Motive plugins, is that they advertise a lot. They’re always cross-promoting crap. I’ve seen plugins where you install one, it’ll just sideline, it’ll install their SMTP plugin for email. And I’m like, If I can get a person away from an awesome Motive plugin into a better alternative that’s not constantly promoting to them, I will. And so in his case, I put Fluent Forms on there. We imported the forms from the WP forms over into fluent forms, made sure everything worked, and I turned off fluent forms, got rid of the advertising inside the control panel.

[00:10:01.02]
It’s a beautiful day. Okay, so with the plugin list as thinned out as we can make it on a site like this, the next thing we needed to do was deal with the bloat of the page. It was 6.5 megabytes in size. That’s a huge darn page, okay? Now, a lot of it was images. What I found was that he was using some really bloated images. A lot of them were PNG files, which I do not recommend, generally, that people use PNG files unless unless they need transparent background images. For most photos, it’s better to use JPEG, and that’s because the image compression is significantly better, and you’re going to have a much smaller file size. And so what I did, I just used short pixels. I installed short pixels to his site, got it activated, and I did a bulk image optimization on his media library, and basically just optimized everything, took the PNG files, converted them into JPEGs, and just significantly shrunk the images down. And that right there had a really, really massive impact on the page size because we got rid of all the bloat. I think that image on his home page, that background image at the very top, I think it was like two and a half megabytes in size or something when I first got there.

[00:11:21.12]
I’m going out of memory here, and it’s nowhere near that anymore. I mean, it was just amazing how that one background image was taking up a significant amount of bandwidth. Okay, so the next thing I found on the page had to do with two pop-ups that he had built with Elementor. So it was just a little button showing up, okay? But when you clicked on those buttons, you would have a pop-up. And inside of those pop-ups were Vimeo videos that were embedded. So that set up right there is not good for page load time. It also creates a lot of balk. And there’s a couple of things there. First of all, when you embed a Vimeo video embed directly, what’s going to happen is you’re pulling in all this JavaScript and junk from vimeo. Com, and it’s having to load up in the browser. And so there’s a lot of payload there, and he was doing it two times. The other thing is that when you build a popup in Elementor, even though you can’t see the popup, the code for the popup is still there. It’s being loaded up behind the scenes, and you just can’t see it.

[00:12:30.00]
And And then all that’s happening when you click the button is it’s just saying, Well, show it to me now. Okay, so it’s still loading up. So basically, he had two Vimeo embeds that were showing up whether the person saw them or not. The other thing that I advised him on is that if you wanted people to actually see those videos, the way that he had it integrated into the page is just not very conducive because it was hidden. It was not at all obvious that there was a video there. And one of those videos was actually a behind-the-scenes walkthrough of the membership. And so it’s like, well, that video might actually help you get sales. And yet it wasn’t very easy to see. And so what we did is, first of all, we got rid of the pop-ups. We simply deleted the pop-ups. We’re no longer going to use them. One of the videos, he says, Actually, we don’t even need that one there anymore. And so we just took that one-off the page altogether, but that left the one at the top the page. And what do we want to do from there?

[00:13:32.26]
What we did is we moved it over to YouTube. And at first, I tried a YouTube iPad directly and then using lazy loading. And so what lazy loading is, is that it will not load up that code until it actually shows up on the screen when the person scrolls. Now, the thing is with this one is all the stuff was very close to the top of the fold, and so it’s going to load up automatically. So what I did from there is I used the an Elementor widget that has the ability to only show the thumbnail of the video or basically an image of the video, and that’s all it would load at the outset. It would load just the image with a play button, and then when they click it, then it would load the video embed and play it. And so that really works nicely for your page speed scores and your core web vitals, because you’re not loading up the YouTube video right off the bat. You’re only loading that one simple image, and then it’s not actually loading up any of that code until you hit the play button. Significant difference in page speed time by doing it that way.

[00:14:38.29]
So it’s one of those things when you use the video embed widget from Elementor, make sure you click that little button there that will only load up the preview image, and then you will load up the video when it actually shows up. Okay, one other big thing that I did, because, again, the nature of the site was that we had a homepage that was serving as a sales page, and then they had all this functionality behind the scenes for members only with LearnDash and BuddyBoss and all kinds of stuff back there, right? Here’s the thing. By default, a lot of that stuff loads up, whether it’s being used or not. And so what would happen is you’d have CSS files from Buddy Boss or from LearnDash or some of these things showing up on the homepage, even though it’s got nothing to do with it. And so what I actually did is I used the perfmatters plugin plugin, which is a tool that I use a lot of. It’s a very handy performance optimization plugin, but it’s got a thing in there called the script manager. The script manager allows you to do selective loading or unload of plugins on various rules.

[00:15:45.14]
And so basically, long story short, I use the script manager to disable all of those plugins that are being utilized in the membership site and only keep the plugins active on the homepage that are needed to display a homepage It was isn’t very much. A few buddy boss components and Elementor. That’s basically it. All the other stuff is for members only, has nothing to do with the homepage. And so I disabled pretty much everything except to what was necessary. That thinned out a lot of code from the homepage as well. And that’s using the script manager built into perfmatters. One other thing with perfmatters that I used it for was to what’s called Localize Google Fonts. Now, Google Fonts is handy. They have a lot of nice fonts, but they are remotely loaded. And so when they’re remotely loaded, that is a little bit of a performance hit because it’s causing the browser to have to go out and get these fonts. If you localize those fonts, which means you basically download them and put them on your own server, it’s going to speed things up a little bit. Now, one thing is, ideally, with this guy’s site, I would have been using system-only fonts, like fonts that are just built into the browser, because then you don’t use any Google fonts.

[00:16:57.13]
That would be better for performance. But again, I didn’t want to change the look of his homepage, and obviously, he likes it. So what we did is I just localized the Google fonts that he was using. That helped with the performance scores as well. And then there was one little issue with the cumulative layout shift that Google talks about here with the web vitals, with the way that the headline at the top of the page was showing. It was showing a little bit of a layout shift with that because of the custom font. And so I had to edit the HTML a a little bit in order to remove a bunch of junk and just simplify it. I mean, just one thing to keep in mind is that when you’re build things with Elementor, sometimes it just creates some code in there that’s not needed and you can’t see it. So sometimes you have to know what to look for in order to remove out some code that’s just not necessary. And that’s what I did in his case. So with that, combined with localizing Google fonts, we were able to shave a little a bit more off the performance hit, but also reduce the layout shift that was there previously.

[00:18:07.22]
All right, so that’s essentially what I did with his site. Now, again, as I mentioned earlier, this is not a site that we were able to get up to Perfect100s. At the end of the day, there are some things about the site, given its nature as a buddy boss membership site, that without fundamental restructuring of things, we’re just not going to be able to get it up to Perfect100. 100, but we got it pretty close. We did pretty well, but it’s just the nature of it. In my ideal world, we would have gotten rid of the chat widget, but he wanted to keep it, so it is what it is. In an ideal world, we probably would have not had that homepage be built with Elementor. But I know that, A, it’s already built with Elementor, B, he’s probably used to being able to edit his own homepage, and I don’t want to remove that capability from him. But in an ideal world, if you want the fastest performing page, it would not be built with Elementor, simply because Elementor does bring in a lot of extra code. It’s just the nature of a page builder, and it is what it is.

[00:19:14.22]
So there were some things that we were not able to do. We left the chat widget. It’s still using some custom fonts rather than default system fonts. It’s still being built with Elementor. And so there’s still a fair amount of and stuff being loaded up here. But at the end of the day, we were able to get that thing to where everything was in the green, the web vitals were happy, stuff like that. But is it going to pass and have awesome mobile scores on PageSpe Insights? No, it won’t, especially with that chat widget. I mean, the Page Speed Insights tester on mobile, it mimics an incredibly slow internet connection that most people don’t have anymore. And if we’re loading up something like a chat widget or an elemental page, we’re just never going to get those scores really high on mobile. We’d have to completely rebuild this thing. We weren’t going to do that. And so we called it a day. I think we got Mission Accomplished, and the site’s performing pretty darn well. And so it worked out great. Okay, so was that enough nerd talk for you? That’s basically what I did with this guy’s site.

[00:20:24.09]
He’s pretty happy with the results. That means I’m happy with the results. So again, he signed up the WP Speed Fix service, which is a brand new thing that I am offering at the blog marketing academy. And so if you have similar issues with your site, your core web vitals are not passing, your site is slow, you run a GT metrics test or a PageSpeed Insights test, you’re like, Man, my scores suck. Well, maybe I can fix it for you. You could try to DIY it. I certainly spend a lot of time doing that type of thing. But with experience comes, I know what to look for. For. At the end of the day, you have to take into account the value of your own time. Is it worth geeking out with the terminology and trying things that might be breaking something and all that? Or you could just have somebody come in there and deal with it for you. And that’s what the idea with the WP Speed Fix is. And the price is going to probably go up in the not too distant future. But being that it was so new, I decided, and I’m testing it out.

[00:21:31.10]
So anyways, if you wanted to get in on that, head on over to blogmarketingacademy. Com. You can learn about the WPSpeed Fix service. Otherwise, hopefully this video was helpful as to some of the things that I look for and a little bit of the process, some of the the things that may be pertinent on your site that you can check out to get your performance metrics up. And if you’ve got any questions, you know where to find me. Talk to you later.