140 – A Deep Dive into Website Speed and Optimization with Jon Philips

​Josh 0:14
Hey friends, welcome into the podcast. This is Episode 140. This is also part two of our first ever little podcast series about site speed. In the previous episode to this 139 we talked about the basics of site speed and we had one of my close colleagues and the web design industry Tim Strifler of Divi Life on to cover the top five most important things to focus on in regards to site speed is a perfect introduction for this episode, because on this one, we’re going to take a deep dive into site speed, and we’re going to go even further into site performance, speed, best practices, we’re going to talk about media optimization, caching, CD ends, a lot of things that are going to really take this to the next level.

Josh 0:59
This is exactly why I wanted to create this first little podcast series because the first one again, before this was more of a beginner type overview. This one, we’re going deep, and we’re gonna have some fun in this one, I’m actually really privileged to bring in somebody who I consider to be a total site speed expert. This is John Phillips. He is like me, a web designer who’s learned a lot in his career and is really passionate now about sharing what he’s learned. And we’re going to talk about his his his course website, which is called Holy Grail, WP.com. He’s going to continue to provide more and more courses, particularly around performance and site speed. And in this episode, he’s going to dive in and share what he’s learned, particularly when it comes to a lot of these things we just talked about what’s site speed performance, we talk a lot about WP rocket, I know that’s a really popular plugin right now. We’ll also talk about how far you should go with plugins how far you should focus on speed verse UX and conversion based design.

Josh 1:58
This really was a fascinating talk. Because for me personally, I am not a site speed expert I that’s probably like the one area of web design that I know the least about. So I dare say in this episode, I may have learned the most out of any podcast episode I’ve done to date. So I learned a lot in this one, I know you will, too. Again, just a reminder, this is part two for a reason, we do go pretty deep into site speed. So if you have not listen to Episode 139, you might want to check that one out before this or if you get going with this one and you’re like I don’t know quite what they’re talking about, refer back to the one before this 139 because that’ll give you a beginner’s overview of site speed. And now we’re going to take it even further.

Josh 2:39
So really after this episode and the previous episode, you should be fully empowered and be very well equipped to know how to get better speed and performance on your website. So I’m really really excited for you and I do want to mention before we dive in john has a free mini course to help you with your WordPress speed it doesn’t matter what theme you use. And we’ll have this link below but you can check out his his free WordPress mini course on site speed at Holy Grail WP com. Check that out John is an awesome guys and open book really, really enjoyed getting to pick his brain about what he’s learned with site speed. Again, we take a technical approach so I’m really really excited to help you dive even further so you feel pumped and ready to go with getting better speeds for you and your clients websites.

Josh 3:24
Before we dive in. I do want to mention, if you are new to web design and your learning site speed alongside conversion and content and SEO and all the different aspects of web design, I want to help make this all this make sense to you and give you a guide to follow I have created a free 10 step action plan that you can pick up today. This will be your perfect guide to just make all this make sense and you can pick that up at Josh hall.co slash learn just go there you can get access to this 10 step action plan what it is is basically the most important resources that I wish I would have known to kind of learn and I’ve created that for you this is what I’m basically saying I wish I would have known this you know 10 years ago when I got started so check that out Josh hall.co/learn that is going to be kind of my guide for you as far as what you should learn and site speed will be a perfect little follow up to a lot of those aspects that way you can make really truly great professional websites so without further ado, here is my man John. We’re going to talk about site speed in depth just a reminder go to Holy Grail WP.com to check out his free mini course on site speed, and let’s have some fun guys.

Josh 4:40
John, welcome onto the podcast man. So great to have you on dude.

Jon 4:46
Yeah, thanks for having me, Josh. This is going to be a great time.

Josh 4:50
Yeah, this is gonna be a great time because we’re diving into a topic that is I think it’s fair to say probably like the most hot topic and indemand subject right now in web design. And that is site speed, especially with a lot of the recent stuff with what is it the Google core web vitals and all that stuff. So you are somebody who knows a lot about this subject. And I know you’ve, you’ve got a course on this, and you’ve got a lot of resources, and you’re actually helping my agency out with with speeding up some sites. So I’m really again, nonetheless, really excited to dive into this. Needless to say, I meant to say, before we dive into this topic, though, man, do you want to let everybody know first off where you’re based out of? And if you could summarize kind of what you do both with your agency and now with this endeavor with with lightspeed?

Jon 5:38
Yeah, so I’m based in Clinton, Mississippi, so it’s near the Capitol Jackson so and of Central Mississippi is where I’m at. And my little one man show agency is Matchless Web. And I’ve been working with WordPress websites, for myself, and then for clients now for about seven years. And more recently, my newer website, my course website is Holy Grail WP, and that is where the site speed course, will live. At the time that we’re recording this, the course is set to come out in one week. So that course along with some others that I’m dreaming up will be coming down the pike. But yeah, so here in Clinton, I’ve done WordPress design for myself and clients. But I’ve also connected with a local agency or two, and have done white label for certain clients in state and just through connections they have out of state.

Jon 6:37
So I’ve worked with several I know you’ve had a guest or two on here that have done story brand, they kind of use that, you know, model for wireframing websites and everything. So I’m connected to some story brand people who kind of pass my contact info around and work with some of those folks. So just I’m familiar with that framework, and just know how it all works. So whether it’s Divi Cadence or Generatepress websites, I find myself doing a lot of story brand sites using those themes. So that’s kind of my bread and butter. And then more recently, the website speed has kind of become the one of the main service offerings I find myself getting into.

Josh 7:18
Yeah, well, I want to ask how you really decided to hone in on site speed, because you’re making your first course out of it, which First off, man, I’m so pumped for you, you are like the shining example of what I recommend people do, which is build your your solopreneur, freelance business, scale, if you want to do it however you want, and then start productizing, find something you’re into and then share what you know. And you can do that under your same brand or like you’re doing branching out with something a little bit different. So I’m super pumped for you, man. Where did the the interest in site speed come from? Was that just a challenge and a struggle that a lot of your clients and sites that you worked on had? And I guess the follow up question to that is, how did you learn about site speed? Like Where did this interest come from?

Jon 8:07
Yeah, so I’m a bit OCD, when it comes to getting my own stuff, right? in some regards. There. There are areas of life where, you know, don’t take it so seriously. But when I have a little pet project that I’m working on, I can I can really obsess over getting it right. And I had, I think it was the first time that I built, I moved from some generic was a theme off of Themeforest are something my original, my first agency website, and I was like, man, I want to I want to get into Divi. And so this was, you know, probably six years ago, and started into Divi. And as I finally figured out how to make a website, look the way I wanted, hey, I can finally edit the things I want to edit, I can change the things that I you know, feel like I should be able to change. Thanks to this page builder.

Jon 8:58
I then started running into the problem of Okay, I’m still new. I know, I’m probably missing some things here. But it seems that maybe some of what I’m doing is making my site a little slow. And so I started first taking interest in image optimization, how do I how do I make my pages a little lighter, so that images are not what’s slowing things down. And then as you get in, become more familiar with different speed tests and reading waterfall charts, you can start seeing, hey, it’s not just images that could slow you down. It could be specific files, maybe it’s CSS or JavaScript that belongs to plugin or your theme.

Josh 9:38
And John, for folks that are who are new waterfall charts is referencing like the little graphs that show plugins and code and stuff like that, right, like what resources are pulling from the site?

Jon 9:51
Yeah, that’s right. That’s right. So if you were to visit any speed test website, like gt metrics is popular. PageSpeed Insights, I don’t believe it actually shows up waterfall. But it is it is one that measures Cora vitals.com tools. What is it? I’ll put a link at the bottom of all that.

Josh 10:16
I figured we’d get into some tools and links to this one.

Jon 10:19
Fast or slow.com is a newer one that I really like. So but yeah, it is basically a waterfall chart is the chart that shows you each individual asset that is loaded in whenever your website is requested by a browser. So every individual image, every font file every piece of CSS JavaScript that is required for a page to display and have the functionality that it needs. You’ll see all of those individual assets in the order that they’re loaded and also, you see how long did it take for the request for that individual asset to actually show up and then do its thing. So you can see, you know, based on the length of a of a particular bar, you can see that, oh, this particular asset was loading quickly or not so quickly. And it can really help you identify what the bottlenecks might be when it comes to your website’s performance.

