Jump to content

How to Reduce CPU Load in Wordpress


Recommended Posts

If you are somebody that still insists on using WordPress and doesn't want to convert it into static, then this article is for you.

I had noticed that my site loaded pretty slow and I just didn't know why. I also saw that a lot of people are suspended because of high CPU load. I did some digging around and found out some tips to reduce CPU load

1. Avoid these plugins: 73 Slowest Plugins that Use Up CPU. These plugins are resource hungry and use up CPU very easily. Alternatives include Rank Math SEO for SEO, Gutenberg for Page Builders, WPForms for contact forms, Ithemes Security for Security, UpdraftPlus for Backups etc. The only exception for me is Elementor Page Builder since some features can't be found anywhere else. Another exception for people is Jetpack if YOU NEED ALL OF ITS FEATURES (since installing the plugins one by one uses more resources), otherwise it is a bloated plugin.

2. Use Asset Cleanup to disable useless features and scripts. Some plugins like Elementor and Contact Form 7 put unnecessary scripts on your site. To get started first install the Asset Cleanup Plugin (I know it is another plugin but it is extremely lightweight and makes your site faster more than slower) and enable test mode in the settings. Now you an play around with the settings seeing if your WordPress site functions as before (don't worry since it is in test mode the changes are only shown to you).

3. Use a CDN. CDN takes the strain off your servers and makes your website load faster for international users. I currently use 2 CDNs: Cloudflare and Amazon Cloudfront. Cloudflare is very easy and straight forward to configure. I also use Amazon Cloudfront for my images which is free up to 5K views per month. Go to optimole.com and create an account, copy your API key. Then go to your WordPress dashboard and install the Optimole Plugin and paste your API key. Optimole not only provides a CDN but also compresses your images by 90% without loosing the quality.

4. Block Cloudflare bots if you use Cloudflare. Sometimes Cloudflare puts bots on your site (sometimes saying your site had 300000 visitors when you barely have 200) so you would need to block some of them using their firewall or your site would drastically slow down.

Done. Now this is how fast my website loaded with these optimizations: image

image

image

P.S. My main website isn't hosted on Heliohost (I use Heliohost to host my other website) but another free host (3001.host). However my website used to load in 3.5 seconds and now is 774ms.

 

Link to comment
Share on other sites

BTW, you can also use Optimole on static sites or non WordPress sites. Create an account, keep note of the API key. Then paste this code in the head tags:

<script type="text/javascript">
        document.documentElement.className += " optimole_has_js";
        (function(w, d){
            var b = d.getElementsByTagName('head')[0];
            var s = d.createElement("script");
            var v = ("IntersectionObserver" in w) ? "_no_poly" : "";
            s.async = true; // This includes the script as async.
            s.src = "https://d5jmkjjpb7yfg.cloudfront.net/v2/latest/optimole_lib" + v + ".min.js";
            w.optimoleData = {
                key: "Your API Key",
                quality: "85",
                lazyloadOnly: "optimole-lazy-only",
                backgroundReplaceClasses: [],
                nativeLazyload : false,
                scalingDisabled: false,
                watchClasses: [],
                backgroundLazySelectors: "",
                network_optimizations: false,
                ignoreDpr: true,
            };
            b.appendChild(s);
        }(window, document));

        document.addEventListener( "DOMContentLoaded", function() {
            document.body.className = document.body.className.replace("optimole-no-script","");
            if ( "loading" in HTMLImageElement.prototype && Object.prototype.hasOwnProperty.call( optimoleData, "nativeLazyload" ) && optimoleData.nativeLazyload === true ) {
                const images = document.querySelectorAll('img[loading="lazy"]');
                images.forEach( function (img) {
                    if ( !img.dataset.optSrc) {
                        return;
                    }
                    img.src = img.dataset.optSrc;
                    delete img.dataset.optSrc;
                });
            }
        } );
</script>

Make sure to replace your key with your API key. You can also change the settings to your liking.

Then on every image instead of using this attribute:

<img src="your image url"/>

Use this 

<img data-opt-src="your image url" width="800" height="600" />

 

Link to comment
Share on other sites

Of course, don't forget to update WordPress to the newest version as much as possible.
At the same time, PHP will switch to the new version.
In particular, the newer the version of PHP 7, the faster the processing speed. Perhaps PHP 8 will maintain this as well.
It also helps reduce the heavy load on HelioHost and maintain stable operation.
It's a task that happens almost regularly as long as you maintain WP.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...