Worktop

该介绍目前仅提供英文版本。

The next generation web framework for Cloudflare Workers

Overview

Worktop is a lightweight, TypeScript-first framework designed specifically for Cloudflare Workers. It provides a familiar request-response API pattern while leveraging the unique capabilities of the Workers platform. With its modular design, Worktop enables developers to use only what they need, keeping deployments small and efficient.

Key Features

• 📦 Super Lightweight: Minimal bundle size with no bloat
• 📝 First-Class TypeScript Support: Built with TypeScript from the ground up
• 🔌 Custom Middleware Support: Easily extend functionality with middleware
• 🧩 Modular Design: Well-organized submodules for à la carte functionality
• 🛣️ Powerful Router: Pattern-based routing with named parameters
• ⚡ Async Support: Full async/await handler compatibility
• 🌲 Tree-Shakable: Only include what you actually use

Core Modules

Worktop is organized into focused submodules to keep your applications lean:

• Core Router: The main routing system for handling requests
• KV: Utilities for interacting with Cloudflare Workers KV storage
• Cache: Helpers for working with Cloudflare’s Cache API
• CORS: Easy CORS header management
• Crypto: Cryptographic utilities
• Cookie: Cookie parsing and serialization
• Base64: Base64 encoding/decoding utilities
• WebSockets: WebSocket connection management
• Utils: General purpose utilities like ID generation

Usage Example

import { Router } from 'worktop';
import * as Cache from 'worktop/cache';
import { uid } from 'worktop/utils';
import { read, write } from 'worktop/kv';
import type { KV } from 'worktop/kv';

declare var DATA: KV.Namespace;

interface Message {
  id: string;
  text: string;
}

// Initialize router
const API = new Router();

// GET endpoint with route parameter
API.add('GET', '/messages/:id', async (req, res) => {
  const key = `messages::${req.params.id}`;
  const message = await read<Message>(DATA, key);
  
  res.setHeader('Cache-Control', 'public, max-age=60');
  res.send(200, message);
});

// POST endpoint with request body parsing
API.add('POST', '/messages', async (req, res) => {
  try {
    var input = await req.body<Message>();
  } catch (err) {
    return res.send(400, 'Error parsing request body');
  }

  if (!input || !input.text.trim()) {
    return res.send(422, { text: 'required' });
  }

  const value: Message = {
    id: uid(16),
    text: input.text.trim()
  };

  const key = `messages::${value.id}`;
  const success = await write<Message>(DATA, key, value);

  // Background tasks with event.waitUntil
  req.extend(
    fetch('https://.../logs', {
      method: 'POST',
      headers: { 'content-type': 'application/json' },
      body: JSON.stringify({ success, value })
    })
  );

  if (success) res.send(201, value);
  else res.send(500, 'Error creating record');
});

// Health check endpoint
API.add('GET', '/alive', (req, res) => {
  res.end('OK');
});

// Attach to fetch event with cache support
Cache.listen(API.run);

Benefits for Cloudflare Workers Development

1. Familiar Patterns: Uses a Node-like request/response pattern that’s familiar to most web developers
2. Type Safety: Strong TypeScript support reduces errors and improves developer experience
3. Performance Focus: Designed for optimal performance in the Cloudflare Workers environment
4. Modular Design: Import only what you need to keep your Worker deployments small
5. Maintained Simplicity: Remains simple while providing the tools needed for complex applications

When to Use Worktop

• Building REST APIs on Cloudflare Workers
• Creating microservices on the edge
• Developing applications that need type safety and IDE support
• When performance and bundle size are critical considerations

Requirements

• Cloudflare Workers account
• Basic understanding of serverless architecture
• TypeScript knowledge (recommended but not required)

License

MIT © Luke Edwards