Building Serverless Edge Functions with JavaScript on Cloudflare Workers and Deno Deploy

Why Edge Computing Is Becoming the Default for Modern Web Apps

When a user in Tokyo requests a page hosted on a server in New York, latency can easily exceed 150 ms, a figure that Google cites as a threshold for noticeable performance degradation. Edge platforms shrink that distance by executing code in data centers that sit literally on the network edge, often within 20 ms of the end‑user. For JavaScript developers, two of the most compelling options in 2024 are Cloudflare Workers and Deno Deploy.

Getting Started: System Requirements and Account Setup

Both platforms run on any modern laptop; you need Node.js ≥ 18 for local testing, and a free Cloudflare account plus a Deno Deploy account. After signing up, generate API tokens with "Edit Workers Scripts" for Cloudflare and "Deploy" scope for Deno. Store these tokens in your shell environment:

export CF_API_TOKEN=your_cloudflare_token
export DENO_DEPLOY_TOKEN=your_deno_token

With the tokens in place, install the official CLIs. Cloudflare provides wrangler, while Deno Deploy uses the deno command line directly.

npm install -g wrangler
deno install -A -f https://deno.land/x/deployctl/cli.ts

Creating a Simple Hello‑World Worker

Start by initializing a new Worker project with TypeScript support. The wrangler init command scaffolds a src/index.ts file and a wrangler.toml configuration.

wrangler init edge-hello --type=typescript

Replace the generated handler with a minimal example that returns the request’s city, which Cloudflare automatically populates in the request.cf object.

addEventListener('fetch', (event) => {
  const {city} = event.request.cf || {city: 'unknown'};
  const body = `Hello from ${city}!`;
  event.respondWith(new Response(body, {status: 200}));
});

Run wrangler dev locally; the CLI proxies requests to a Cloudflare edge emulator, giving you instant feedback.

Porting the Same Logic to Deno Deploy

Deno Deploy expects an export default handler rather than a global event listener. Create main.ts with equivalent functionality:

export default async (request) => {
  const url = new URL(request.url);
  const city = request.headers.get('cf-ipcity') || 'unknown';
  const body = `Hello from ${city}!`;
  return new Response(body, {status: 200});
};

Deploy with the deployctl tool. The command bundles the script, uploads it to Deno’s global edge network, and returns a public URL.

deployctl deploy --project=my-edge-demo --prod main.ts

Performance Comparison: Latency, Cold Starts, and Billing

Real‑world benchmarks from Q3 2024 show average cold‑start times of 12 ms for Cloudflare Workers and 18 ms for Deno Deploy when the function is under 50 KB. Monthly free tiers differ: Cloudflare offers 100 000 requests and 10 ms·CPU‑ms, while Deno Deploy grants 100 000 requests and 10 GB‑seconds of compute. If your workload stays under 5 ms per request, both platforms remain cost‑free for most hobby projects.

Advanced Tip: Using TypeScript Types Across Both Platforms

Because both runtimes expose the standard Web API, you can write a single .d.ts file that describes the request and response objects. Import it in each project to keep IDE autocomplete consistent.

// types/edge.d.ts
export interface EdgeRequest extends Request {
  cf?: {city?: string; country?: string};
}
export type EdgeHandler = (req: EdgeRequest) => Promise<Response>;

Then reference the type in your handler files:

import type {EdgeHandler} from './types/edge';
export const handler: EdgeHandler = async (request) => {
  const city = request.cf?.city ?? 'unknown';
  return new Response(`Greetings from ${city}`);
};

Debugging and Observability

Both platforms expose request logs in their dashboards, but Cloudflare also supports console.log statements that appear in real‑time via the Workers UI. Deno Deploy integrates with log() and forwards output to the Deploy console. For deeper tracing, attach a traceparent header and forward it to a backend analytics service.

Conclusion: Choosing the Right Edge Runtime

The decision between Cloudflare Workers and Deno Deploy hinges on three factors: geographic distribution, integration needs, and pricing thresholds. Cloudflare’s massive PoP network gives it a slight edge in ultra‑low latency, while Deno’s native TypeScript support reduces build steps for teams already using Deno locally. By following the steps above, you can spin up a JavaScript serverless edge function on either platform in under 15 minutes and start measuring real‑world performance immediately.

Sources

Cloudflare Workers Documentation, Deno Deploy Official Docs, Vercel Edge Runtime Overview

Author: Mahmut Sarıkaya — sarikayadev.com