Josh 11:13
So when you say you’re a little OCD, that’s probably something where like, you’re looking at all the data and I imagine with your type of personality type, just getting to know you, John, you’re probably realize what you’re good at. And then you’re like, oh, here’s something maybe I’m not so good at or I really want to get good at. I guess a follow up question to what we’re interested is in site speed, is when did you start turning the corner and start getting really good results with site speed? And then maybe now we can transition to talk about, you know, some of the steps to take but yeah, when did when did you go from Well, I’m not getting great load times to Okay, now I’m actually starting to get good load load times.

Jon 11:51
Yeah, great question. Because this is where everything started. This is where it all came from. So after having, you know, played with WordPress for several years, so last year, 2020 pandemic times were afoot is still happening now, but so it was about summertime, last year that I finally discovered kind of came across my own little secret sauce, for lack of a better word. I seem to have this great little cocktail that between hosting particular plugins and other little services that just seem that, hey, it seems that no matter what website, whether it’s, you know, one of mine or a client’s website seems no matter what site I plug this stuff in on. If I use my little configuration here, it seems to really speed up websites, and in a lot of cases can get a WordPress website loading in one second or less worldwide.

Jon 12:45
Okay, so not just in your immediate geographical area. So just a quick little chase this rabbit, wherever your origin server resides, okay, geographically, you know, so I live in Mississippi, so whenever I’m setting up my hosting for a website, if the client is also in Mississippi, well, I will probably select a data center, I want a server location that is somewhat, you know, close by geographically speaking, if you know, the business is looking to target local users, because the physical distance between your server and the person that is making the request like that IP address of you know, somebody’s phone that is looking at your website, it has, its associated with a geographical location. So right, if you only have your website loading from your server, then that request has to cover that distance.

Jon 13:39
You know, there’s magic involved between, you know, data going across fiber optic cables and everything to deliver the webpage. And so literally, in this day and age, one of the biggest bottlenecks to website speed is actually physical distance between a server and the user that’s making the request. And so if you’re just relying on your server, and a user is pretty far away, let’s say someone’s on the other side of the world, they looked up your website, it’s gonna take longer for that website to show up versus if someone were to look up your website and actually be closer geographically speaking to the server. So all that to say.

Josh 14:16
Most hosts have that option now, right? Like I know, with Siteground I think it’s still the same where you set up a website, you can choose where you want that server to be based out of like, I know I set my site up initially in a server in Chicago I think it was because most of my traffic, although what’s interesting is with my brand now I get a lot of worldwide traffic, but a good portion, I think almost 60% is still US base, and another high percentage is UK and Europe, Australia, and then Asia, South America and stuff like that, but most hosts are set up like that, right where you can choose your server location?

Jon 14:51
Yeah, most of the good ones Anyway, those are those that have been around long enough to expand and you know, have data centers that you know, they can Get into in different areas of the world. So they’re all at minimum be something like, hey, select, you know, North America, East, North America West, okay? Maybe Asia. So it could just be like continental, or it could be certain regions, you may even be able to specify, you know, hey, if this is going to, if I’m spinning up a server in somewhere in Europe, I could specify London or I could specify Paris or that kind of thing. So depending on the provider, you can, you can really drill down into some really specific locations. But again, like you said, so if you’ve got, if you’re anticipating traffic coming worldwide, you know, you’re not just a local business offering services to your immediate local area, then there’s some other strategies that you will employ using things like a CDN content delivery network, to help out visitors that are farther away from your origin server. But yeah, absolutely. That is, that is basically how it works. So you know, I’ve chased this rabbit for so long now I forget where I started.

Josh 15:58
I think I derailed as to because I asked you when that when the tables kind of turn for you, as far as That’s right, say street spice to begin issue to like something you’re keen on and something you’re really good at. I know you kind of created your your cocktail, like you said, and I we can either dive into that now. Or maybe we could dive into it here, you know, step by step, because I do have a lot of questions about hosting, image optimization, best practices, CD ends and all that stuff. But maybe what might be worthwhile here, John, before we dive into your little concoction is what are maybe like the top few biggest issues with site speed? What are the main things that are making sites slow?

Jon 16:41
Yeah, okay. So the the whole premise behind the course, it’s called the holy grail WordPress site speed course, the whole premise behind it initially was, hey, how do we solve for purely just the website speed thing? Like how fast can we get the site load to load. But on the heels of some changes Google has rolled out in the last year, core web vitals is a big update that everyone’s kind of been, you know, panicking about running around, you know, so if you pay attention to any of the Facebook groups out there, any online communities people are, you know, constantly talking about, you know, how to get the hottest topic like it?

Josh 17:17
Yeah, it’s the hottest topic and my Divi webdesigners group, it’s all speed every day speed, speed, speed.

That’s, that’s essentially, you know, SEO In a nutshell, it was the best answer was the most thorough and helpful answer. – Jon

Jon 17:22
Right And not just speed for the sake of speed. I mean, so your website’s performance, and the user experience that delivers is now a ranking factor in Google. And that’s not to say that, Oh, your site’s fast, you automatically go to page one. But Google is essentially what these four web vitals standards they’ve rolled out is basically saying anything that turns up, you know, page, one of Google it’s going to be, or at least, it’s intended to be the best answers to someone’s query. So if they’ve searched something that is a high intent query, then Google wants to say, Hey, here’s the best answer to those questions. That’s, that’s essentially, you know, SEO In a nutshell, it was the best answer was the most thorough and helpful answer. And now, speed and website performance, you know, user experience is also a factor there.

Jon 18:13
So if there comes down to being Hey, there’s a website that provides a really good answer. But when the page loads in it kind of jumps. And when you try to click on that one link, something else pops up, and you accidentally click an ad, and, you know, it just frustrates users to where they’re bouncing off the website. If there is a similar website, let’s say that answers the question with similar, you know, thorough detail gives a good answer and delivers a better user experience and page loads faster than it could preferentially climb the rankings and end up you know, knocking someone else off a higher position in Google.

Jon 18:48
So it’s not just site speed of session for the sake of speed, but also this whole SEO component too. Yeah, and yeah, so that’s, I think the main things that end up slowing down a page can come down to relying on a lot of external third party resources. So every time you add something else to your website, whether it is we’ll talk plugins in just a second or something you install on your website, but any services that you integrate with, you are no longer just making requests to your server.

Jon 19:22
For resources, you’re now asking your server for the things it provides. You’re also asking Facebook to, you know, load in maybe your facebook pixel, maybe you’re asking Google Analytics to deliver your your tracking code, you might be integrating with hot jar, if you are, you know, tracking, you know, how are people interacting with your page. So as you start pulling in all of these different third party resources, you’re not only making a round trip request to your server, but all these other places too. And that just piles up the amount of stuff that is required for a page to deliver the functionality that it needs.

Jon 19:57
And so when you take Maybe all these third party integrations and chat widgets are another thing, chat widgets can be a big performance drag. If they’re just installed the way that most people install them, well, we can talk about how to install them in a more friendly way, where they load quicker. But when you take all those third party requests, and then also fonts, so it’s really common that people might use a few too many fonts on a website. And maybe we’re even loading more font weights than we actually need more, you know, maybe you’re loading in the metallics, you know, font weight of 900 on some specific font when you’re not actually using it. And so you could be requesting a lot of things that you don’t even need when it comes to fonts, so that can get us in trouble.

Jon 20:45
And then, I think last thing I’ll mention here would be plugins. So every time you add a new plug in to your website, the really well developed plugins will only run on the pages where they’re installed. So if you have a form plugin, hopefully that form plugin only loads when it is detected on the page. But it’s really common that I think the usual culprit, everyone picks on this contact form seven, it’s a great contact form plugin. But at least in years past, and I haven’t checked on this recently. So that could be they could have fixed this by now. But contact form seven is one that traditionally will load on every page of your website, whether there’s a form there or not. And so those kind of needless assets loading in can also be a big bottleneck. And yet, image size can be another thing too bloated images can really slow down a page too. So when it in a nutshell, it’s third party requests, it’s excessive on unnecessary requests on your page and images. I think those are the biggest the big three.

