Running TypeScript in WebAssembly on the Cloud

Hi, I'm Matt Butcher. I'm one of the founders of Fermion Technologies, and today we're going to be talking about running TypeScript in WebAssembly on the cloud. So that's a lot of terms to unpack here.

Let's start really quickly with WebAssembly. So you may be familiar with WebAssembly as a browser-based technology. The original idea was to build a runtime in a binary format in which you could compile lots of different languages to the same language-neutral runtime format and execute it inside the browser, side by side with JavaScript. So, for example, in the case of someone like Figma, they used WebAssembly to take their C++ code, compile it to WebAssembly, and then interact with it from their JavaScript running in the browser.

Now, at Fermion, we took a look at WebAssembly, and what the runtime characteristics of WebAssembly are just right for the cloud. It has very fast startup times, very small binary sizes, the security sandboxing model is great, and of course, it supports cross-platform, cross-architecture, and cross-language. So, we took the WebAssembly runtime, plucked it out of the browser, kinda popped a version into the cloud, and began building a cloud runtime.

So the second term we wanna define is serverless. Fermion is a serverless environment. Spin builds serverless applications, but serverless itself is a term that sometimes gets used in really unclear ways. So I wanna make it really clear what I'm talking about when I talk about serverless. What is the server that we are doing without? Well, to me, it's the software server. If you're used to building microservices or other kinds of backend technologies, you know that step one is usually setting up some kind of server, something that'll start a socket server, will open a port, will listen for inbound requests, will handle those requests. You end up writing all kinds of boilerplate code like interrupt handling and TLS certificate loading and all of that kind of stuff. So in serverless, to me, a serverless application is one where we can do away with all of that. Where the entry point for the application is the event handler. So we'll talk primarily about HTTP, though this could equally apply to consuming something off a PubSub queue or dealing with a time-based trigger, but in HTTP, the event is an HTTP request that comes in. You get that request, you handle the request, you return an HTTP response, and you shut down. So there's no setting up a server, there's no setting up TLS certificates, none of that. The serverless environment says you just define an event handler that takes the request and returns a response. So we wanted to take WebAssembly, put it on the server side, and build a serverless framework. To do that, we needed a tool, so we built Spin. Spin is an open source programming tool and, in some ways, a platform that allows you to create serverless applications in a variety of different languages, compile them to WebAssembly, and run them in a serverless style on the cloud. Spin supports as top-tier languages, Rust, Go, Python, and, of course, JavaScript and TypeScript, though it also supports a number of second-tier languages. And we are working on all kinds of tooling to make it easier and easier for you to build an application that is powerful, has key value storage, database, even AI inferencing, but it still follows that very simple, low setup, almost no-op style developer environment, and a very easy serverless style of program development. Primarily, we'll be talking about that.

So let's switch over to our VS Code editor, and let's use Spin to create a new serverless app, and along the way, we'll talk about both how this serverless environment works, and some of the cool nuances of the way that TypeScript works in this environment.

All right, here we are in VS Code. So the first thing to do would be to install Spin. You can head over to developer.fermion.com and kinda click your way into the Quick Start Guide and see how to quickly install and get up and running with Spin. I happen to just use Curl Bash to install it, so I've got it running here locally.

We're gonna create a new TypeScript serverless app. So just to quickly kind of see what all is supported, we can run Spin Templates List and see sort of all the different starter templates. Some do Redis with languages like Go or Rust, some do HTTP, Swift, Python. We're looking for this one here, HTTP TS, to run TypeScript applications. So let's create a new, spin new HTTP-TS. We're gonna create one called Congress, and we're gonna go ahead and accept the default, which basically just skips the walkthrough where it prompts you for a description and the default route and so on, and just chooses those for us.

So we can see it created an application for us. This should look very familiar to you. There's the package.json, the HTTPS-config. But there is this new file called spin.toml. We'll just quickly glance at that. This is the file that explains to spin how this application should be constructed as a WebAssembly serverless application. We can see in here in the component, this is the thing we're gonna be writing. This is gonna have a default route that'll listen on any, on anything. It'll use NPM to run its build, and the binary that will, the wasm binary will be called target slash congress.wasm. We're not gonna spend too much time in that file there. Instead, we're gonna get straight to the code. Let's take a look at index.ts. This is what a serverless event handler looks like. First, I'm gonna go in here and cd into the congress directory and run npm install and let that install this first library here in the code. It's the fermionspin SDK, which gives us our HTTP request and response and then we can take a look while that's running at our actual request handler. So it's gonna take an HTTP request, it's gonna return a promise for an HTTP response and all it's gonna do is send this hello from ts SDK. So there we've got kind of our scaffolded out original function, so let's go ahead and build that. Spin build is gonna package this up and turn it into a WebAssembly binary for us and then when that's done, we can do a spin up and have it run a version on localhost for us, so it's listening here on port 3000, we can use curl and quickly issue a request and see that that worked. So let's just change this to something very trivial, ts congress, save that and then once more, we'll do this build process.

Let's see, control c and then spin build and then once more, we'll do a spin up as soon as that is done. So again, we've used kind of three commands in our local loop, spin new to create an app, spin build to build a web assembly module out of it and spin up to create a local testing endpoint and we can see, there we go. Now, say we want to deploy this, we can actually just type spin deploy and it'll go ahead, package this up again and deploy it out to some endpoint somewhere, by default, it uses Fermi on cloud, which is a hosted environment, you can also deploy spin applications to Kubernetes clusters, to Docker desktop, to a nomad cluster and a variety of other places all the way down to like a raspberry pi. But in this case, Fermi on cloud will set us up a domain name and route us through to our new serverless handler. So there we've got it running on a public URL.