With less than two days of work, I completely rebuilt the site you're currently on. With the motivation of creating a faster and more future-proof setup than what I was running before, I dropped features from the old site that I no longer thought of as required and ended up with a much simpler, but also more robust setup that will serve for the time to come.
Previously on brunoscheufler.com...
The previous site was based on Gatsby, pulling in my blog posts from MDX and processing assets during the build phase. Not only was this ridiculously overengineered, but it was also painfully slow. My build times ranged from 3 - 10 minutes and starting up the development server after upgrading dependencies required processing all assets. Every time.
While this might be fitting for some, it wasn't cutting it for me anymore. I often ran into breaking changes due to some dependencies changing underneath, custom MDX components that I didn't really make use of, and my non-standard TypeScript setup.
The New Stack
For the latest iteration, I chose to go with less. I completely threw out MDX and replaced it with good old Markdown. The posts and essays I want to write don't require any non-standard components. I also moved all assets to a static location where they're just served, and that's it. No more pre-processing, no thumbnails or different formats, just static file serving, easy as cake.
I decided to go with Next.js for a robust framework that allows both static site generation (which I use for all blog posts), as well as the option to build dynamic pages, which I might use for some future features. Due to all the efforts on performance, I'm getting web vitals scores in the high 90s out of the box without any optimizations.
Instead of adding in troubling CSS-in-JS configurations as I did with Styled Components previously, mostly due to the horrible dev experience with server-side rendering and the css prop, I went for TailwindCSS as an alternative approach to styling, and I could not be happier. I don't think I'll ever write CSS manually again.
To wrap it up, I'm deploying this site on Vercel. In addition to awesome features like deployment previews, Vercel deployments are blazingly fast and my builds complete in about 30 seconds.
With all of those changes, I feel confident that I will have to do less technical maintenance chores while retaining the ability to publish content in no time without vendor lock-in, as it's all just Markdown in the end. Swapping out components doesn't require a lot of work, like a good old bike that you can fix up yourself.
A note on breaking changes
One important part of the refactor was not to break any existing pages, especially blog posts. This required to keep blog post paths the same, which wasn't a problem since I assigned unique slugs to each post already. For features that I didn't port over, such as series or the post archive, I implemented redirects to make sure no one would hit a 404.
And that's it! It didn't take long to rebuild my complete site and make it much faster and easier to work within the process. If you have any questions or suggestions, don't hesitate to reach out on Twitter or send a mail!