Josh 21:48
Yeah. And you talked about good hosting a little bit ago as well. I know that plays a crucial role in site speed and performance. Just I know, a lot of clients were small, I had some clients and past that were all like GoDaddy and Bluehost. Bluehost used to be great. And then it just went downhill. I think after I got purchased by was the AEG are the company that Yeah, buys up a lot.

Jon 22:12
A lot of this year, a lot of this year.

Josh 22:14
So I know that’s that’s a big part too. And I know we’ll we’ll talk about that. Because Allah has to do with delivery and you know, what type of server it’s on, and if it’s shared or whatever. So, yeah, a couple of really good points there and things to look out for as far as causes because I do, I think it’s good to start out with, you know, one of the main problems here, I think you said, John, I’ll back you up on that. plugins, everything that you talked about, I was just thinking about myself early on in the journey, adding like an Instagram feed, and then a Google Map at the bottom, and then a chat widget, and then a Facebook integration and a calendar integration with big images. And on GoDaddy, no wonder that site is like barely loading at all. It’s like everything that could go wrong I was doing early on, before I knew anything about sites, you know, what

Jon 23:00
A dumpster fire. This rolling downhill about to go off a cliff. You know, it’s just yeah, that’s a perfect storm of.

Josh 23:08
And I understand, you know, when you’re early on, you don’t really think about what you’re adding. But I think as people gain more experience, and as you realize you can, you want to try to tend to build more lightweight. And I’ve actually more recently, because Divi’s Divi is tricky, because it just, it presents so many different options for animations and scrolls and a lot of cool things. But to your point, you can get into a tricky situation, if you’re adding too many requests, although I know you can speed up sites and still have a lot of animations and stuff. But a lot of great points here to kick us off with some of the main problems. And I think most everyone’s aware of images, generally being the biggest culprit because if you don’t optimize an image, and even some of these optimizers that are really great often would you say when it comes to image optimization, the best thing to do is to optimize it before it even gets onto the site. Is that a principle that you stick by?

Jon 24:05
Yeah, for sure. That’s, that’s an easy way to go ahead and do some of the heavy lifting before you throw plugins or sorry, before you throw images onto your own server and then have a plugin, try to deal with it. It is the rule of thumb. I mean, a lot of the image optimization plugins will, you know, resize your images which is a big thing. So you know, if you have photographers that are uploading their, you know, 15 megabyte size images onto onto betas or less, let’s say the dimensions are just you know, out of this world way, way bigger than they’d ever be needed. A lot of the plugins now will resize your images. And that is a good place to start. But I think at least getting the sizing taken care of before uploading is really handy. But of course you could just let your server do it but that is going to suck up a lot of server resources if you’re, you know, doing a lot of images.

Josh 25:03
You would still have the original image, right? Like you would still have that 15 megabyte image on the server. Doesn’t just duplicate or does it actually,

Jon 25:11
If you keep it.

Josh 25:12
These, okay, do most of these plugins actually resize that? tweak that and then get rid of the original image? Or does it just make new versions of the image that are optimized?

Jon 25:23
Yeah, so some will, I know, for instance, just one that comes to mind. I’ve been a web dev user for several years now, a lot of their plugins, and I know that their Smush plugin, it has an option where you can tell it to store your original images, so that all the optimization that is done, let’s say you compress the images way more than you needed to and you’re just like, Oh, I don’t like how that looks. You can revert back to your original images if you have that toggled. But if you don’t, then yeah, the version of the image that has been resized, you know, there’s no going back at that point. I mean, yes, you have your original image still saved on your computer, right? or whatnot. But what’s on the website at that point? If it has been, you know, resized or compressed, and there’s not an original to fall back to, then yeah, you would need to re upload the original image.

Josh 26:10
Gotcha. Do you recommend still having WP smush? Or an image of fire? There’s, oh, gosh, there’s there’s a ton of swap pixels one I’ve used before? Do you recommend having those, even for a seasoned developer? Who does the optimizing of images and files before going on to the site? Or do you think it’s unnecessary to have both.

Jon 26:31
I think you should have them still have them. Because especially if you’ve got a client that is adding their own images at a later point, setting up that most of these image plugins will let you set a maximum, you know, height and width for images so that even when an image is uploaded, it will essentially automatically be scaled to where you’ll have new images that are any wider than, you know, 1900 20 pixels or just whatever dimensions you enter in. It’ll, it’ll essentially go ahead and resize that image just so that the client can’t unknowingly end up hurting their performance on their site by just putting in unnecessarily large image.

Jon 27:08
And two, it’s worth pointing out that a lot of your more modern WordPress themes do use responsive images. I mean, that’s, if you were to ever look in the little, if you use Google dev tools, Chrome’s dev tools, or any other browser for that matter, but you know, inspect element, and look at a particular image file, you’ll see like this little SRC source. So source that is the responsive image. stuff, we’ll keep it that simple. And, and you’ll see that per device size, you know, if you’re, if you’re inspecting element on a, you know, on a simulated like wide screen that is, you know, 1400 pixels, you’ll see that the image that is served up at that screen size will be maybe the full width version of the image that is, you know, 1500 pixels wide.

Jon 27:55
But if you then switch the device to a mobile device, and then look at the image, again, it’ll be, hey, here’s the 300 pixel width version of that image. So if you as a rule of thumb, you could just upload all of your images at you know, their maximum width, trusting that your theme. And that is if you can rely on your theme. If you’ve got a theme that does this, your theme may still handle the responsive image stuff for you. So that whatever you upload, the appropriate image will be put in place, you can still mess yourself up, you could still go into like whether you’re using your page builder, or if you’re using one of the more Gutenberg friendly plugins, you could still say like, hey, in this spot, I want full width image to load here.

Jon 28:39
So you could kind of like card in, you know, in a sense, hard code a larger image in there. But more often than not these days, you can, you can more reliably count on the theme to actually handle your responsive images. But yeah, you would want to check either your documentation with your theme to see if that is supported. But the theme that I usually rely on these days is against Divi, cadence and generatepress. All of those support source set and responsive images.

Josh 29:08
Before we dive into your concoction, is Divi so everyone says Divi slow. What are your thoughts on that?

Jon 29:16
Yeah, everybody gets Divi a hard rap. They like to like to try to dunk on Devi any of the summon several, like speed optimization or like professional WordPress user groups, and everybody likes to just poopoo on things like Divi Elementor. And yeah, I mean page builders can absolutely be slower, but you can work with anything. I’ve got Divi sites that load well under one second, it’s it does come down to what are you loading on the page and have Have you done some fine tuning that can help you out? Because if you if you take a totally unoptimized site, and in you’ve used a page builder to build it, well yeah, you’re probably you’ve probably got a lot of unnecessary requests coming in.

Jon 29:55
But you could have a site built with a page builder like Divi and If you know what to look for, you can identify, hey, we can actually get rid of this request move this, let’s not have that. And your site can be plenty fast. So it’s not a I would say it is an exaggeration to say that you know, Divi is just automatically slow. You shouldn’t use it or anything like that. It’s, it’s great. And it’s To this day, if I end up with a client that says, you know, hey, I really like this demo site, or I found this child theme. I love that design I’d like to start there will absolutely use that I’m not going to just say like, Okay, well we can use that but I’m going to redesign it over here in cadence or generatepress because those are lighter weight themes, which I’ve done on occasions you know, if if a client really wants those themes, we’ll use those themes but they end up paying a little extra because I’ve got to recreate the child theme and yeah, when those other things but but it is entirely possible to have a fast site that is using a page builder, but these days it is far more common a lot a lot of people are moving towards the more Gutenberg friendly Gutenberg ready themes that just build on top of the native you know WordPress editor rather than layering on a page builder on top of what WordPress already does natively.

