sambenemerito
Back to blog

It's 2026, and frontend feels fun (again)

· 5 min read
sveltesveltekitmdsvexfrontend
Some mdsvex fun. Tic Tac Toe in my post's markdown!

Still a work-in-progress, but the site’s finally alive and from here onwards I’m gonna start documenting whatever fun stuff I dabble into 🎉

I’ve been putting this project off for the longest time, but last weekend I finally got to squeeze in the time for it and I thought I’d try out some of the many interesting tech I’ve been seeing around, specifically Svelte (and SvelteKit). This post will just be a summary of thoughts and things I learned as I was setting this site up.

Svelte

Having worked with React on Next.js, and Vue, Svelte was definitely a breath of fresh air.

I went head-first with the official Svelte tutorial, and really everything else I needed to know was in their documentation, and I had ChatGPT to bounce ideas and questions with.

Some of what was cool

  • Svelte’s new approach of just compiling optimized Javascript and directly updating the DOM, compared to React and Vue’s approach with having the framework on runtime, and manipulating a virtual DOM
  • No longer having to deal with weird nested JSX code (I’ve worked with codebases where the JSX was just filled with nested ternaries 💀)
  • Not having to worry about making mistakes in defining dependency arrays in something like a useEffect(), because the $derived() and $effect() runes just handle it for you
  • Built-in transitions and animations, which I’m still trying to get my head around but it’s cool to know that it’s there

mdsvex

The magic sauce that enables me to get Svelte components into my markdown. It was pretty neat that the sv CLI (https://svelte.dev/docs/cli/overview) had a few add-ons you could immediately bake into the app especially upon initialization with npm sv create.

Going through the options, I saw mdsvex, basically MDX for Svelte, which was perfect for my use case as starting this project I already knew I wanted to write blog posts, and have them in markdown. Adding Svelte components was a bonus.

Here’s a snippet of how this post’s markdown looks like:

<script>
  import Tictactoe from '$lib/content/components/Tictactoe.svelte';
</script>

<Tictactoe />

## Svelte

Having worked with [React](https://react.dev) on [Next.js](https://nextjs.org), and [Vue](https://vuejs.org), Svelte was definitely a breath of fresh air.

Deployment

I initially planned to deploy the site on a VM I already had running on DigitalOcean. It would’ve worked fine, but I thought I wanted to take advantage of edge deployment through Cloudflare Pages.

Edge computing is a distributed computing model that brings computation and data storage closer to the sources of data. More broadly, it refers to any design that pushes computation physically closer to a user, so as to reduce the latency compared to when an application runs on a centralized data center.

from Wikipedia

The actual deployment process was pleasantly straightforward. I just pushed my repo to GitHub, linked it to Cloudflare Pages, set up the SvelteKit adapter, and it handled the build and routing perfectly. I also setup a webhook so that pushing into my main branch would immediately trigger the build and deploy process, which only took ~1 min which was pretty satisfying.

Dabbling with performance

Number go up, brain feel good meme
Lighthouse number go up, brain feel good

Probably a bit premature, but I was curious and ran a Lighthouse audit to see how my site performed. My first few runs scored somewhere in the high 70s to low 80s on mobile, and the main culprit was a slow Largest Contentful Paint (LCP), because my main hero image wasn’t optimized at all.

It was actually a fun mini‑rabbit hole to go down. I don’t usually dive this deep into frontend performance tweaks, but experimenting with it helped me understand more about what actually affects page speed and perceived performance. After optimizing the image and implementing a few improvements, mainly thanks to SvelteKit’s enhanced image support, my scores now hover around the 90s.

It’s satisfying seeing visible performance gains through a few targeted adjustments, and it gave me a better appreciation of how much frontend performance matters, even for smaller personal projects.

Moving forward, and what I’m looking to pick up in 2026

Getting this site up felt like a small win to start the year. I learned a couple of things, and was reminded that I could learn anything (to some degree) I put my mind into.

For the rest of the year, I’m looking towards:

  • Python/Web: I want to catch up on the latest in Python and Django and dive deeper into modern frameworks like FastAPI. I’ve also got my eye on Go for building performant web services.
  • AI & productivity: AI feels like a force multiplier. It’s been definitely helping me build faster, and learn quicker. In 2026, I’m looking to integrate AI into my dev toolkit more intentionally to tighten my workflow so I get more out of it.
  • System design & backend fundamentals: I’m brushing up on caching strategies, monitoring, and scalability principles
  • Outside code: just looking to stay active in general. Playing more badminton, running consistently, and chasing that sub-4-hour marathon. Maybe even experiment with photography; something creative but offline.

All in all, this site is a small start but a foundation for more writing and more building. Let’s see where it goes 🤞