JQuery is slow - what to do about it?

JQuery is slow, what can you do about it?

Do you want a fast site? Stupid question right. No one ever said “this site is too fast loading, I think Ill check the competition”. Never happened – EVER.

We all want fast websites. That means people like myself spend hours crawling over ways to make a website fast.

Every now and then I get the bug to improve my own website. This generally means running huge numbers of reports followed by reading over recommendations. These can be SEO reports, Google Analytics or Page Speed reports.

My Recent Discovery of slowness from jQuery

I recently had a refresh on how important site speed is. I watched over this fantastic video from Google.

What a great illustration of site speed. I never seen anything as good as this one.

At this point, I noticed in the article I could test my site speed. I thought I would do pretty good but I was horrified with the result.

Eliminate Render Blocking Resources.
6.4 seconds of idiot load time.

OK, my page is slow but this is very annoying. I don’t have a fancy design, or lots of images. Why the heck is my site so slow?

6.4 seconds, that was longer than the test that annoyed people. I’m annoying people. I’m the one that is making people mad. OK, take a breath – Id better do something.

I looked into my site and found the culprit – jQuery.

Using JQuery is no small thing

I hardly use jQuery however since i’m using WordPress I knew I could tweak a configuration for my site and re-test. I jumped into WP Rocket and turned on the defer loading for JavaScript. I thought that should do it.

Running the report again I was honestly thinking I would get a fast result. But I didn’t – welcome back to another bad result. I felt like I was captain slow.

Minify Javascript is my next tip.
Still captain slow – 5 seconds of load time.

OK so now I was mad. This stupid thing, why is my site loading so slow?

WP Rocket is enabled. I have minification on every CSS/HTML/JS file and I’m still going slow.

At this point I was about to totally lose it and start shouting at my computer (I do that sometimes and yes, my dog gets scared when I do that. Sorry Bobby).

Coder Anger

It dawned on me, why don’t I just not use jQuery? Google keeps telling me to remove it. Firefox also gives me a warning on every page load about jQuery migrate (that’s in the console). Why don’t I remove jQuery and see what happens?

Removing jQuery from my site

I added a simple snippet to my staging site functions file. I run the test again. The result was impressive and at the same time very disappointing.

Welcome to average load times
Welcome to average load times.

Yep, I’m Mr Average. I almost celebrated. 2.2 seconds of website loading in 4G. That is pretty good, isnt it?

Yeah – Averageness – not good

OK, its not really time to celebrate because my site is broken. It depends on jQuery for a few things, however what where these things? Why is jQuery being used on my site?

Finding jQuery

I looked over all my code and was lucky to find just 2 areas of code that were causing jQuery to load. These were:

  1. A Gutenberg component for client testimonials. I can live without that.
  2. Freemius – I can’t live without that. Its not on every page, but it is needed. I use it to sell my WordPress plugins.

What to do?

Well – I’m personally going to war on jQuery. That is especially true for Gutenberg components. In 2020 you no longer need jQuery on a public facing site.

Some people still use it. jQuery is an easy way to get a result, but the way it loads is bad. The load process blocks everything else and makes your site feel slow.

jQuery is also far from fast loading. It is heavy and slows page loading down a lot. So it has to go and that means anything that uses jQuery has to go as well.

jQuery is the new Flash

jQuery will have the same fate as flash. #ripjquery

Flash used to be all over the internet. Now, it isn’t. The dawn of the iPhone had flash being removed from the internet. That was a tough time, especially for video on Android devices. The internet evolved however and we no longer need flash.

jQuery will have a similar fate. jQuery used to be everywhere and It still is but I can see the writing on the wall. Its days are numbered and this is especially true for the mobile web. jQuery will eventually be removed from WordPress too.

My next steps are not easy to remove jQuery, but the benefits are big. Fast load times.

Fast load times are the most important technical factor. Well, if you want SEO traffic they are and if you want online sales its true too.

Moving ahead and my next steps?

My first step is to make sure my site is running jQuery free tools from WordPress. I’m a bit stuck with freemius but I figure I can optimise everything else and then resolve that issue.

That means reducing unused CSS, reducing general javascript that is probably not doing much and make my site fast.

I want all my blog articles and main landing pages loading much faster. The only way to do that is load less stuff. Most of us have a heap of wasted stuff anyway, so its time to get a bit ruthless.

Once that is done I can tackle Freemius and then go to a static WP setup. My days of Dynamic WordPress will be over.

It may seem like drastic action, but I think its an important step. We have to move with the times and I’m not one to hide from a challenge.

What will we do moving ahead?

Dealing with page speed needs to be a top priority in the decade to come. I know that we will take the journey to be fast. We will make fast WordPress components and be vigilant to encourage others to put page speed first.

Being a good citizen of the internet by having fast loading pages makes people happy.

Lets make the world better, one web page at a time.

As I walk the journey Ill keep updating here so be sure to follow on twitter / Facebook and LinkedIn.

Scroll to Top