Josh 31:10
Well it’s great to hear you say that because I know a lot of people do trash Devi for quote unquote being slow but everyone that I know who takes speed very seriously and and is pretty knowledgeable on it like yourself and one of my good colleagues Tim strife ler just I don’t know if you saw he’s with Divi life, he just recently put out a great guide on site speed. And he’s got digging sites loading and as it can’t be done, like I think a lot of the people who jumped to that conclusion are jumping on the bandwagon of the Divi slow bandwagon which, yeah, there’s a lot of other factors to that. So that’s good to hear, man. So we’ve covered this.

Jon 31:42
Here’s a good analogy for that, actually. So have you ever seen these funny videos of let’s say, a very unassuming vehicle, let’s say there’s a minivan on a racetrack next to like an actual race car. And it’s obvious there’s about to be a drag race. And then you know, 321 go in the minivan just takes off and could just totally smoke the car that looks like that’s gonna be the winner. Obviously, you know, you don’t know what’s under the hood. Okay, you could know that, hey, this is a Divi website. But before you’ve seen it in action, you know, before you’ve maybe run it through a test and seeing like, what’s actually in the waterfall until you know what’s under the hood. You can’t just say like, Oh, this site is slow, because you could absolutely have some stuff going on under the hood, you could have done some fine tuning, that might not be evident to anyone else. But if you’ve, you know, had someone or you know how to do it yourself, tweak the site, you could, you know, fool everybody, you have someone thinking, Oh, it’s the Divi site, it’s gonna be slow. Not necessarily like how’s it been put together? So it’s context is always required. I don’t like making very broad generalized statements that are, yeah, context matters. So yeah, in that sense, I just I think that’s a good analogy,

Josh 32:49
A great rule for business and in life, man, that’s awesome. All right, dude, let’s talk the concoction. What do you got for us? What are the we’ve talked a lot about the issues and the ins and outs of, of image optimization, deliverability, themes, page builders, lots of stuff. So yeah, what what have you found that has worked really well? And maybe if you can just give us an overview of this little concoction, man?

Jon 33:11
Yeah, yeah. So the holy grail, as I like to call it is, is really to premium plugins, and a free cloud player account. Okay. So maybe I’ll just start with CloudFlare. So CloudFlare, if you’re not using it on your websites, I would say, why don’t you love your websites, because CloudFlare is a phenomenal free service that offers security benefits, your website offers some fun stuff, like you can use CloudFlare for your name servers. So no matter where your domain is actually registered, you can use CloudFlare name servers to kind of piggyback on their global network, they call it the edge, they’ve got these cognitive edge servers that are just worldwide. So you kind of get on their CDN to where anytime you make changes to your domain, you effectively get instant propagation. So the changes are reflected instantly. So if you’ve ever, you know, maybe you’ve registered a new domain, and you’re waiting for it to, you know, be reflected worldwide. But every time you go to DNS checker, I guess DNS checker.org. It’s like, Oh, it’s propagated into areas near the origin server, but on the other side of the world is it might take 48 hours.

Josh 34:28
This was a big thing, when when clients like when I would launch a new site, it would be live on my end, but they would be like it’s still showing the old site for me. Yeah,

Jon 34:36
Exactly. Yes, that’s, that’s propagation. But yeah, CloudFlare is network as soon as you push go on a website where the domain is using CloudFlare nameservers, virtually instant. And same with like very if you want to verify a property in like Google Analytics or search console, if you need to go and add that verification TXT record to your domain. If your name servers are on cloud As soon as you do that, I mean, you can like instantly click, hey, verify this for me Google. And it’s like, yeah, it’s good checks out.

Jon 35:06
Whereas if you just are using your registrar, then it could take, you know, Google might say, hey, check back in maybe 24, or 48 hours or something, or maybe it’s like 30 minutes, it’s gotten better in recent years, but propagation can take Well, anyway. So that that aspect of using CloudFlare, for that free, again, this is a free benefit for their name servers, and then also the implementing. So they have these settings called page rules, you can implement page rules for edge caching on their network. So worldwide, all these, I want to say there are 200 plus edge servers around the world now in their network.

Jon 35:42
So as soon as your website is, if you can at least get the HTML of your website cached in their network, then anywhere in the world, someone looks at your site, the the first request your time to first byte as it’s called, that’s a really important metric for performance, time to first byte can easily be under 100 milliseconds. Good rule of thumb is, hey, at least have that under 300. If you can get under 200, that’s great, but it is really reliable. If you’re on cloud flares, name servers, and you have your site cache at the Edge, then you can have that time to first buy a lot of times, you know, 50 to 100 milliseconds, that just means when time to first byte is that low, that the very first bit of information that comes in through a request, someone looks up your site, it can just start that process of loading your site that much more quickly, because it can’t time to first byte is 500 milliseconds, that’s half a second.

Jon 36:39
So a user could have requested the site, and they’re waiting half a second before the request, can even actually hit the server and come back to start sending you the first bit of info. So CloudFlare, that those free settings, use it for your name servers, use page rules. Those are that’s really low hanging fruit for performance. And there’s some other settings, again, that are just free, and there’s really no reason to not use it. So CloudFlare is a big one. And for everyone listening, you will see me walk through all of this, I’ve got two different sides of Josh’s that in the resources for the show here, you’ll see a video of me going through each site and just working the whole holy grail configuration out on each site. So you’ll see this in action, if what I’m talking about seems just kind of gobbly gook right now, or you’re

Josh 37:31
Just gonna say, well, we’ll put the outline together for this overview in the steps. But yeah, I know you’re able to go in a lot more detail visually to that we can’t do on the podcast here.

Jon 37:40
Yeah, yeah, for sure. So, in a nutshell, so large nutshell, that’s the CloudFlare piece, and it’s free. So at the very least, if you don’t get on board with the other premium plugins, we’ll talk about getting the CloudFlare stuff in order is like, hey, why not? You could you could have relatively cheap hosting, and throw it on CloudFlare and eke out a lot of benefits without spending a dime. So I really steer people towards that before doing anything else, but then getting into premium plugins.

Jon 38:09
Okay, so WP rocket, and Perf Matters are the other two legs of that tripod. Okay, so the holy grail configuration is CloudFlare. WP rocket perf matters. Alright, so if you are not familiar, WP rocket is really the most popular caching plugin. in the industry. There are many others out there. And there’s a lot of great ones. You don’t have to use WP rocket, but it is one of the easiest to configure, just right out of the box, you either you know, check yes, or you know, don’t check the box at all, on a lot of the settings, it’s either turned it on or don’t. And in a lot of cases, it will just work out of the box doing great things for you. Now there are some more manually intensive things that might require you to have a little more know how and that stuff that we go over in the course. But once you know how to get the benefits that are really easy to get just out of the box, just installing that great caching plugin, which will work alongside your hosts cache, a lot of hosts will have

Josh 39:16
I was gonna ask about caching. Yeah, I use siteground. And I use the caching plugin with siteground. And their media optimizer stuff is great. And it’s come a long way. I was gonna ask you about that later what you thought about all that. But yeah, does that often conflict with WP rocket? Or does rocket play that play nicely with a lot of these other ones?

Jon 39:35
Yeah, so anytime you add another layer of caching to your site, it can cause issues just because if you let’s say you update some aspect of your site, and the cache has cleared in one place, maybe maybe you cleared it in WP rocket, but you didn’t clear your server cache. You can get what’s called cross poisoning of your cache, which sounds like really extreme and scary, but it just really means that something some cache was cleared but Not the other.

Jon 40:00
So whenever a new request for a page comes in, you might get some older content or older requests come in. Whereas alongside some, you know, more newer information. So you just want to make sure that if you’ve got multiple layers of caching that when appropriate, you clear out each of them that are required to be cleared. So in specifically, WP rocket does page caching. So it is caching, like the HTML of the page. And server side, you will often have some kind of dynamic caching under the siteground optimizer plugin, which is a great, it’s a great plugin, and it works really great on that hosting as well. But you have the dynamic caching option.

