핵심 요약
Hono 4는 14KB로 가장 빠른 Edge 웹 프레임워크. Cloudflare Workers와 묶으면 인증·DB·스토리지·이미지 처리·실시간을 단일 코드베이스 30분 안에 띄운다. RPC 클라이언트로 프론트엔드와 타입 공유, JSX 서버 렌더, D1·R2·KV 직접 바인딩이 핵심. 단, 30초 CPU 제한·메모리 128MB 등 Workers 제약은 그대로.
1. 왜 Hono인가
- 표준 Request/Response: Web 표준만 사용 — Workers, Bun, Deno, Node 어디서나
- 14KB: cold start 1ms 이내
- RPC 타입 공유: tRPC 비슷하지만 별도 schema 정의 불필요
- 플랫폼 미들웨어 내장: CF Workers, Vercel, AWS Lambda 어댑터
2. 30분 셋업 — 부트스트랩
npm create hono@latest my-app
# Template: cloudflare-workers
# Package manager: pnpm
cd my-app
pnpm install
pnpm dev # localhost:8787
3. 라우트 + JSX 렌더
// src/index.tsx
import { Hono } from "hono";
import { jsxRenderer } from "hono/jsx-renderer";
const app = new Hono<{ Bindings: Env }>();
app.get("*", jsxRenderer(({ children }) => (
<html>
<head><title>Edge App</title></head>
<body>{children}</body>
</html>
)));
app.get("/", (c) => c.render(<h1>Hello Edge</h1>));
export default app;
4. RPC 클라이언트 — 타입 공유
// 서버
const route = app
.get("/users/:id", (c) => c.json({ id: c.req.param("id"), name: "Sam" }))
.post("/users", async (c) => {
const body = await c.req.json<{ name: string }>();
return c.json({ ok: true, name: body.name });
});
export type AppType = typeof route;
// 클라이언트
import { hc } from "hono/client";
import type { AppType } from "./api";
const client = hc<AppType>("https://api.example.com");
const res = await client.users[":id"].$get({ param: { id: "1" } });
const user = await res.json(); // 타입 추론 완료
5. D1 (SQLite) 바인딩
// wrangler.toml
[[d1_databases]]
binding = "DB"
database_name = "app-prod"
database_id = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
// src/index.ts
app.get("/posts", async (c) => {
const { results } = await c.env.DB
.prepare("SELECT * FROM posts WHERE published = ?1 ORDER BY created_at DESC LIMIT 20")
.bind(1)
.all();
return c.json(results);
});
6. 성능 실측 — Workers vs Bun vs Node
같은 Hono 코드, "Hello World + JSON 응답" 벤치마크.
| 런타임 | RPS | p99 ms | cold start | 월 비용 1B req |
|---|---|---|---|---|
| CF Workers | 148K | 9 | 1ms | $300 |
| Bun 1.2 (VPS) | 165K | 6 | 40ms | $60 (인스턴스) |
| Node 22 (VPS) | 112K | 11 | 180ms | $60 |
| Vercel Edge (Hono) | 78K | 18 | 30ms | $420 |
7. R2 + KV로 세션·캐시
app.get("/cached/:slug", async (c) => {
const slug = c.req.param("slug");
const cached = await c.env.KV.get("post:" + slug, "json");
if (cached) return c.json(cached);
const fresh = await fetchPostFromAPI(slug);
await c.env.KV.put("post:" + slug, JSON.stringify(fresh), {
expirationTtl: 300,
});
return c.json(fresh);
});
8. 함정 — Workers 제약 7가지
| 제약 | 한계 | 해결 |
|---|---|---|
| CPU 시간 | 요청당 30s (Paid) | 긴 작업 Queue로 |
| 메모리 | 128MB | 스트리밍 처리 |
| 서브리퀘스트 | 50개 (Free 50, Paid 1000) | 병렬화·캐싱 |
| Node API | nodejs_compat 켜야 일부 가능 | 표준 API 우선 |
| 파일 시스템 | 없음 | R2/KV로 대체 |
| WebSocket 시간 | hibernation 권장 | Durable Objects |
| D1 쿼리 크기 | 응답 1MB | 페이지네이션 |
참고
- hono.dev
- developers.cloudflare.com/workers

댓글 0