Hono 4 - 超高速Webフレームワークの進化 | 最新情報

Honoとは

Honoは、Cloudflare Workers、Deno、Bun、Node.jsなど複数のランタイムで動作する超軽量・高速なWebフレームワークです。Express風のAPIと優れたTypeScriptサポートが特徴です。

Hono 4の新機能

hono/jsx の強化

import { Hono } from 'hono';
import { FC } from 'hono/jsx';

const Layout: FC = (props) => {
 return (
 <html>
 <head>
 <title>{props.title}</title>
 </head>
 <body>{props.children}</body>
 </html>
 );
};

const app = new Hono();

app.get('/', (c) => {
 return c.html(
 <Layout title="Home">
 <h1>Welcome to Hono!</h1>
 </Layout>
 );
});

JSXストリーミング

import { Suspense } from 'hono/jsx';
import { renderToReadableStream } from 'hono/jsx/streaming';

const AsyncComponent: FC = async () => {
 const data = await fetchData();
 return <div>{data}</div>;
};

app.get('/stream', (c) => {
 const stream = renderToReadableStream(
 <Layout>
 <Suspense fallback={<div>Loading...</div>}>
 <AsyncComponent />
 </Suspense>
 </Layout>
 );
 return c.body(stream, {
 headers: { 'Content-Type': 'text/html' }
 });
});

RPC機能

型安全なクライアント・サーバー間通信を実現します。

サーバー側

import { Hono } from 'hono';
import { zValidator } from '@hono/zod-validator';
import { z } from 'zod';

const app = new Hono()
 .get('/users', async (c) => {
 const users = await db.users.findMany();
 return c.json(users);
 })
 .post(
 '/users',
 zValidator('json', z.object({
 name: z.string(),
 email: z.string().email()
 })),
 async (c) => {
 const data = c.req.valid('json');
 const user = await db.users.create(data);
 return c.json(user, 201);
 }
 )
 .get('/users/:id', async (c) => {
 const id = c.req.param('id');
 const user = await db.users.findById(id);
 return c.json(user);
 });

export type AppType = typeof app;
export default app;

クライアント側

import { hc } from 'hono/client';
import type { AppType } from './server';

const client = hc<AppType>('http://localhost:3000');

// 完全な型推論！
const users = await client.users.$get();
const usersData = await users.json(); // User[]型

const newUser = await client.users.$post({
 json: { name: 'Alice', email: 'alice@example.com' }
});

const user = await client.users[':id'].$get({
 param: { id: '123' }
});

ミドルウェア

組み込みミドルウェア

import { Hono } from 'hono';
import { cors } from 'hono/cors';
import { logger } from 'hono/logger';
import { secureHeaders } from 'hono/secure-headers';
import { compress } from 'hono/compress';
import { cache } from 'hono/cache';

const app = new Hono();

app.use('*', logger());
app.use('*', cors());
app.use('*', secureHeaders());
app.use('*', compress());
app.use('/api/*', cache({ cacheName: 'api-cache', cacheControl: 'max-age=60' }));

認証ミドルウェア

import { jwt } from 'hono/jwt';
import { bearerAuth } from 'hono/bearer-auth';

// JWT認証
app.use('/api/*', jwt({
 secret: 'your-secret-key'
}));

app.get('/api/protected', (c) => {
 const payload = c.get('jwtPayload');
 return c.json({ userId: payload.sub });
});

// Bearer認証
app.use('/admin/*', bearerAuth({
 token: 'admin-token'
}));

バリデーション

Zodとの統合

import { zValidator } from '@hono/zod-validator';
import { z } from 'zod';

const createUserSchema = z.object({
 name: z.string().min(1),
 email: z.string().email(),
 age: z.number().int().positive().optional()
});

app.post(
 '/users',
 zValidator('json', createUserSchema),
 async (c) => {
 const data = c.req.valid('json');
 // dataは型安全
 return c.json({ message: 'Created', user: data });
 }
);

マルチランタイム対応

// Cloudflare Workers
export default app;

// Deno
Deno.serve(app.fetch);

// Bun
export default {
 port: 3000,
 fetch: app.fetch
};

// Node.js
import { serve } from '@hono/node-server';
serve(app);

ベンチマーク

リクエスト/秒（シンプルなJSON応答）:

Express: 15,000
Fastify: 45,000
Hono (Bun): 120,000
Hono (Cloudflare Workers): 100,000+

ファイルベースルーティング

// routes/users.ts
import { Hono } from 'hono';

const users = new Hono();

users.get('/', (c) => c.json([]));
users.get('/:id', (c) => c.json({ id: c.req.param('id') }));

export default users;

// index.ts
import { Hono } from 'hono';
import users from './routes/users';

const app = new Hono();
app.route('/users', users);

export default app;

採用判断のポイント

Honoは軽量で高速なルーティングが魅力ですが、どのプロジェクトにも無条件で向くわけではありません。Cloudflare WorkersやBun、Denoのようなエッジ・軽量ランタイムを前提にする場合は強みが出やすく、既にExpress資産が大きい場合は移行コストも見積もる必要があります。

見るべきなのはベンチマークの数字だけではなく、チームが使う認証、バリデーション、ロギング、テスト、デプロイ先と自然に組み合わせられるかです。小さなAPIから試し、ミドルウェア構成とエラーハンドリングを確認してから採用範囲を広げるのが現実的です。

使いどころ

エッジ環境で低レイテンシのAPIを作りたい
ルーティングとミドルウェアを薄く保ちたい
TypeScriptで型を効かせた小〜中規模APIを作りたい
Express風の書き心地を保ちながら軽量化したい

まとめ

Hono 4は、TypeScriptファーストの設計とマルチランタイム対応により、モダンなWebアプリケーション開発に最適なフレームワークです。RPC機能による型安全なAPIクライアントは、特にフルスタック開発で大きな生産性向上をもたらします。

参考リソース

← 一覧に戻る