Ahoy! Just returned from a deep dive into exploring Cloudflare Workers and it was a great experience! I've been itching to give them another go as I've been following Deno and others from the sidelines for some time now.
At a high level, Cloudflare Workers enable traditionally complex, backend-intensive logic to be located closer to the frontend. This is not just another "do it all in JS" framework though. Rather, it's a paradigm shift that challenges how full-stack applications are built and deployed.
A simple blog example 📝
I love dev.to - the CMS/IDE and community are all wonderful. But as I write more content I also want a way to display and share it via my own website. This ended up being a perfect application for this framework: taking on a complex set of features with a low-code solution.
Here's what I managed to get my little project to do (easily!) using Cloudflare Workers:
- Fetch up-to-date data from dev.to's API
- Create simple article/detail routing layer
- Render components using JSX on server
- Deploy automatically to custom domain (using GitHub actions)
Here it is in action: blog.bryce.io.
And here's the repo if you want to poke around the code:
A thriving ecosystem for worker tooling 🪚
I used hono (a wrapper around miniflare) to handle some of the boilerplate around request and routing logic. It's also refreshingly fast! 🔥
The project also fully supports TypeScript. Nano JSX is an ultra-fast JSX library that works great with SSR (and written in TS). And wrangler makes deployment dead-simple, and integrates with the wrangler-action to automatically deploy upon any changes.
Why this is cool 🪄
As Cloudflare Workers are an on-demand serverless resource, they only run when a request is made.
And since they run at the edge, this mean caching is baked-in!* At scale, this means lots of resources and compute time saved without any additional effort on the developer.
No servers = local development (and deploys) can happen without any spin-up time. My last deploy via GitHub Actions took less than 30 seconds (and the
build step took 0s 🦄). Hot reloads during development actually feel instantaneous too.
Next I want to experiment with more client interactivity but I had a wonderful time building this small static/SSR project! 😇
Anyways, I hope this doesn't go against dev.to's API guidelines (let me know otherwise). And here are a bunch of worker examples to explore if this piqued your interest. I'm looking forward to using them more in the future!
*Edit 6/3/22: turns out this not about caching was not true. I wrote about manually adding edge caching here.