Serverless 雲端平台開發比較筆記

📋 目錄

Serverless 架構基礎
主要平台比較
Supabase 生態系統
Vercel 開發平台
Cloudflare Workers 平台
成本效益分析
架構選擇指南
最佳實踐建議

🏗️ Serverless 架構基礎

🎯 核心概念

Serverless 是一種雲端運算架構模式，讓開發者專注於編寫程式碼，而不需要管理底層的伺服器基礎設施。

🔑 關鍵特性：

事件驅動執行：函數只在收到請求或觸發事件時才會執行
按需分配資源：雲端供應商動態分配運算資源
自動擴展：根據流量自動水平擴展
按使用量計費：只為實際執行時間和資源使用付費

📊 與傳統架構的差異

特性	傳統伺服器	Serverless
基礎設施管理	需要自行管理	完全託管
擴展方式	手動配置	自動擴展
成本模式	固定成本	按使用量付費
啟動時間	持續運行	按需啟動
狀態管理	可維持狀態	無狀態設計

⚖️ 主要平台比較

🚀 Vercel (前端優先)

專注於前端框架（特別是 Next.js）的部署平台

優勢

極佳的 Next.js 整合
自動 Git 部署
零配置體驗
優秀的開發者工具

限制

主要限於前端框架
Serverless Functions 功能相對基礎
成本隨使用量快速增長

🗄️ Supabase (後端即服務)

開源的 Firebase 替代方案，提供完整的後端服務

優勢

完整的 PostgreSQL 資料庫
內建身份驗證系統
即時資料同步
強大的 CLI 工具

限制

前端需要額外解決方案
學習曲線較陡峭
主要專注於資料庫應用

🌐 Cloudflare Workers (邊緣運算)

全球邊緣網路上的 Serverless 運算平台

優勢

極低延遲（< 5ms 冷啟動）
最佳成本效益
330+ 全球邊緣位置
零出口費用

限制

初始設置較複雜
學習曲線陡峭
生態系統還在發展中

🗄️ Supabase 生態系統

核心服務

1. PostgreSQL 資料庫

-- 完整的 PostgreSQL 功能
CREATE TABLE users (
  id SERIAL PRIMARY KEY,
  name VARCHAR(255) NOT NULL,
  email VARCHAR(255) UNIQUE,
  metadata JSONB,
  created_at TIMESTAMPTZ DEFAULT NOW()
);

-- Row Level Security
ALTER TABLE users ENABLE ROW LEVEL SECURITY;
CREATE POLICY "Users can only see own data" ON users
  FOR SELECT USING (auth.uid() = id);

2. Edge Functions (基於 Deno)

import { serve } from "https://deno.land/std@0.168.0/http/server.ts";
import { createClient } from 'https://esm.sh/@supabase/supabase-js@2';

serve(async (req) => {
  const supabase = createClient(
    Deno.env.get('SUPABASE_URL')!,
    Deno.env.get('SUPABASE_ANON_KEY')!
  );
  
  const { data } = await supabase
    .from('users')
    .select('*');
    
  return new Response(JSON.stringify(data));
});

3. Realtime 功能

// 即時資料同步
const channel = supabase
  .channel('users')
  .on('postgres_changes', {
    event: '*',
    schema: 'public',
    table: 'users'
  }, (payload) => {
    console.log('Database change:', payload);
  })
  .subscribe();

📊 定價方案

項目	Free Tier	Pro Plan ($25/月)
Edge Function 調用	500,000/月	2,000,000/月
資料庫大小	500MB	8GB
檔案儲存	1GB	100GB
月活躍用戶	50,000	100,000

🚀 Vercel 開發平台

Next.js 整合優勢

1. 自動化部署

# 一行命令建立 full-stack 應用
npx create-next-app@latest \
  --typescript \
  --tailwind \
  --app
  
vercel deploy  # 自動檢測並部署

2. API Routes

// app/api/users/route.ts
export async function GET() {
  const users = await fetchUsers();
  return Response.json(users);
}

export async function POST(request: Request) {
  const body = await request.json();
  const user = await createUser(body);
  return Response.json(user, { status: 201 });
}

📊 Serverless Functions 限制

項目	Hobby Plan	Pro Plan ($20/月)
執行時間	10 秒	15 秒 (最高 60 秒)
函數調用	100,000/月	1,000,000/月
函數數量/部署	12 個	24 個
記憶體	1024MB	最高 3008MB

🌐 Cloudflare Workers 平台

技術架構優勢

1. V8 Isolates vs Containers

// 極快的冷啟動 (< 5ms)
export default {
  async fetch(request, env, ctx) {
    // 在全球 330+ 邊緣位置執行
    const response = await processRequest(request);
    return response;
  }
};

                    🏗️ 完整生態系統
                    Workers：Serverless 運算