Jon 40:12
And also mem cache, which is an object cache, right. And object cache is just a tease out the differences. Object cache is more about specific. Maybe you would call it like a some kind of function request. It’s just when your website has to do a specific thing, not necessarily just serve a page. But if there’s some regularly requested functionality, some process that has to run that process, in a sense can be cached. That’s in Yeah, in short, what object caching is.

Jon 40:43
And so I was gonna say quick answer, if I’m using most of my students use siteground. With caching plugin. WPRocket, Is that necessary alongside that? Or would you just say, like, try it out to see if it helps? Or on average? Would you say the caching plugin that siteground provides is fine.

Jon 41:30
Yeah, so necessary, I would say No, in fact, there are many cases where you would actually, you might want to just rely on your servers, caching, you might want to stick with, you know what, because effectively, what site grounds plugin does is basically talking to your server caching settings. And just letting you do that you’re not adding an extra layer of caching on top of your site by using the plugin, it’s just the interface that’s letting you kind of tweak those server settings when it comes to your caching stuff.

Jon 42:00
But WP rocket is not just caching, so there, there’s plenty of ways that you can, there’s a little helper plugin that you literally just can install alongside WP rocket that disables the page caching, but lets you keep in place all of the other performance optimizations I see are available. So whether you use it for the page caching or not, even though it’s called a caching plugin, it really is a maybe more broadly a performance plugin.

Josh 42:25
Gotcha.

Jon 42:25
And in, but some of the things that siteground optimizer does, might be similar. So the big point is in when using any combination, any cocktail of performance tactics strategies, is just to make sure if you’ve got one feature turned on in one plug in or at the server level, that you don’t have the identical setting turned on in another area, does that automatically create issues with for your stuff? So like for instance, I know that a rule for grading work. Yeah.

Jon 42:55
So more recently, the siteground optimizer plugin has integrated things like offering some kind of font optimization, also image optimization, lazy loading and that kind of thing. And which those kinds of things have been present in WP rocket for a while, maybe not the font stuff, but it lazy loading your images, videos, iframes. That kind of thing. If If you have Lazy Loading turned on in WP rocket and also inside your own optimizer or, or perf matters. perf matters also offers lazy loading. If multiple things are trying to lazy load the same image, you’re going to cause some kind of issue.

Jon 43:28
So if you’ve got, you know, images that have disappeared, they’re not showing up. Or maybe an image is getting requested twice or something, it’s really helpful to be able to look in the waterfall to see like, how is the page actually loading not just what I see with my eyes, but what’s going on kind of in the background here, because you’ll you’ll be able to see if there are any errors. So I go the long way around of explaining much of anything, but I just want to be thorough when I can. But yeah, so you can absolutely use siteground optimizer alongside WP rocket and alongside perf matters, because each one has their strengths.

Josh 44:03
Yeah, I don’t know too much about Perf Matters.

Jon 44:05
Yeah, so perf matters. Yeah, I think a lot of people are sleeping on this one. This is a great plugin. So g brothers, Brian and Brett Jackson. They run Forge Media. They make a few plugins. And purge matters is their performance plugin. And it is not a caching plugin. It is more, I mean, I still might just throw it in this category of performance plugin. But it’s really where it really shines is asset optimization. And I guess let’s before we entirely segue into perf matters.

Jon 44:36
If I just wrap up WP rocket, then we’ll touch perf matters. So but things that you might use WP rocket for are the things that I use it for. If you’re not already lazy, lazy loading images somewhere you might use their lazy load living feature, although there are some other plugins that might actually do lazy loading in a way that you might prefer because there is a little different way that some might handle it. You might minify your CSS or JavaScript files, which just means you’re pulling out all the white spaces in between the different characters in a file. So that is literally just a shorter bit of text that your browser can zip through faster. That’s all minification is.

Hey, you shouldn’t run with scissors, but I’ll give them to you anyway. – Jon

Jon 44:41
You do still have the option to combine CSS and JavaScript files are the although that is not recommended for the most part these days. In WP rocket even tells you that in the settings that kind of says, you know, hey, this setting could break your site. If you toggle it on just letting you know it’s not recommended. But you could still do it. It’s kind of like I say, it’s like, Hey, you shouldn’t run with scissors, but I’ll give them to you anyway, but like, really be careful, okay.

Josh 45:39
And this to your point earlier to where a lot of these themes have these options where you want to be careful about having the same stuff selected, like Divi has almost all these options available as well where you can toggle all that on and off. So again, going back to that point, I don’t want to overlook that point. Because it’s so crucial. Make sure you don’t have the same settings toggle on if you’re doing and Same goes for like Divi plus the siteground plugin, even if you’re just using those two, you can still have the same settings toggled on that could potentially cause issues. So such an important point underlying all this.

Jon 46:11
And I’m glad you mentioned Divi because so Divi does offer the option in your theme settings to combine CSS, or minify. Forget it for minify. Yeah, yeah, it’s minify CSS, or you can minify JavaScript either, or you can do both. And that is specific to the theme files. Alright, so if you were to have a blank WordPress install, and then installed Divi run a run, like a GT metrics tests, you’ll see a lot of resources show up that are like some of those will be your WordPress core files, and the others will be Divi’s files. And if you were to just see the total number of requests, you might see where some people might decide they want, they do want to actually combine the files of the theme.

Jon 47:00
Because you’ll see in a page builder, at least there’s there’s often a lot of CSS files. And there could be a lot of JavaScript files, too, depending on what you’ve enabled. And some might say, hey, I’d rather just knock that down to two requests, like put all those CSS files together in one packet, put all the JavaScript in one packet. That way, it’s just two requests. But the problem is you end up with a really big file that often has a lot of unused CSS JavaScript is loaded, because you could just be loading, again, more unnecessary stuff, but it might make your page test give you a better score. So some people will do that just to get a better score, even though it’s not really advised.

Jon 47:35
But that’s to say, if you enable the minification on the Divi settings, that is just the theme. Okay, so that’s not minifying, your plugin and any other assets. So your plugins, CSS and JavaScript files are not being minified. If you turn on the settings in Divi that is just for the theme files being minified. So other things WP rocket will probably be used for, for a lot of folks is most recently, so WP rocket has for a while now have this feature called it’s delaying JavaScript, I always am tempted to mix up deferring and delaying you can still so deferring JavaScript just means Hey, we’re going to put those JavaScript files at the bottom of the waterfall, just make those be some of the last things that are requested for a page just so that they are not render blocking, they’re not slowing down your page loading.

Jon 48:29
Because if you’re, if your website is loading up, and you’ve got, hey, you’ve got the HTML of the page, then you’ve maybe you’ve got some CSS files, maybe you’ve got some images. If there’s a JavaScript file that is maybe higher up in the waterfall, well, the page load kind of has to stop, let’s finish processing that JavaScript. And then we can keep going doing other stuff that would be called a render blocking resource. And you’ll see that warning and a lot of speed tests. And so if you defer your JavaScript just push it all at the bottom, it kind of lists your your CSS files, your images, all those things come in first, in any render blocking JavaScript is pushed to the bottom. So that all kind of happens last and doesn’t kind of interrupt page load. That’s deferring.

Jon 49:05
Now, delay. Delaying is a newer feature. And I’ve got to give props to G Joe at WPS speed matters, because he kind of think was the first to kind of push this feature out onto the scene and some other plugins have since released the feature but he was the first one I ever saw doing this. But he released a plug in was either a year or two ago now called flying scripts. And that is one where you could actually select specific JavaScript files to not just be not be deferred push to the bottom of the waterfall, but actually wait until the page has finished loading. And then after the page is done, and the user can interact with the page and everything, then you load that JavaScript in the background for anything that is not required for the initial page to render. Okay, so this that kind of feature is available in WP rocket now and if you’re using a version of WP rocket that is version, three point it’s like three point 9.05 and on, it’s basically turned on automatically. Any versions prior to that you kind of had to manually select just like in flying scripts, you had to say hand select, you would go to the waterfall and say, Oh, this JavaScript is causing issues, let me delay that. This one, let me try to delay that. But now WP rocket, those that version in later, it’s automatic, and you have to actually manually exclude things if they’re causing issues.

