After I make those changes to acarrick.com 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: https://stackoverflow.com/questions/39206516/jquery-deferred-loading-of-jquery-and-not-defined.
Implementing this gave:
VS Code showing my fixes. Click for larger image.
And now the site works perfectly fine again!