Pages：前端部署
D1：SQLite 資料庫
KV：鍵值儲存
R2：物件儲存
Durable Objects：狀態管理

                

🗄️ D1 資料庫特性

重要：D1 是基於 SQLite，不是 PostgreSQL

-- SQLite 語法
CREATE TABLE users (
  id INTEGER PRIMARY KEY AUTOINCREMENT,  -- SQLite 語法
  name TEXT NOT NULL,
  email TEXT UNIQUE,
  created_at DATETIME DEFAULT CURRENT_TIMESTAMP
);

-- JSON 操作
SELECT json_extract(metadata, '$.age') as age 
FROM users 
WHERE json_valid(metadata);

⚖️ D1 vs PostgreSQL

特性	D1 (SQLite)	PostgreSQL
架構	嵌入式資料庫	客戶端-伺服器
擴展方式	水平（多個 10GB 資料庫）	垂直擴展
事務	本地事務	完整 ACID
JSON 支援	JSON 函數	原生 JSONB

💰 定價優勢

項目	Free Plan	Paid Plan ($5/月)
請求	100,000/日	10,000,000/月
CPU 時間	10ms/請求	30,000,000ms/月
突發限制	1,000/分鐘	無限制

💰 成本效益分析

流量階層比較

輕量使用 (150萬請求/月)

Cloudflare

在免費額度內

Vercel

$20

Pro plan 基礎費用

Supabase

$25

Pro plan 基礎費用

中等使用 (500萬請求/月)

Cloudflare

$15-25

最具成本效益

Vercel

$45-70

包含前端優化

Supabase

$30-40

包含完整後端

高流量 (5000萬請求/月)

Cloudflare

$30-50

極具競爭力

Vercel

$150-300

成本快速增長

Supabase

$100-200

中等成本

🏗️ 架構選擇指南

選擇決策樹

🚀 選擇 Vercel 當你需要：

最快的 React/Next.js 開發體驗
自動化 Git 部署
團隊協作功能
不在意較高的 API 成本

🗄️ 選擇 Supabase 當你需要：

完整的後端即服務
PostgreSQL 和即時功能
強大的身份驗證系統
快速 MVP 開發

🌐 選擇 Cloudflare 當你需要：

最佳的全球效能
極具競爭力的成本
邊緣運算能力
靈活的架構控制

⚡ 最佳實踐建議

1. 開發工作流程

Cloudflare Workers 設置

# 1. 初始化專案
wrangler init my-app

# 2. 設置資源
wrangler d1 create my-database
wrangler kv:namespace create "CACHE"

# 3. 本地開發
wrangler dev

# 4. 部署
wrangler deploy

混合架構部署

# 後端部署
cd backend
wrangler deploy

# 前端部署
cd frontend
vercel deploy --prod

2. 錯誤處理策略

// 統一錯誤處理
class ApiError extends Error {
  constructor(
    public status: number, 
    message: string
  ) {
    super(message);
  }
}

function handleError(error: unknown): Response {
  if (error instanceof ApiError) {
    return new Response(
      JSON.stringify({ error: error.message }), 
      {
        status: error.status,
        headers: { 'Content-Type': 'application/json' }
      }
    );
  }
  
  return new Response(
    'Internal Server Error', 
    { status: 500 }
  );
}

3. 效能優化

快取策略

// Cloudflare Workers 快取
export default {
  async fetch(request, env) {
    const cacheKey = new Request(request.url, request);
    const cache = caches.default;
    
    // 檢查快取
    let response = await cache.match(cacheKey);
    
    if (!response) {
      // 處理請求
      response = await handleRequest(request, env);
      
      // 設定快取
      response.headers.set(
        'Cache-Control', 
        'public, max-age=300'
      );
      await cache.put(cacheKey, response.clone());
    }
    
    return response;
  }
};

4. 監控和日誌

// 結構化日誌
function logRequest(
  request: Request, 
  response: Response, 
  duration: number
) {
  console.log(JSON.stringify({
    method: request.method,
    url: request.url,
    status: response.status,
    duration: duration,
    timestamp: new Date().toISOString(),
    userAgent: request.headers.get('User-Agent')
  }));
}

🎯 總結

現代 Serverless 開發提供了多種強大的選擇，每個平台都有其獨特的優勢：

Vercel 提供最佳的前端開發體驗
Supabase 提供完整的後端即服務解決方案
Cloudflare Workers 提供最佳的效能和成本效益

關鍵是根據專案需求、團隊技能和預算考量選擇合適的組合。混合架構往往能夠充分利用各平台的優勢，在開發體驗、效能和成本之間找到最佳平衡點。