Josh 50:26
So okay, and I do I was gonna say

Jon 50:28
It is problematic sometimes.

Josh 50:29
Okay, and I’m keeping notes of some of these resources we’re covering, because we’re covering over a lot. And I know you have more premium resources and the in depth video that we’re able to look at this in more detail. I do want to make sure we get through the rest of this too. I can’t believe we’re closing in on an hour already. We’re having so much fun talking about speed. But I do want to make sure we have time to cover all this here. John, So WP rock, any other final thoughts on WP rocket before perf matters? And then the final steps of the of the cocktail you got?

Jon 50:58
Yeah, yeah, that’s the last thing I want to mention for WP rocket. The delaying JavaScript is kind of the last main thing I will use that for. It does other things, too. But that is that’s everything I want to say on that one.

Josh 51:09
That’s interesting. Yeah. So and then perf matters. I’ve I’ve heard of it recently. I think somebody posted in the group. Yeah. What is that? I don’t know too much about that. I’m guessing that store for performance matters.

Jon 51:20
Yeah, yeah, play on words there. So perf matters. Again, I like to call it an asset manager. So there’s one feature in particular, that is really the performance booster here. It’s, it’s why it is included in the Holy Grail configuration. So they have what’s called the script manager. And that lets you pull up any particular page on your website, and look up, what resources are being loaded on the page. So it’s a really easy way for you to find out if a specific plug in plug in is running on your page when it doesn’t need to be. So let’s say you’ve got a form plugin, like our Contact Form seven example, that is loading on page when there’s no contact form, well, you don’t have to necessarily just uninstall that plug in and find a new, a new one that doesn’t load on every page, you could just say, hey, on this specific page, this plugin doesn’t need to run toggle.

Jon 52:13
And you’ve out automatically gotten rid of some unnecessary requests. And it doesn’t even have to be the entire plugin, let’s say because I know of a forum plug in or two that have a lot of requests. So WP devs form inator plugin is a great form plugin, but it does make a lot of requests. And the good news is, if you don’t need all of the features, then you can just toggle off, hey, I don’t need the CSS for the drop down selectors or the radio buttons or, you know, you just say I don’t need this part of it this part. So you can kind of take apart the pieces of the plugin, you don’t want loading and just load in the pieces you do, which can create issues for you. So if you this really has to be tested, if you start turning off parts of a plug in, you may not realize that some things are dependent on one another to work correctly.

Jon 52:59
And there is an option to toggle on in the settings in perf matters to show dependencies. So if you see, hey, this file depends on the other file to be present to work, then you don’t want to turn off one or the other, because they’re required in tandem. But if you don’t need either, will you turn them both off, and you’re fine. But that is the beauty of perf matters, you can turn off plugins either on a per page basis. Or you could just turn off parts of a plugin so lifter LMS that’s the that’s the LMS that’s the course plugin that I’m using for my course. And I didn’t know this until I started making the course but lifter LMS at least right now loads on every page in the site.

Jon 53:36
Well, the homepage of my website or the sales page for the course I don’t need doesn’t need lifter LMS loading there. And there are something like, you know, five different lifter LMS things that I can turn off, you know, it’s the course it’s some of the payment gateway things. They’re extensions to the plugin like they’re not needed. So you can turn those off. And so you’re automatically pulling requests out of the waterfall. So if you test your site before turning off some things, and then after the total number of requests really comes down, and your page load just speeds way up. So that’s the big biggest benefit of perf matters.

Jon 54:10
But it also does things like it can now automatically locally host your Google fonts. So it will scan your website to see what requests are you making out to Google. Okay, and let’s get rid of those third party requests. Right? We’re looking things up on another server. And let’s just store them locally on our server so we can serve it, you know, from right here. We don’t have to make that extra trip out. So the locally hosting of fonts is great. You can locally host your Google Analytics script. Which other plugins do to your site WP rocket, I think still offers that maybe not. Actually, I don’t think they do. I don’t think they do that anymore. I think they just let you delay it. But you can locally host your analytics if you want again, eliminates the third party requests. You can lazy load your images iframes that kind of thing. So you start seeing there there is some overlap between these Performance plugins, but you would just pick one place to turn it on.

Josh 55:03
And this sounds like a good thing like if if maybe your theme or a tool like lifter or anything else you’re using doesn’t have those options. This sounds like kind of the next best step right? where it’s like, Okay, well, here’s for sure what we can help with, with loading and making sure we don’t have too many resources all coming in on a page that don’t need it, potentially, so that I understand the value of that. That’s really cool. Okay, cool, cool.

Jon 55:27
And support super, super awesome. Brian and Brett are just incredibly responsive. And they’re, they’re a small team. So the plugin is certainly a smaller, smaller user base than WP rocket right now. WP rocket is slammed, you might be waiting a few days to get support in just because especially with the delay JavaScript functionality rolling out, it causes a lot of issues for people that might not know exactly what the feature does. And if if, if you’re not on a current enough version of WP rocket where they’re not automatically whitelisting, some JavaScript to Hey, let’s make sure this stuff doesn’t get delayed because it breaks the site. It’s breaking people sites. So you have to be selective sometimes. But for the most part, it’s it’s pretty stable in my experience right now using k sights on Divi cadence or generate press. But yeah,

Josh 56:19
Cool. All right, man. Here’s what the next one here. So CloudFlare premium plugins, got all the all the links, we’ve kind of covered here listed out. So we’ll put those in the show notes. Yeah. So maybe Can you just give us an overview of what we’re going to cover here as we wrap this up? And then maybe we can just dive into capping off this concoction?

Jon 56:35
Yeah. Alright, so that that secret sauce when you know how to set up CloudFlare? And you can on a yes, get your WP rocket turned on if the especially if any of the JavaScript can be delayed. So again, things that can be delayed, like Google Analytics is not required to fire before your page loads. That’s just the default behavior of it. Right? So your site will speed up for a fact there’s no question. If you just say, hey, wait to the page finishes loading comes in, and then you then fire Google Analytics, or Okay, then fire Google Tag Manager, or that kind of thing.

Jon 57:14
If you have a chat widget, your chat widget is not required for your site to display. Alright, so you can just delay that JavaScript. So really, if you know what’s running on your website, and you can, in in some cases, if you have to go through a waterfall chart to see, hey, what’s actually loading on this page, or use the script manager and perf matters to see what is loading on this page, then you can start doing that per page, fine tuning, that kind of rounds things out for you. Because once you’ve done the CloudFlare stuff, get all those free benefits, turn on some of the WP rocket stuff that gives you site wide benefits. And some of the perf matters setting TV site wide benefits.

Jon 57:47
But if you get into the per page, fine tuning, using the script manager that really brings it home in really reduces total number of requests. And when you’ve got all that in order, then it’s kind of like Well, let’s make sure our images are, you know, optimized and taken care of. And if we need to use some other CDN to deliver assets, we could look at that. But that is really the bread and butter. And you’ll see when you guys watch these videos that I’ll go through on Josh’s site, it may take me roughly an hour, maybe less to run through everything as I’m talking it through. But if I take on any site to do a speed optimization, a lot of the benefits since they are site wide, as soon as you turn them on, a lot of the benefits are knocked out in 30 minutes or less. And if I’m not talking, which I can do a lot of as evidenced by our chat today, if I’m not talking through why I’m doing what I’m doing, I can go through this very quickly, which ends up making site speed optimization, a really lucrative service offering. So that’s one of the things I

Josh 58:43
I and I feel Yeah, I’m a talker too. But it is good to get in the weeds on this stuff. Because if you just say okay, let’s select lazy, lazy loading, but you don’t say what it is or what it’s doing or how it might conflict with the theme then it’s much better to get into the weeds on this stuff. So no, I love that. And I knew this was an episode that we were going to get pretty far into the weeds on some stuff. But again, you can only cover so much via audio, which is why I’m glad that you got some additional resources that we’re about to get to but yeah, that’s great. Yeah, so so the premium CloudFlare the premium plugins I’m curious if we’re missing any steps Forgive me but image optimizers and hosting quick question. What are your top three image optimizer plugins that you would recommend? And then I want to follow up with asking you what you think the best three hosts are right now. But let’s start with image optimizer plugins. What do you think the top three are?

