Why Our WordPress Slow?
It’s because of us! Yes, us…
We often use a lot of plugins, without knowing or having a little research of how big the assets size are, how many files, and how the way they load.
Most of modern WordPress Plugins are already developed with speed and performance-first mindset. The features are often based on modules, so we don’t need to load the assets of modules that we don’t need. The assets load management also often uses the function “if class exists“, so it will only load the assets if there is a page using it.
But unfortunately, not all plugins developed that way.
That’s where the bloats come up.
Bloated. That’s basically the main reason why WordPress-based websites come up slow.
Bloated, in short, means: things that we used, and loads, but are not actually needed. This includes all the files on our website such as plugins, php code, fonts, css, javascript, images, and even databases.
List of things that often make WordPress-based websites slow:
- Using Too Many Plugins
Each plugin will add their own CSS and javascript files that need to be rendered. Not only adds up and enlarges the number of files that our website and the browser has to load, using multiple plugins opens up a security risk to our website.
Not to mention, many plugins (unfortunately) don’t clean themselves from the database even though we have deactivated and uninstalled them in the right way. The remaining database leftovers, will result in a larger database file size than it should be and make the browser rendering process slower. - Messy and Outdated PHP Code
Many themes and plugins PHP code (unfortunately) that are not written in a good and modern way . Using themes with outdated and messy PHP Code will certainly make the rendering process slower than using themes with beautifully coded PHP Code (slim, fast, and as minimalist as possible). - Using Too Many Fonts
The file size of fonts is generally large (even with the woff / woff2 format). Using too many fonts will add more files (and bytes size) that our website and the browser must render. This includes the fonts for icons also. - Too Many CSS and Javascript Files
Apart from being render-blocking, too many unnecessary CSS and Javascript files will slow down the rendering process of our website. Especially if a lot of classes and styles from the CSS are overridden, this will make the browser have to read 2x or more. Using too many plugins will increase the number of CSS and Javascript files that the browser has to render. - Uncompressed and Unoptimized Images
Too many images, especially if the size is too large, will certainly slow down the browser’s process of rendering the page. The question is, how important is it for us to load large image files with high resolution? - Oversized and Too Large Database Size
Every page of a WordPress-based website is mainly generated from the PHP rendering process and the information stored in the database. If the database size is too large, especially those with autoload status in wp_options table, it will slow down the browser’s. Most of the WordPress plugins stored their data in the database. So the more plugins we use, the bigger the size of our WordPress database. - Using an outdated version of PHP
PHP is a programming language that is processed by the server (server-side) and designed for the creation of websites (or any web-based application). The newer the version, the better the performance. The latest PHP version is PHP 7, or more precisely, PHP 7.4. Using an outdated version of PHP (prior to version 7) will slow down our website rendering process. - Poor Hosting Performance
Choose it wisely. Hosting performance has a big role in the performance and loading speed of the website. Hosting our website in a poor performance hosting provider will result in a slow response time which ultimately will have an impact on the TTFB (Time to First Byte) speed and the overall page rendering process.
If all the previous points were not a problem and did not cause our website load time to be slow, it means it’s time for us to move to a new hosting service provider.
Why Speed Matters?
Unless our brand is already well known and famous, our website load time speed are important because:
- Slow Websites Drive Visitors Away
Of course, we often experience this ourselves. When opening a slow website or doesn’t even open, we will close it and definitely be reluctant to visit it again. - Website performance and speed affect Ranking Factors on Google, Bing, and Yahoo
Slow websites tend to have bad user experience. Visitors will more likely close the browser tab immediately before the browser has actually finished loading the page. This will increase our bounce rate. As a result, the search engines will perceive your site as bad. The majority of search engines implement this in their algorithm.
Remember, what really matters is the actual perceived load time of our website. If it’s a blog, we want visitors to be able to quickly access our blog and read articles that interest them. If it’s a company profile website, we want our visitors to be able to quickly see and learn about our business profile. If it is a shop / online store website, we want visitors to be able to quickly go to our site, explore, and buy the things we sell.
How to Optimize Our WordPress Site
Basic steps to speed up WordPress based website loading time:
- Analyze Our Website
- Identify the issues that are causing our site to be slow. Deactivate our plugins one-by-one. See which one or two that slows down performance.
- Check what files are loaded by our site. Reduce and minimize the file size.
- Use web performance test tools like GTmetrix and Google Page Speed Insights. Follow the given suggestions.
- Enable Cache
Use any available cache plugins in WordPress Repository. It doesn’t need to be the premium version. We can do this ourselves with writing codes on .htaccess. Enabling cache is very important so that the browser doesn’t need to re-render all the files every time it opens a new page..
Some of ThinkWeb’s recommended cache plugins are: - Enable Gzip Compression
Gzip Compression is a server-side file compression method. It is one of the easiest optimization steps because it can compress (reduce) the size of HTML, CSS, and Javascript files, by just adding a few lines of code in the .htaccess file. We can add these lines of code yourself or use plugins. Some of the cache plugins mentioned above can also add a few lines of code in .htaccess and activate Gzip without us having to open our Hosting Control Panel and add it manually. - Minify and Combine CSS and Javascript Files
Unless we are in an HTTP/2 environment, try to compress, minify, and combine all CSS and JS files loaded by the website as much as possible. This can speed up the rendering process of our website pages. Especially if our hosting performance is not good enough. Use plugins if necessary. All the cache plugins mentioned above also compress, minify, and combine CSS and Javascript. - Put render-blocking files in Footer
Remember, all of the loaded files, both internal and external, are render-blocking in nature. This includes CSS and Javascript files. Put the Javascript files at the end (Footer) in order to minimize delay that is caused by render blocking files. - Delay Images Loading Time
Delay the images loading time. Especially those that are not at the top of the page (above the fold area). If you don’t understand coding, you can use the image lazy-load plugin. Some of the cache plugins mentioned above also have lazy-load features for images. - Compress, Reduce, and Resize Our Image Size
Compress, reduce, and resize images to the proper size before uploading. Unless our website is a photography website, we don’t need to display high-resolution images. Remember, most of our traffic comes from mobile devices, nowadays. Forcing the browser to load images at a high resolution that it doesn’t really need is a huge waste of cost for our visitors. - Optimize Fonts
All fonts can and should be optimized. This includes google fonts and icon fonts which often makes our sites slow. Self-hosting all of our font files can give us better performance than serving them from third party websites like google or fontawesome. - Use CDN
Use CDN (Content Delivery Network) for as many static files as possible. The goal is to make the rendering and sending data process run more parallel and reduce the server’s load.
What we need to be aware of is that the use of external resources will increase the number of DNS Look-ups, which in turn will increase latency. We recommend that you use a maximum of 2 source CDNs to minimize the number of DNS Look-ups. - Optimize Database
To do this, we can manually use the repair and optimized database feature from phpmyadmin in our hosting control panel. Or, we can simply use plugins like WP-Optimize dan WP-Sweep to optimize our database without login to our hosting control panel. - Use the Latest PHP Version
We can check this through our hosting control panel. Make sure our website is using PHP version 7.2 and above. If not, we can easily change it ourselves or ask for help from the hosting service provider that we use.
Remember, before doing anything, we should make backups first. Just to be safe.
Take notes, all of the popular site speed measuring tools are great for identifying opportunities to increase our site speed, but don’t get obsessed by the scores. Optimizing WordPress Speed and Performance should be a balancing act between the effort of getting good scores and preserving features. Therefore, it should be done carefully.
Happy optimizing. Good luck !
