March | 2022 | Abhishek Nagekar

A long time ago I worked on a theme called Elementary for my Jekyll blog. The goal was simple, to create a website that just works, and works fast. In fact, I’ll just paste the line from the readme of the GitHub repository.

This is my personal blog’s Jekyll template that I’ve been optimizing for performance, accessibility, usability, readability and simplicity in general.
I personally do not approve of personal blogs bloated with hundreds of kilobytes of trackers and analytics code, and hence, this is an attempt at creating something that I’d be comfortable with using on my website.

The goal was accomplished. I managed to get a perfect score on many of the pages. But I wanted to write more and while on the go, and plaintext editing on phones is a pain. Then the other problem was to add it to git and push it. In short, working with a static blog from an Android phone wasn’t easy.

That’s when I moved to WordPress. I ported the theme to Elementary-WordPress, which is essentially the same theme but in a WordPress shell. It worked really well, but the problem was all the bloat that WordPress sends to the frontend. For a while I didn’t care enough. I was still serving a fast website, albeit with Jquery, emojis and other code that wasn’t getting used anywhere else.

Today, that changed. I finally took some time to optimize the website and got back my perfect 100/100 PageSpeed score. Here’s how I did it.

Disable jQuery
Disable wp-embed
Disable block library CSS
Disable emoji
Serve fonts from same domain
Use font-display: optional property
Use an in-memory page cache like Memcached
Fix conflicting cache strategies
Use a CDN for asset delivery
TODO: Inline all CSS and Javascript

Disable jQuery

If your website isn’t ancient, there’s a good chance you’re not using it. If some plugin you’re using is using jQuery, consider alternatives. It will save you ~30KB and an HTTP request. Adding the following to the functions.php should do it.

function jquery_dequeue() { 
  wp_deregister_script( 'jquery' ); 
} 
add_action( 'wp_enqueue_scripts', 'jquery_dequeue' );

Disable wp-embed

The following snippet from this answer needs to be added to functions.php

function wp_embed_dequeue() {
  wp_deregister_script( 'wp-embed' );
}
add_action( 'wp_footer', 'wp_embed_dequeue' );

Disable block library CSS

*Sigh* This goes into the functions.php

function remove_wp_block_library_css(){
  wp_dequeue_style( 'wp-block-library' );
}
add_action( 'wp_enqueue_scripts', 'remove_wp_block_library_css' );

Disable emoji

I found some nice code to disable a whole bunch of unnecessary actions from this guide here: https://kinsta.com/knowledgebase/disable-emojis-wordpress/#2-disable-emojis-in-wordpress-with-code

Serve fonts from same domain

If you’re not super keen on using the smart browser detection functionality that Google Fonts offers and are happy only supporting modern browsers, simply downloading the font files and linking them with @font-face can save an additional DNS and HTTP request.

Use font-display: optional property

I’m using font-display: optional; CSS property on my @font-face and it pushed my PageSpeed score over the top. Essentially it prevents the CLS, or Cumulative Layout Shift metric of Core Web Vitals from getting affected due to page shifting due to slow loading of font files.

Use an in-memory page cache like Memcached

Building pages to serve the users is expensive as it involves the database, but isn’t something that needs to be done for every visitor visiting the same page. A plugin like W3 Total Cache coupled with a Memcached instance (could be running on the same server as the website) could enable caching of pages among other resources in memory, reducing the load on the server and improving performance for cache-hit pages.

Fix conflicting cache strategies

I’m using W3 Total Cache plugin that helps minify and cache CSS and JS files. But I wasn’t seeing any minification happening. Upon some reading, it turns out that CloudFlare’s minification conflicts with W3 Total Cache’s. Disabling it on CloudFlare’s side fixed the non-minification problem for me.

Use a CDN for asset delivery

Once the thing to deliver is optimized, it is a good idea to optimize the delivery pipeline as well. Since my server is in the same country as me, it is easy to make a mistake of thinking every visitor of the website is seeing a 50 milliseconds time to connect to the server. The further the user is from the origin server, the longer it could take.

Hence, an global CDN like CloudFlare should be used which can serve static content from its edge node physically closest to the visitor.

TODO: Inline all CSS and Javascript

