The Swyx.io 2022 Rewrite

swyx 2022-01-27

Note: there was a 2023 update since this post.

I’ve rewritten this site once again.

For those keeping count:

Oct 2017: Used raw HTML/JS
Nov 2018: I used Gatsby
Aug 2019: Tried Gatsby Themes
Sep 2019: Moved to Svelte and Sapper
Sep 2020: Moved to Elder.js
Jan 2022: Moved to SvelteKit (you are here!)

If you want to have the same site without my customizations, I’ve also open sourced a SvelteKit starter called swyxkit that you can use as a starting point.

Problems I faced

I’ve been very happy with the move to Svelte.js over the years (Why Svelte?). Elder.js was very fast (due to the Islands architecture) and I loved the shortcodes and flexible data layer. However two choices hobbled my productivity/satisfaction and caused me to consider a rewrite:

Having to pregenerate every page and do a full rebuild any time I changed a page
Using Dev.to as a Headless CMS.

I was excited about using Dev.to as a dual distribution strategy, but unfortunately the community seems to have completely stalled, and the API became extremely flaky (failing 9 out of every 10 calls for reasons I still do not yet understand). Dev.to also imposed additional restrictions I didn’t like - an arbitrary max of 5 tweets embedded, max of 4 tags, no support for details/summary tags (my favorite HTML tags!) and having to manually upload my images one by one was STILL slower than I would like.

Build times also crept up from 2 to 3 minutes… when my builds succeeded.

Solutions

I moved to SvelteKit, and used GitHub Issues as my CMS:

My builds are back down to 1 minute and I now have a free comment layer/much nicer writing experience.

I also included a bunch of smaller features I’ve wanted, including a togglable dark mode (previously, dark mode was based on system preferences), as detailed in the swyxkit readme.

The new look

This was a rewrite, not so much a redesign, because I just wanted to remove the blockers to my writing productivity. Believe it or not I’ve wanted to do this rewrite for almost a full year before actually doing it!

Permalink here: https://61f1ec1ede71a50007f6f3cd—scout-videos-51664.netlify.app/