I’ve been so deep into optimizing my long running website that I don’t have anything to share this week. You know the times when you get deep into something and it pulls you in more and more.

For example, yesterday my goal was to update the JQuery and JQueryUI versions to latest. I think the site was using an at least ten year old version of JQuery (1.6). This causes bad things to happen such as “google punishing your site” because it has some high impact security vulnerabilities.

I started by updating the JS tags to fetch the latest versions. Of course some stuff broke. The autocomplete wasn’t working anymore and the dialog had something weird going on. To test the autocomplete I have to enter a single character to the input field. Guess what!!! the autocomplete doesn’t return anything because the dockerfile of the very old version SOLR that I’m using is broken.

Now, I have to fix that first. Somehow I don’t want to return a predefined response for the autocomplete. I take this as an excuse to fix the old docker image. The image is in a github repository that I forked from someone else. The reason it’s not building is that Debian jessie is now archived and the build process cannot fetch the packages from the sources. I now have to update the sources to archive.debian.org so I dive into that and after some tries it’s done!

So I fix the broken image and I can index my items in SOLR. I try the autocomplete and it doesn’t work as intended. It shows escaped html instead of rendering it. Okay, ask my telegram chat bot which is connected to ChatGPT, it gives me the answer and I implement it. That’s fixed.

Now, I have to fix the dialog box of JQueryUI. I don’t even remember what I did to fix that, it was related to some CSS properties from W3.CSS that was breaking the styles of JQueryUI. I think I fixed it by overriding some styles. I don’t remember exactly because while doing this I deep dived into another old css file and I started cleaning up unused css to free up some bytes.

While doing all these I removed an old class called “dnone” and I replaced it “w3-hide”. It turns out I used dnone all over the place and stuff is showing everywhere now so I have to find and replace all dnone usages now. After I was done with that I saw that some functionality where I used jquery.toggle() function to show/hide an element is not working. It turns out w3-hide class uses the “!important” thing so toggle() does not work as intended. Now, I don’t want to go back to dnone, I already have w3-hide and I’m going to stick with that so I decided to replace the usage of toggle with removeClass/addClass. This mostly did the job but now my modals don’t work as expected anymore.

It turns out that the modal doesn’t care about w3-hide because it’s already hidden by default. I had to revert back to using toggle for the modals to fix this. This happens when you blindly replace all your flows at once but yeah it’s part of the job.

You get the idea, and this is just the tip of the iceberg. After all this I started testing the site on PageSpeed Insights to fix things even further. I think I got some improvement but honestly, I expected more. No matter what I do, my Total Blocking Time doesn’t go to less than 380ms and that’s not even related to my stuff anymore. It’s all google ads and google tags js. I deferred, I put ads js to the very end of the body, but pagespeed still complains.

It’s time to leave it as it is for a while and work on other things. I’m sure I will find some tricks to improve these later on. Overall, I remember exactly why I became a primarily backend person. This stuff is too painful to figure out. All the browsers with their versions and some of them support something some other just don’t. You add some JS to your site to earn money and to track your traffic and google itself now complains your site is slow. To put it kindly, this is stupid.