When a website is slow, it can be due to many different reasons. Finding out what those reasons are can seem like finding a needle in a haystack if you don’t know where to look.
The good news is there are simple and quick ways to figure out what’s slowing down your website.
The best way to figure out what’s slowing down your website is to either use Google Chrome’s performance tool or to do a performance audit with Google’s PageSpeed Insights. If you’re on a mobile device, you’ll want to use the speed audit method as Google’s Chrome App doesn’t provide the tool you’d need.
Method 1: Using Chromes Performance Tool
This tool will give you a visual representation of the loading of your website’s files and images. It comes off as technical, so it’s not the faintest of users (if your less technical try the speed audit).
- Start by opening up the website you want to test in the Google Chrome browser. Remember that you’re testing the page of a website, not the website itself. Other or specific pages might also have specific issues going so be sure to check all the most important pages.
- Press F12 to open the Page Inspector. When it opens, be sure to resize it to make it bigger to have more space to read the data. Then, click on the Network tab in the Inspector.
- Click the record button for the browser to begin recording and watching the loading of files. When it’s recording, the button will turn red.
- After clicking the record button, refresh the website page as you normally would any website.
- Wait for the website to fully load. You’ll know when it’s completely finished loading when the spinning/loading icon disappears beside the title of the tab.
- Click the red record button to stop recording
- Expand the Waterfall tab to see the order, size, and loading duration of each of the assets on your website.
By looking at how long the assets take to load you can see what’s holding up your website from loading fast. The important columns to look for are Name, Type, and Waterfall.
Name is just the name of the file being loaded (which also includes the file type) like script.js. Type is the type of file being loaded like .jpg or .js. Lastly, Waterfall is a timeline that shows when and how long the file takes to load. The wider the waterfall block is, the longer it took to load.
From the waterfall, you should be able to tell what’s slowing down your website. The widest and longest loading file is probably your issue, though many slow-loading files could be your issue.
The example above is the waterfall loading of a font (Inter-Extrabold.woff) that’s loading a lot slower than the other files.
Files normally load in order, one after the other. But in this example, the font is loading asynchronously meaning its loads alongside the regular loading of other elements. If the file loading in the waterfall isn’t halting the loading of other elements, it most likely isn’t the problem that’s causing your website to be slow unless it’s excessively wide (taking a long time to load).
If you’re looking into the homepage of your website it might look like the example above where the website’s domain name is first to load and taking a long time to load.
In my example it isn’t too extreme, but if your if it looks like mine then it’s your website’s hosting that’s the problem. Basically, you’re hosting is slow, and your most likely hosting with Godaddy as it’s when of the slowest hosting platforms. There’s good news, just switch to a better hosting platform like SiteGround for faster hosting.
Method 2: Speed Performance Audit
A speed audit is the best way for someone non-technical to see why there website is loading slow.
There are 2 good websites out there best for performing speed tests/audits on your website; Google’s PageSpeed Insights and GT Metrix. Id recommend Google’s speed test as it comes off a little more user-friendly.
Start by opening one of the speed testers and putting in the URL of your website. Click Analyze and wait for your results!
The results you get will be different for every website, but it will show you what areas could be improved on the website.
Here some of the different things that the audit may suggest to improve:
Reduce initial server response time
This essentially comes down how fast how your hosting is. Godaddy is infamous for having a low TTFP, or server response time.
Serve images in next-gen formats
This is because your images file types are .png and .jpg. The file type .webp is the fastest-loading of all the file types, so thats Google’s way of suggesting you convert those png’s and jpg’s to that file size. You can do convert them manually, but there are WordPress plugins that can help do this automatically with a click of a button.
Defer offscreen images
This means you should be lazy-loading your images. Lazy-loading is when the images at the bottom of the page load last, and the first ones load first and so the initial loading of the page becomes faster.
There are WordPress plugins that can do this. Just search “lazy load” in the plugin store and there are multiple plugins to choose from. Just be careful with this, because some websites start to act funny once lazy loading is introduced. Some plugins do it differently, so if your website isn’t lazy-loading the images correctly try a different plugin.
This usually comes up with WordPress sites that use big themes that are “Multi-purpose” because its loading a lot of code that covers a lot of different (possibly unused) elements.
Eliminate render-blocking resources
Generally speaking, this means you have a lot on your website going on causing important files to load later when it’s better to have them loading sooner. You may have a lot of libraries, files, or plugins being loaded in every page load. You can help cut this down by deactivating unnecessary plugins and libraries.
Overall this can also be a tricky one to improve because a website can have a lot of files loading in, and figuring out what each file is and when it should load in what order is a lengthy process. Thankfully there are some plugins that can help like Plugins Load Order.
Overall once you start to tackle each of these issues slowing down your website one-by-one it load faster. If you’re website is above 70% on desktop and 50% on mobile, it’s quite good. Try not to aim for 100% as sometimes this isn’t realistic, optimize what the audit says and improve!
If you’re looking to optimize your WordPress website without plugins with a step-by-step tutorial check out the article I made to do so!