It doesn’t go beyond 100, but I’d still like to improve it further. For one, the little bit of CSS and JS that does exist doesn’t have to need two additional HTTP requests. Inlining that bit will mean that blog posts without an image, which for me are most of them, will get served in only three HTTP requests; the document, the font file and the favicon. Pretty cool, huh?

Conclusion

I’m pretty pumped about the 100/100 score. WordPress has a reputation for being slow and bloated, but with some simple optimizations, it starts performing like how you’d expect some text on a page to perform like.

Thank you for reading!

I see that I’ve picked up this habit of keeping half finished articles in the backlog. Need to fix that. Anyway, let’s hope this article gets to see the light of day on the internet.

I wanted to write some of my current thoughts on the idea of slow thinking. I’d warn you before we start that none of what you’ll read in this article is a novel thought of my own. Rather, it is an aggregate of the various different books I read in the past three months, many of which pointed me towards this idea. It is just my interpretation of the idea, but I’d like to document it nevertheless.

What is slow thinking?

The way I understood it, slow thinking is the non-reactive way of thinking and responding to a situation. When presented with a situation that sets off strong emotions — especially negative ones like anger, fear or jealousy — the idea is to take a step back and recognize the emotion itself, thereby detaching ourselves from that emotion. It is also handy when dealing with situations that trigger an impulsive reaction, not necessarily a negative one.

From experience, I can vouch for the fact that reacting when in an emotional turmoil isn’t usually the best idea. I’d struggle to find an example of a situation in my life when bursting with anger, screaming at someone, getting violent or very negative brought me any net positive.

Similar, impulsively doing something can sometimes be beneficial, but often, and especially in the modern world we live in, impulses are unwarranted and just a reminiscent of the tribal and fight-for-survival past of humans. Being able to recognize when an impulse is justified and when not can come in handy in many life situations, and the ability to do so can be treated like a skill to hone.

Of course, none of this is to suggest we shouldn’t feel emotions. It is perfectly reasonable to feel sad about some of the world events we’re constantly made aware of, just as it is nice to feel excited about the thought of having a cake or petting a cat. I think the idea here is to recognize the complexities and different parts of the mind that are responsible for different emotions and reactions instead of abstracting it all under the one “you”. The idea is to go from “I’m angry” to “I’m feeling anger” and so on.

The following idea is from Robert Wright’s Why Buddhism Is True. Essentially, one can imagine there to be different modules that keep getting activated and deactivated as we go about our lives, and we live through those modules as long as they are active, like experiencing feelings towards the protagonist in a movie or feeling happiness upon hearing a good news. The modules may be triggered by external stimuli, and as such, we’re not really in control of the orchestration.

Since we’re not orchestrating how exactly we feel or react to a situation, it implies there’s no “you” but a lot of different parts that become “you” depending on the situation and the trigger. Lost a game, the “dejected” module activates. Had a nice time at the park with your partner, the “happiness” or “gratitude” module activates.

Yep, we’re talking in very abstract terms, but that’s okay. There’s no way to comprehend the immense complexities of the inner workings of the mind without spending a lifetime studying the subject like the people whose thoughts I’m borrowing and interpreting did. And like they say, all models are wrong. So as long as this way of thinking helps us better understand why we do what we do, it can be useful.

So how does one slow think?

I don’t think there’s one way to do it. The book I referred to earlier, Why Buddhism Is True by Robert Wright, suggests meditation techniques that can be put to use to recognize our emotions and detach ourselves from them. Thinking, Fast and Slow by Daniel Kahneman educates us about the biases that we might not recognize in our behaviors and that knowledge makes us more aware of our cognitive fallacies. Relationships by The School of Life, speaks about many of the inherent complexities in humans and human emotions and why people behave in certain ways from time to time (of course, with a focus on romantic relationships).

I think it doesn’t matter which way we choose to learn to slow think; it could be through mindfulness meditation, or educating ourselves on the topic of cognitive biases, or understanding the person we’re dealing with and recognizing them as humans and their emotions. The end goal is the same: to be less reactive, judgemental and impulsive, and more curious.

In conclusion

I hope this was a useful primer on the topic of slow thinking. I’m looking forward to putting it to use in my life and seeing how it works for me. That’s it for now. I’ll go back to getting entertained looking at all sorts of interesting people and the life happening at Catania airport.