Jon 59:38
Alright, my recent favorite is the EWWW image optimizer, okay, or EWWW. It’s short for everything Worldwide Web. Shane Bishop, the developer behind that plugin, and I actually got that one just recently off of an app Sumo deal. Lifetime license for you know, unlimited sites and good bit bandwidth using their CDN, they use a bunnie CDN to deliver your image assets along with if you want to use that CDN, instead of maybe file players to deliver your other assets, your CSS, JavaScript, all of that, you can actually use their CDN for asset delivery. And that’s just baked in to the plugin.

Jon 1:00:18
So it’s an image optimizer plugin that does, you can select from different levels of compression for your images. So especially if you’ve got someone that’s very conscious of image quality photographers, and that kind of thing, you can really make sure to select some kind of lossless optimization that is going to leave those images crisp, even on a retina screen. But if you’ve got someone that doesn’t care about the quality as much, you could compress the heck out of them using a more strong compression, where the image quality is still not bad or anything, but it’s just Hey, if the person’s not overly concerned with it, then I just like that you can pick from different levels of compression, and I like the CD that comes with it.

Jon 1:00:55
So that is a great one. And I personally slept on that one for a while, because I’ve heard it heard about it for years. But I thought the name of it is you. So I automatically Yeah, you know, it looks cool and heard of it. Yeah, it is a really great one. So there’s a free version and a paid version. So even the free version is great. You just don’t get the CDN stuff for free. But it is a solid plugin. And I’m actually interviewing Shane next week. So by the time this episode comes out, there will be an interview on my YouTube channel with him talking image optimization, so stay tuned for that.

Jon 1:01:25
But that is my absolute favorite Short Pixel is would be next. And that’s really the one a lot of especially photography run in circles online with some photographers and work with wedding photographers a lot, but short pixel seems to be the go to for them. And that one works on a credit based system where you have to purchase, you know, a certain number of credits to process individual images, which can be very affordable for sites that don’t have a lot of images. But if you’ve got a photography client that’s got, hey, I’ve got 10,000 images on my site, I want to compress all of them, you know, then the credits can add up. And that’s where I like the, you know, with EWW, it is really a with the license that I’ve got, at least it is like, hey, unlimited compression, it’s just, you know, you’ve got it, even if you end up paying more for the plugin than you would ever for credit. I just like knowing I’ve got something for life, and I’m not paying more for it. And I’m using it across a lot of sites. So I like that.

Jon 1:02:17
And then smoosh smoosh by WP me def free version is great. You just got one level of compression though. So that could be a downside. And then you can only compress 50 images at a time. So it’ll run through 50 images. And then you have to manually click, you know, hey, do the next 50. So if you’ve got a lot of a lot of images, it can take a while in on big sites, especially photographer sites, sometimes you have to cut on if even if you’re doing one that just automatically runs through everything you have to cut it on. And just it might sit for a day or more. You know, I’ve had a photographer site where I literally just had to set it up in my computer leaving that tab open. And it just processed images for upwards of like 30 hours. So the free smoosh just you have to manually do all that. But those are my top three.

Josh 1:03:00
Awesome, awesome. All right, what about host top three hosts that you’ve seen sites do well on because again, we realized we kind of established in the beginning, that is really the foundation that your site is on. So I know you can do a lot with a site on GoDaddy, but it certainly would help if it’s on good hosting. So yeah, I’m curious to get your thoughts on your top three hosts recommendations.

Jon 1:03:20
Yeah, so top three hosts. So in my opinion, if you’re one that doesn’t want to get off in the weeds, you want to have some kind of managed hosting, you want to have support that you can just reach out to and say, Hey, something’s not working the way I think it should, or Hey, I need help on this or that support can take care of it for you. I’m a big fan of flywheel. I’ve used them for a few years now. And in flywheel was acquired by WP Engine a year or two ago at this point. So they run on some similar infrastructure, Google Cloud, cloud compute for what they do. So it’s it’s great hardware as far as the server stuff goes. And there’s great support. So I can’t say enough good things about flywheel and WP engine that Elm is considering the same even though they’re not identical. They’re similar enough that I would maybe put those two as the same category. And is what is

Josh 1:04:08
What is the difference between sounds? We’re getting a WP Engine next. Was that the next one?

Jon 1:04:14
Yeah, yeah. So WP Engine, really the difference there is that there’s been this merger between the two companies where they’re maybe sharing some infrastructure now, whereas they were previously separate. And they’re kind of maybe blending some methodologies. So there there are some aspects of performance that will be a touch better on WP Engine. But where flywheel really shines is they’re really catered towards, like sure if you have one website, still great to use flywheel. They really cater towards, you know, developers or web designers, agencies that really want to scale and have multiple websites. They’re really good as well.

Josh 1:04:53
Yeah, I’ve heard that as well. It’s one of the best for scaling for agencies.

Jon 1:04:58
Yeah, so that’s, that’s really where they shine. And they’ve got This new feature called Growth Suite, if you which requires you to buy this package where you get at least 30 sites with them 30 slots for sites and then also access to their billing platform which lets you manage your client you know, billing and their hosting and all from one centralized dashboard so flywheel is really geared towards taking care of agencies and whatnot that want managed hosting for the clients.

Josh 1:05:21
Or WPEngine.

Jon 1:05:24
Sorry, growth Growth Suite is with with flywheel.

Josh 1:05:28
Oh gotcha,

Jon 1:05:28
WP Engine may take that on at some point later. But right now it’s it’s really, WP engine would be almost like more of the enterprise level kind of offerings. Like if there are really big sites or you know, websites that really have higher performance demands, they might actually steer you towards using WP Engine instead just for their infrastructure. But again, they’re virtually they’re the same company. Now, there’s just subtle differences. But I would say go flywheel just because I’ve used them for a while myself. And then last hosts that I would say, and again, this is managed host Kinsa is phenomenal. They’re just one of the more expensive if not the most expensive managed hosts out there. If shared I know of no more than three siteground is my go to for shared if you’re in the US. If you’re in the UK, I know that more recently WPS and crystal are both two hosts. So going way over the three limit, but in the UK friends that I’ve worked with recently, Krystal and WPX are popular across the pond.

Josh 1:06:27
Gotcha, gotcha. Okay, cool, cool, good options there. And the I’ve heard a lot of the same way. My recommendations are always siteground flywheel and then WP Engine for the more like I said, like legit agency enterprise. But I do feel like for the most part siteground flywheels and seem to be seem to be fine for most everybody. Okay, john

Jon 1:06:48
Just a slight note on so for those that don’t mind potentially getting in the weeds on their own hosting stuff, you can save some money, if you kind of edge out some of the premium you pay for support by going to a managed host, you can get a little bit better hardware. As far as your server configuration goes, if you go through something like Cloudways, or Gridpain, and this could be an entire separate conversation, but you can if you’re comfortable doing your own server tweaking, and you don’t mind learning some things, you can do some of that yourself and actually get your hosting for cheaper. Again, if you go through cloudways, or great pain to use a provider like Digital Ocean or vulture or some of the other service providers that they offer. So that’s for those that want to get technical and want to get their hands dirty. But that is not an option I would recommend for people that really just need someone to support them and take care of all that stuff.

Josh 1:07:38
I’m sure 99% of people listening are like Yep, not interested in that. Yeah, that’s the camp I fall into. Alright, man, I got one final question for you. Because this has been really great. Man. I know we’ve we’ve we’ve gotten pretty far into a lot of this stuff. And again, I know we went as far as we could, without getting into visuals, but you do have some resources for us those for those who want to go further. I know you’ve got some free and premium resources, where would you like everyone to go? to kind of take the next step on all this year, John?

