Edge Functions

Using Wasm modules

Use WebAssembly in Edge Functions.

Edge Functions supports running WebAssembly (Wasm) modules. WebAssembly is useful if you want to optimize code that's slower to run in JavaScript or require low-level manipulation.

This allows you to:

  • Optimize performance-critical code beyond JavaScript capabilities
  • Port existing libraries from other languages (C, C++, Rust) to JavaScript
  • Access low-level system operations not available in JavaScript

For example, libraries like magick-wasm port existing C libraries to WebAssembly for complex image processing.

Writing a Wasm module

You can use different languages and SDKs to write Wasm modules. For this tutorial, we will write a simple Wasm module in Rust that adds two numbers.

1

Create a new Edge Function

Create a new Edge Function called wasm-add

1
supabase functions new wasm-add
2

Create a new Cargo project

Create a new Cargo project for the Wasm module inside the function's directory:

1
2
cd supabase/functions/wasm-addcargo new --lib add-wasm
3

Add the Wasm module code

Add the following code to add-wasm/src/lib.rs.

1
2
3
4
5
6
use wasm_bindgen::prelude::*;#[wasm_bindgen]pub fn add(a: u32, b: u32) -> u32 {    a + b}
View source
4

Update the Cargo.toml file

Update the add-wasm/Cargo.toml to include the wasm-bindgen dependency.

1
2
3
4
5
6
7
8
9
10
11
12
[package]name = "add-wasm"version = "0.1.0"description = "A simple wasm module that adds two numbers"license = "MIT/Apache-2.0"edition = "2021"[lib]crate-type = ["cdylib"][dependencies]wasm-bindgen = "0.2"
View source
5

Build the Wasm module

Build the package by running:

1
wasm-pack build --target deno

This will produce a Wasm binary file inside add-wasm/pkg directory.

Calling the Wasm module from the Edge Function

Update your Edge Function to call the add function from the Wasm module:

1
2
3
4
5
6
7
8
9
import { add } from "./add-wasm/pkg/add_wasm.js";Deno.serve(async (req) => {  const { a, b } = await req.json();  return new Response(    JSON.stringify({ result: add(a, b) }),    { headers: { "Content-Type": "application/json" } },  );});
View source

Bundle and deploy

Before deploying, ensure the Wasm module is bundled with your function by defining it in supabase/config.toml:

1
2
[functions.wasm-add]static_files = [ "./functions/wasm-add/add-wasm/pkg/*"]

Deploy the function by running:

1
supabase functions deploy wasm-add