Why is my website running slow?
First of all, please note that the Phlox home website is also completely built with Phlox theme and here is the performance report by GTmetrix:
As you can see, the page speed scores are high. And also keep in mind that this is a relatively heavy landing page and it contains a lot of images. Therefore the page speed scores for a typical website will be even higher, so if this is not the case for you, then you need to consider other things which we will review briefly in this article.
Regarding the YSlow Score rating which is C in this report, please note that the main reason for this is the external script files included on the page, for example, the one related to the Jivo Chat which is our live support service. This means that this score would be much better on your own website.
Another thing that can improve this section drastically, is using a CDN service to serve the external script files.
How do I know what is slowing down my website?
The best specific and simple way of doing this is to open the browser console and monitor the network tab. This is something that is available for all the major browsers. For example, this is the Firefox network tab in the developer tools:
Please note that if your page is already loaded, you need to open the network tab and reload the page in order to see the results.
You can see the name of the resources, their type, their size, their waterfall timing chart and other useful information here.
The first thing to look for here is the initial page request and the time it's taking to receive the response. This is usually the first line of this report.
If the initial request is too slow, then you need to apply some improvements to your server-side, which usually is the Apache webserver.
Upgrade your PHP version to 7.1+
One thing that can be done for this, is to upgrade to the most recent version of PHP e.g. version 7.1+ which has a significant impact on your overall performance and security.
Another thing that can be done from your server-side is to use cache tools. One of the most popular cache tools which we also use on our own servers is the FPM mode. Please refer to the following links for more information on FPM:
For the things mentioned above, you need to be in contact with your host provider.
Other things to consider, are the assets that are loading after the initial request. For example the CSS or JS files or the images on your page.
For images, it's up to you that what kind of images you are using on your pages with what sizes. Obviously editing and optimizing your images before uploading them to your WordPress website will have a better result on your page speed.
Here is an online popular image optimizing service that you can use for optimizing your images:
Also please note that there are already many options for improving performance in Phlox built-in widgets. For example, if you are using the Advanced Image widget on the pages which you are creating with Elementor, you can enable the Preload image option under the Settings tab.
The same option is also available for most of the post related widgets, for example, Grid & Carousel Posts:
Or the Lazyload feature which is also available for some widgets, for example, Modern Gallery:
Along with the tips from the top article, we recommend that you adjust two more options in the Extra tab:
Set the Google Fonts option to the Combine and link in head and enable the Remove query strings from static resources option:
Leverage Browser Caching
Leverage Browser Caching means storing static files of a website in a visitor browser. And then retrieving them from the browser quickly instead of the server. Actually it uses to speed up each page of a website. To enable this, you can simply use the following plugin which sets the necessary configuration in the .htaccess file in your WordPress installation after activating the plugin:
Also, there are useful plugins like Query Monitor which can show you which plugin is taking how much of your server resources.
All being said, to determine the real reason for a possible slow page load speed, please do these:
- Upgrade your PHP version to the latest version
- Deactivate all the unnecessary plugins from your website except the Autoptimize
- Reload the page while monitoring the network again
By doing this, we can decide what is going on, on your website and do further steps to make things right.
And the final point to consider is that we are constantly working on improving the Phlox theme and by introducing more options like lazy loading and Ajax functionalities for different widgets and sections of the theme, the overall performance will be even better in the future.