0:03
Alright, Hi, I’m Michael Borgelt here with the crazy optimizer Abdul and we’re going to go through another site and kind of talk about how we optimize it a couple tools that we used, and the process a little background about us. I’m the founder and owner of 51 blocks and the WP help. Abdul has been doing optimization for a long time, but I’ll let him give a little bit of his background and we’ll kind of go from there.
0:30
Hi, thank you, Michael. Yep, I think for me, I have been a digital marketer for like 15 years now. So started marketing, ended up doing optimization and all that as well, because being a marketer for so long, I know how important speed is for websites, how important it is to rank or how what it takes to give a good experience to customers. So that’s where I entered into the optimization space. And I think right now what things we’re doing with WP help. That’s what we’re doing. We’re focusing on helping ecommerce businesses helping Small businesses even helping agencies optimize their websites. So they get a better performance, better user experience and even sensor to give better rankings as well. on Google.
1:09
Yeah, exactly. And that’s kind of what we’ve seen, we’ve seen an increase between 18 and 40%. In conversions, and we do see an increase in overall users to the site, not organic, necessarily, but we have seen rankings increase, but total users and bounce rates have dropped as well. So all those analytics, all those metrics you kind of looking for in regards to you know, search, engine marketing, or even presenting to clients. These are the types of things but the most, I think, I guess, shocking thing, I think last week, we had somebody said, What did they say something like, how is it? Yeah, how is this possible is how did some How’s this possible? Is what somebody is saying now, so it’s pretty fun to get those types of responses. I’ll just quickly talk about this site and then Abdul Have you talked a little bit about it? This is justice, Florida. It’s a client that came to us a law a law site Performance before, why pay are on gt metrics performance was 53%, both scores of ii 3% for page score and why slow was 55 a load time of 3.2 seconds, so not too bad and regards to load time. And a number of requests 111. And after I handed it over to the crazy optimizer and he did his thing, we got a results of the following, which is pretty incredible, right? Page Page Speed score of 100 and a Weiss low score of 89 or 98, sorry, with a load time of 7.7 seconds. So 700 milliseconds. So that’s pretty incredible with a number of requests of 19. So you know, that’s a lot. Let’s just talk a little bit about that. So how are we able to reduce because I think it really comes down to the number of requests, which then fully affect the load time, which obviously runs the scores for the PageSpeed score. So talk about how we’re able to reduce the number of requests and kind of go from there. Okay, I think
3:01
like you said, rightly that Norfolk Westlake have a very direct impact on the load time and on certain elements of the PageSpeed schools as well. Because the more request it takes me, the problem has to make to get a page loaded, the more time it will take. And even as a single request, if it gets not like if it is going to external site or somewhere, and it takes time, it will take the whole load time of some mostly the number of requests that we reduce, or the internet requests because, like, I think developers especially they do a good job making websites. But when it comes to optimizations, because we work with you use a lot of plugins, you use a lot of different things to make things work, right. So each plugin, or each theme that you use, or each feature that would have built into it. There’s a picture for you using a separate CSS file for that. You’re using a separate JavaScript file for that, that starts becoming a lot of files that have to be loaded. So one of the key things that we do as he met him, unify the files, which is a standard thing you introduce a Please give us the things that are in necessary. And we also combine them to become, we try to make sure that we combine all the files that can be combined, because sometimes some files you cannot combine. Because, ideally, two sequest should be one or five, something like that. But the reason it’s 19, or maybe the 20 the ages is because we cannot combine all files because certain files need to be loaded on their own, to make sure they keep working, but which made sure that we combined all the files, all the files that can be combined JavaScript files. So the problem is doing just one request. Instead of doing like 30 requests for the same 30 files, we all everything is coming to it in one go. So that is how we reduce the requests. And that directly affects the east side as well. And the load time as well.
4:43
Yeah, I guess I should have mentioned that as well, right. The page speed, the page load is five megabytes, five and a half megabytes here and, you know, 300 kilobytes here. So pretty, pretty amazing there. So you mentioned two things that I kind of want to dive into as you were talking there. One was minification. You know, either Obviously, you know, a lot of these caching tools have minification. Why don’t you talk a little bit about what minification is, and what it does to the website in order to performance that will be one. And then I want to talk to after that a little bit about load time, and how different tools measure load time, like we’ve seen, even internal tools that we’re using, identifying different load times. So let’s talk a little bit about those two things. So minification to start, what is it? And you know, how are we able to, I guess manipulate it? So
5:29
okay, I think in very simple terms, minification is removing all the whitespace that said, all the beautification things, all the comments are added to a file, right? Because they are needed for humans, like when I reading, like a file of code. For any good developers writing it, they make sure there’s a lot of white space there. It’s easily understandable. There are a lot of comments that make sure people understand what the court is doing, but they are needed for the browser to execute the code. So One of the key things in a very simple terms that Adele is removing all these white spaces and all these comments that are layered in in data that’s in the file, remove. So maybe even more catchy to that, because that is like caching or optimization one on one, if you have a file, because you can reduce the size a lot, especially with large CSS files, especially with if you have a very large team that’s being run, you have an e commerce website, there’s a chance that your CSS files will be huge, because of all the commits that are they are the white spaces that are there. So just removing that reduces the number of site the size of thin and the number of lines and everything. So the the browser’s a little faster, it doesn’t take as much time to read it and reduces the page load the page size. So that reduces the page load time.
6:46
So yeah, exactly. I think that’s the key thing with minification year, you know, when we sometimes write code, you know, we make it look pretty, right. It’s got these different blocks and all these different things. It’s very, very readable. But then for search engines, they don’t want all this extra space, which adds page size, right? And then minification. That’s why we’re able to reduce the page size overall.
7:07
And the thing is that like, you can modify HTML as well, you can modify the ffl. And you can modify JavaScript as well. html and CFF are the simpler parts of minification. Because it’s normally removing the comments, it’s removing the white spaces. When it comes to JavaScript, that’s where certain tricky aspects start coming in for minification. So it’s like minification is not something for most websites. It’s like, okay, simple, you can just do it, and it works. But for a lot of websites, especially when it’s ecommerce, especially if they’re a custom development done to them. minification is also like some trial and error process involved in that, because certain types of identification, especially for JavaScript, even CFF change the behavior of the website. So I think that is one thing for us, which which we do whenever we optimize a website is we once we optimize it, we make sure it’s working. It works, some type of functional testing as well because you don’t know because minification There, you have allowed a system to optimize your code, right? So it’s very important to make sure that you check it. You check the whole website after that to make sure everything is working at the truth. Because certain times, especially when it comes to the fix of a custom developer site, the chances that something has is not performing as a true.
8:17
And I would even even say even not even custom, not even custom sites. Sometimes I remember, before I had the crazy optimizer on my team, I would go in and use WP rocket or WEC, and you know, check minification and through JavaScript or these other things, and all of a sudden I would break sites and I didn’t necessarily know why. Right? So I’d have to go and roll back and kind of like you said, a little trial and error just to figure out what I was breaking or not. Now, I think we spent a little bit of more time I guess, optimizing the site in regards to JavaScript and making sure that we’re not affecting the site and make sure it’s still performance. Same level that it was. And this one actually had a set at a section like that the review section that we had to kind of work through to get it to work properly. If you remember, when we when we did this that we actually had to do some, like, I don’t know if it’s custom coding, but additional testing to make sure that it launched properly. So low time, let’s talk about load time. You know, obviously, that’s very important. That’s, you know, one of the things when we present to clients or agencies that we talk about of how we’re reducing load time, and you know, Google’s coming out and alerting people with flow, slow loading sites, and how its measured differently even within tools that people use, right, like, and I guess quickly, I’ll just show you before we get too far down that because a lot of people do use Google page speed and GT metrics, two different tools people use, there’s, there’s hundreds of tools out there paying them, you know, other types of testing tools that people use to measure speed here Here you can see, prior this site, the Justice Florida calm, the mobile score was a 14, and the desktop score was at 54. And then afterwards after our optimization was a 99, and 100, right? Were you able to get a little bit better scores almost always on desktop, just because mobile is a little bit more tricky. But let’s talk a little bit about, um, like I said, the low time and how people measure it differently. And if you can just elaborate on that.
10:27
Okay, so one of the things that in a bigger The biggest difference in May into this,
10:33
because definitely each tool
10:34
has its own color, the right the GT metrics is on
10:37
what
10:38
you call it, some of when, when they when, when how they’re measuring the website, when do the data cut off? Are they are they looking at downloaded on finished? What are they looking at? So download or Dom finish can be a big thing
10:49
that people are using to measure?
10:51
Yes, because at first contentful like with gt metrics, because it’s kind of a baseline. It’s like every it’s a tool that everyone knows and everyone uses that A tool that we rely on, that’s where we create our baselines on. But like there are certain tools where I’ve seen that the numbers, especially the load time, when you talk about PHP code, because that’s Google’s algorithm so that you know rails find it very similar to each to like, there might be a one or two point difference, but you’ll always find like, it’s very similar. The only main difference starts coming in when you talk start talking about the load time. Because the way we optimize it, we remove vendor blocking scripts, that’s the biggest difference that we get, remove render blocking scripts we remove, we have a few small customizations done in the pool that we do not know the non essential scripts as well, because there are certain scripts on a page, which do not need to be loaded unless it’s the user actually starts browsing the page. So that keeps a load offers I was at well and that also serves the website fast as well. Then we also lazy load the images that we don’t load the images. Like we only know the surface Don’t worry, don’t see images on the phone. Any images that are under the fold. They get oriented. People start scrolling down. So now what happens is certain tools have different ways of measuring that certain tools like I’ve, I think we were talking about another tool yesterday as well, that was waiting for everything to load. So that was taking up like giving us wrong score. So that’s the wrong score, we cannot rely on that. Because that’s not how a user will see the tool because if, because we have instructed, our system will not load things. So it will just take forever to load them, right? Because this tool is waiting for them to load by, we are not loading them. So then it comes up megatrend website is giving us one second load time on that, too, it might come 10 seconds, it just kept waiting for it to load. So I think gt metrics in my experience has been one of the good ones, they call it in that they use that the way they measure it’s very similar to a normal user, a real user. So it doesn’t feel like a tool, measuring it externally. Like if you go to a website, the way you’ll start using it. That’s how gt metrics use it because for you, what’s important as a visitor is that once you click on a website, it’s loaded. For you what what’s inside what’s underneath school doesn’t matter for you. So you only need that once you start scrolling down, and by the time it starts going down, everything would be ready there as well. So one of the biggest impact areas where you get a good paid speak question is good time. So be focused on these things. You focus on this up, scripts, optimization, mainly, making sure that scripts are loaded at the right time, the images are at the right time, you do not know everything up front and keep the user waiting for five seconds, eight seconds for everything more when they when they just start to win. They just need to mean a yes, I mean, for for to start looking at the website. Yeah,
13:33
yeah, no, that’s, that’s a great point that no reasonable to have to affect the Page Speed score is waiting on things that are loading that are not going to be viewed and may not be viewed at all by somebody, right? If they don’t scroll. So that’s kind of that that’s a great point and in and how low times vary so significantly based on the tool you’re using. That’s why it’s always we use gt metrics and Google PageSpeed scores because those are probably The two most recognizable ones in the industry than that most people use, you know, we have no problem testing against other tools as well, we’ll see the same similar results, as long as they understand that, you know that. At what point are you stop counting the load time right now? We’re only trying to do that through certain, you know, aspects of the site. So, is there anything else you want to cover today? Or should we just kind of leave it at that and, and go forward?
14:29
I think I think we love you a lot. So extensive. So I think this in this one, I think there’s a few things that I if if you if you can go to the other before. Yeah. If you know, when people look at this, a lot of insights that you’re getting right, except extending you like that. The key for optimization is making sure that these best practices are followed. These are kind of best practices, I would say that Google is telling you or Whitestone is telling you what you need to do to get a good score. When you do these things, it’s it’s it will directly affect the page load time. So like these things, there are certain areas where page go to load time is affected by the type of service that you have the type of because you can be in a very, you can be with a very bad host right, which we even if you do everything, complete everything here, but the servers your honor way slow or way loaded. Like there’s a lot of people on that. So that will definitely you cannot to improve that, which is a difference like that he have that the servers that we use are like state of the art. We are input data center, we’re using Amazon CDN. So we make sure that the sites like from the server side of stuff, the have all of our customers covered that. There’s no load on the servers as like your website. When a visitor comes to your website, they don’t have to wait on other websites, or other BSP workers to complete that work. Because that’s a big difference in managed hosting. Many people many hosts are limiting USB workers that limit up to workers or for workers. Right now we do not have such hard limits we have, we do have some soft limits, but there they are, like at 12 1618, like on toe at the very highest side where a normal website won’t even reach that. But they’re just there to make sure that not like we control us our resources as well. But we are very generous when it comes to ESP workers. So that’s also a big thing, when you have the equal coming to your website, that actually the server resources for PHP is available for your visitor to get visitors request to get executed. Because if they keep waiting on that, that even if you do all these things complete them, the pace of time will increase, everything will increase because you will be waiting on the server to in the queue to get your request served. So I think for us like it’s very important to like for me and when WP help that we manage both sites, we manage the websites optimization as well and we manage our servers well as well. We make sure that as factors when you optimize fighting, both these things combined play a very big role in a Peace Corps time. Because I think Yeah, that’s right.
17:03
Yeah, I think that’s a great point, I actually think you just created the content for our next three videos, I think what we should do is really dive into, you know, some of these results and what they mean, and how to fix them. And then, you know, showing, you know, how we’re able to address them through our, our technology stack that we use. And I think we could, you know, what does it mean to optimize images or reduce service, you know, serve scaled images, you talked about that, you know, before were, you know, they load a huge 1000 by 1500, and only needs to be to 74 by 114, or, or 411. Right? And that that’s just a simple optimization that needs to happen. But a lot of developers don’t do that. And I mean, there’s all kinds of as you go through this list, right? Not have developers
17:46
in this as well, because what happens is when you’re writing blog posts, or you’re writing a new thing, as it as it as a normal business, or as a blogger who’s not a technical, what you normally tend to do is like even if your image, you know, your image sizes like let’s say 500 I found it, you get a good, very good nice looking image from some Shutterstock ROI, a picture that you took, and you will upload it completely. Now you don’t need that image there because you now loaded a like a six MB image where you just need like a few cavies for that. And also those images are very high quality. So they have a lot of optimization room as well. So like, like I think, I think we’ve talked about this as this served scale images, one of the biggest impacts, I’ve seen it have very big impact on load time as well in a very, very big factory in PHP schools as well, because you need to load images as to the size that you want them and their tools to do that. I think we in the last year we mentioned short pixel image.
18:43
I think they’re doing a very good job at that.
18:45
That their their plugin. It does this optimization of images as well it optimizes your images so they are compressed, and it also load scaled images so it doesn’t load the full size image. It loads a scaled image of the sites that we’ve got and they also had a CD into it for like the cover All that part like to it’s these guys are doing a very good job and they can get you like it just these two points can be solved by them. So I think the idea here is knowing which things solve these, which points they help you get I think it’s a good idea to talk on each of these points and later videos of how people can solve them. And like how much they impact or look at all these things are impacting your face Bitcoin well, and you looked at both
19:23
Yeah, I think that’s a great next like I said, three videos will walk through each of these dive into the most common areas you’ll always see serve scaled images, you always see optimized images, you always see differ. arson of JavaScript, you always see those are standard things. you minimize resurrects most of those three, those four things are always there. And same with why slow right? It’s usually a use a CDN minified JavaScript, avoid redirects and the ad expires right? Most of the time, those are the most common ones that are added sometimes compressions in there because people haven’t enabled, you know, compression or things like that. And then we’ll briefly talk about like, How, what the waterfall does and, and kind of look through that. So people can, you know, maybe address some of these issues to speed up their sites as Google starting to roll out that the warnings have slowed page speeds. So we’re going to keep this one a little shorter than the last one. Thank you for joining me again, Abdul will come back next week, and we’ll talk about the PageSpeed and why slow scores and we’ll start with PageSpeed first and just dive into that and it’ll be a hopefully a 10 or 15 minute video just talking a little bit about those items. But once again, I’m Michael. That’s Abdul, the crazy optimizer who knows the ins and outs of all this stuff. We’re from 51 blocks and WP help if you need any help with your website, loading time and you really want to have truly managed WordPress help. Please give us a call.
20:49
Thanks you. Thank you. Bye
Transcribed by https://otter.ai