My Minimalist Blog Redesign
11/03/24
A few days ago I pushed a commit that reduced the size of this website to about 5 to 10kb in total. Many things have been removed, most files have been refactored. The site now has a full 100 Lighthouse score, is blazingly fast, more mobile friendly and more focused. I removed all elements of the page that haven’t added any meaningful value to the reader, like the dynamic search page, the OG image generation and the paginated archive.
Before the change, I applied the minimalist philosophy only to the layout and design of the website. Now I went a step further and cleaned up on the code too. The biggest impact for me was the removal of TailwindCSS and React. Both are nice technologies and certainly good for some use-cases, but not so much for a simple blog like this. Tailwind made every piece of HTML look overly complicated and added a ton of CSS that I didn’t need. React wasn’t necessary, because I don’t have much need of client-side JS, now that I removed the search page.
I didn’t need a CSS reset. Most browsers do a fine job displaying text paragraphs and headings. I now have a single CSS file that’s inlined into the HTML by Astro, because it’s smaller than 4 kb. In fact it’s only about 1kb large. It consists of basic layout and font-size settings, some color rules for the light and dark theme via CSS variables and a few style fixes for blockquotes, code blocks and lists.
The React components were all migrated to Astro components. The only client-side JS I need is a few lines for storing the theme selection in local storage and dynamically applying the readers preferred color theme. Try setting your OS them to dark mode and the website will trigger the dark theme automatically. Loading React only for that would be overkill. I still want to keep building apps using JS frameworks, but websites are not apps.
Another thing I removed is the logo. Nobody needs that. The landing page is now simply the full blog archive. No paginated archive anymore, because pagination also isn’t really a necessity.
I used to have an image generator that created Open Graph images. Not because I really needed it, but because it looked pretty when sharing blog posts at Mastodon. It wasn’t adding anything to the reading experience, so it had to go.
I’m really happy about the outcome. It lets me focus more on writing and requires less tinkering with the page setup. I think the usability hasn’t suffered a bit. On the contrary, it was improved by better accessibility, a faster loading time and less clutter that distracts from the reading.