I Rolled My Own Web Framework with Bun

Sep 23, 2023 - 4 minute read | Logan Murphy

Introduction

I have been through so many iterations of my personal site. Back in the day I tried WordPress, but within a few days of posting my first article I got the message “Hacked by Tiger-M@te”. I was hesitant to use WordPress initially but this experience turned me off from the product completely. I have avoided it like the plague ever since.

Hacked By Tiger-M@te

Years later, I would try again with different approaches of Gatsby, NextJs, and Astro in hopes of finding a nice combination of security, performance, and developer experience. Unfortunately there were always some tradeoffs when using these technologies.

If I ever wanted to get something done in any of these frameworks, I would have to jump through so many loops only to find out it could not do what I really wanted to do. Call me crazy, but is it asking too much to manage all of my applications from one repository and never have to scafold or configure a project ever again. So I decided to make my own framework.

What Do You Get Out of It?

I know what you are thinking: Another Javascript framework? Fortunately, I do not plan to open source this project any time soon. I am however learning a lot from the process. It is clearer to me, now more than ever, the decisions that the creators of existing frameworks made. I also have the option to choose exactly where I want to add extra security or performance optimizations.

When I started this project two weeks ago (Sept 6, 2023), I was planning on using Webpack to build and node js to run my project. Then, I saw the announcement for Bun.sh and knew I had to jump on to this new technology. Building and running with Bun has made tasks, that were annoying if not impossible with Webpack, much easier to complete. I also needed an excuse to get off of AWS infrastructure especially as my slow, unused, serverless components became way more expensive to maintain than a vps.

My inspiration

I drew a lot of inspiration from the Astro framework. I had previously played around with the idea of low to no javascript code on the frontend. This one change added a huge boost in my site performance. Another aspect of Astro I ended taking for my own framework was the idea of content collections. Generating and validating objects committed to a repository was huge for me.

Another library that helped me to signifantly reduce the amount of Javascript I generate was DaisyUI. I knew about sibling css selectors but never saw them used the way DaisyUI does. It is because of this library that most of the pages on this site have absolutely no Javascript code. Although I will miss ChakraUI, I will not miss its bloat.

React was another important tool. This library showed me how to write user interfaces in brand new ways. The main downfall of React though is its large size, dependency on other libraries, and slow rendering. So it had to go.

I also felt that event based programming was a much better way to build applications. As a result I wanted to write something with a similar data model to Solid.js. Instead of constantly generating entire dom trees and comparing them, I update only the elements necessary for each state update.

Finally, I have to mention Reflex. This library reignited my interest in building a web framework. Showing the power of what is possible in alternative templating languages. If it did not generate React, I might have actually used this one.

Why Shouldn’t You Do This?

Building out a custom framework is fun and educational, and lets be honest, you will eventually configure existing frameworks to the point where you might as well have built your own anyway. However, it is not for everyone. Here are a few reasons you might want to go with something already out there:

  • You plan to work on a team
  • You need to hit the ground running

I was going to add reasons like time and resources but I think those are more excuses than reasons. Anything else I could think of were just variations of those two excuses.

Future of the Project

Although this project is new and still requires work, as it matures I plan to add many features. Inversion of control via projects like Awilix will make it easier to test the code and reduce the amount of spagetti. I also want a database system that works across multiple domains without me thinking about it.

HackingIntoCoding.com © 2024
Logan Murphy