Website fixes after Lighthouse

After I make those changes to based on the suggestions from Lighthouse, I apparently broke the JavaScript by adding the async attribute to the jQuery script tag. The animated scrolling and the text hiding link no longer worked due to “$ is not defined”.

This usually means that jQuery hasn’t been loaded. But the source is still available at the CDN. So, that can’t be it….

Though the advice is to put the scripts at the bottom of the page nowadays, I just tried moving back to the <head> on my local machine. Of course, this didn’t help. Then I remembered about the async attribute and searched around that area. I found this Stack Overflow question and solution which worked perfectly:

Implementing this gave:

Just wrap the code in a window.onload = function () {} function

VS Code showing my fixes. Click for larger image.

And now the site works perfectly fine again!

Posted by Anthony