Jon 1:08:07
Yeah, so if you would like to learn a little more about WordPress performance, and specifically the resources we’ve mentioned here, you’re gonna see me run through the sites of Josh’s if you will go to Holy Grail WP.com/JoshHall, all one word, no space there. That’ll be the hub where you’ll find resources specific to this chat, as well as if you end up on the site there, you’ll find your way to the sales page for the course. There’s, there’s a mini course you can take, that’s pretty extensive, actually. So you know, again, without spending a dime to go through the mini course, get yourself on a free CloudFlare account, you may find that you get all the performance benefits that you want, without spending any money. But if you really want to take things next level, then you can get into the course and also the premium community. So there’ll be a free circle community and there’ll be a premium circle.

Josh 1:08:57
That’s right you’re using Circle. Yeah,

Jon 1:08:59
I heard about that from you. And I was just like, I really don’t want to have a Facebook community for the group. I want to I want to get away from that. So thank you for mentioning that. I’m gonna use Circle there. So yeah.

Josh 1:09:08
It’s great, isn’t it? It’s it’s a great lightweight, slick platform, man. And it’s, I mean, it’s early on, there’s still a lot of functions that I can’t wait for them to add. But they’re they’re very customer focused. And they’re they’re doing great stuff. That’s awesome.

Jon 1:09:19
Yeah, love that. So in for listeners, this podcast, the course will be live in early bird or launch pricing will be gone by the time this episode airs. But I do have a 20% off coupon for your audience. That’ll just be Josh 20 at checkout. So everybody listening come in, get you some get you some discounts on that and that that’ll stay live for ever and ever. The launch pricing is gone, but that I do not offer discounts on much of anything that I do. So this is a super special secret. Don’t tell anybody This is just for Josh’s audience.

Josh 1:09:53
Yeah, this is a man will have it linked in the show notes. I’m looking at your outline of the course right now. And it really is basically like every thing we’ve talked about in this episode. So far, it just goes into more detail with videos and more resources on each one. So I think this is gonna be super beneficial. Man, I know, at the time of recording this, you’re working on the sites that being agency have handed over to you right now. So probably by the time I record the intro for this all kind of talk about some of the results that we got with working on some of this stuff. So that’s great, man, a lot of awesome stuff here.

Josh 1:10:26
Last question for you, john, these, and I just, I want your honest opinion on this stuff. So many people put so much stock in gt metrics and these site metric tools. Personally, I never use them, I do the common sense test. And as long as it loads pretty quick, like my site, I’ve got a lot of work to do on speed wise, but it’s never been a problem. I’ve never had anyone say it’s loading too slow for me. And I have a lot of different plugins, a lot of different resources and a lot of things that I have already learned over the past couple years that I wish I would have done early on, but I can still tweak and in Tinker, like we talked about with all the tools and methods here. These site metric and analytic tools. What are your thoughts on them? Do you feel like they are super important? And we should do them? Do you feel like they’re overrated? Yeah, your thoughts on gt metrics and all these tools that people get so hung up on?

Jon 1:11:22
Yeah, it can easily become an object of obsession to, hey, I’ve got to get all greens, you know, I need, you know, A literary grades on everything. And some people, I’ve been in some groups for years, and I feel like I see the same person or same people that are just like, gosh, you know, my PageSpeed Insights is at a 99 on mobile, how do I get it to 100. And it’s like, Look, if you’ve gotten 90 or above on the mobile PageSpeed Insights, I mean, you’re already crushing it, you might want to move on to something else. Because there, there are diminishing returns for all the effort, like the effort that it took you to go from a 30 on, you know, that test on mobile to a 80 or 90, it might take twice as much work to try to push you, you know, to the remaining, if you’re just trying to get to, you know, just this number of 100.

Jon 1:12:10
It’s not necessary, you don’t have to do it. And I’ll say this, too, that whatever tests that you use, if you’ve got a waterfall that shows you, not just fully loaded time, but on load time, that’s what actually matters. Fully Loaded time can go out the window, because what the user experiences as a fast website is how much time passes for onload to happen. And you’ll see it in gt metrics, if you look through the little notes at the bottom of your, at the bottom of the waterfall, when onload hits. That’s what the user experiences as Hey, the page is loaded, it’s done. onload might happen in you know, one second or less, but fully loaded, maybe six 7, 12 seconds. But the user is none the wiser, because the user is already experiencing your website, they can scroll, they can interact with things. But you may still have some stuff loading in the background. And that’s fully loaded time.

Jon 1:13:01
So I’d say Pay no mind to fully loaded, just look at your onload. If you can get onload in good territory, then you’re golden, I like to see it under one second myself for onload, fully loaded, really don’t care. So no matter what tool you use, that is the rule of thumb, get your onload in good position, and your sites will feel fast. And they will pass like you said, the common sense test. If you pull it up on your mobile device or whatever, you’re good, the way that people get really tripped up is when you use any of these tests that simulate a mobile device. That’s really where it’s tougher to score because you’re using a throttled, emulated, like 3g connection, sometimes maybe it’s a 4g connection. But they’re essentially modeling a really poor, you know, mobile internet connection on a actually a pretty old device.

Jon 1:13:48
So there’s some artificial throttling in there. And while Yes, we want to make the internet accessible to everyone, you know, that’d be great if your audience is not necessarily in a very rural area where they’ve got no good internet. And you can trust that if someone wants to get on your website on some decent Wi Fi, they’ll be able to access it. I say don’t obsess over the mobile score even. But if you really want to make your website accessible to the entire world, then you might get a little more concerned with your mobile score. But just take into account there’s some artificial throttling that happens on the mobile test. So you might pay attention more to the desktop kind of score you get which is more of a not necessarily a wired connection, but a stronger connection for sure.

Josh 1:14:28
Yeah, yeah. So would you say when it comes to these tools, like gt metrics and stuff take it with a grain of salt maybe like you know, it may be it’s important but not the end all because I I’ve got a lot of sites that you know, even my site doesn’t load super fast right now on that but it’s fine it like it’s working fine. I know. I’ve got work to do. And I’m going to continue to utilize you and a lot of these tactics and stuff but by golly, the common sense test I think is overlooked often.

It does not matter how fast your site loads, if nobody cares about the content, if it’s just not actually helping anybody. – Jon

Jon 1:14:59
Yeah And look in these groups that are really obsessed with speed. You see it all the time, people are just like, gosh, I need that last two points or something, it’s just like, that’s really not worth it, it doesn’t matter. Look, bro, pull up your site, it loads really fast on my phone, you know, on, you know, a mobile connection, it’s fine. But some just prioritize speed over even the content. Here’s the thing I love, I love to make this note too. It does not matter how fast your site loads, if nobody cares about the content, if it’s just not actually helping anybody. If it’s not leading to some kind of sales or generating leads, you might, you know, at a certain point, stop worrying with your website performance. And you might need to focus on copywriting, he might need to focus on your messaging, and maybe layouts of your page to focus on conversions or something like that. Because just having a fast website doesn’t mean anyone’s gonna care about it. Right? You’ve got to have good service offerings, providing good value. If you can deliver a valuable site fast, that’s cool. But if you just deliver a dumpster fire that just helps people see hot garbage even faster. So it’s, it’s really you really got to you know, balance it out, like yeah, good, good quality content, and then loading fast is great. So

Josh 1:16:11
That’s a great point, man, it’s so great to hear somebody who’s you know, really far into speed optimization say that because that is such an important point I back that up 100%. So that’s a great way to end this to put a cap on this conversation man, john, thank you so much for your time and traditionelle a lot of in depth knowledge on this again, we’ll have this linked in the show notes everyone can go to holy grail WP com/ Josh Hall, one word, and I know you’ve got a lot of resources for everybody there. So man, thank you so much for your time. I’m excited to continue working with you. And man, this has been really cool. It’s been in depth. I’ve learned a lot. I think this is one of the podcasts I’ve potentially learned the most on. So thanks so much for sharing your expertise, and I’m sure this won’t be the last time in.

Jon 1:16:52
Yeah, hey, let’s chat again soon if you don’t mind getting another earful. Thanks for having me on.

Josh 1:16:57
Cheers. Thanks John.