大家好，很高兴又见面了，我是"高级前端进阶"，由我带着大家一起关注前端前沿、深入前端底层技术，大家一起进步，也欢迎大家关注、点赞、收藏、转发！

什么是 Hono

Hono - [炎] 在日语中意味着火焰 ，是一个小型、简单且超快的 Edges Web 框架，适用于任何 JavaScript 运行时：Cloudflare Workers、Fastly Compute、Deno、Bun、Vercel、Lagon、AWS Lambda、Lambda@Edge 和 Node.js。

相比于 itty-router、sunder、worktop 等，Hono 的突出特点就是快，但不仅仅是快。可以概括为以下几个点：

• 超快 ： 借助于路由 RegExpRouter， 非常快，不使用线性循环。
• 轻量级 ： hono/tiny 预设 preset 低于 12kB，零依赖，并且仅使用 Web 标准 API
• 多运行时 ： 适用于 Cloudflare Workers、Fastly Compute、Deno、Bun、Lagon、AWS Lambda、Lambda@Edge 或 Node.js，同一份代码在所有平台上运行。
• 内置电池 ： Hono 具有内置中间件、自定义中间件和第三方中间件，可以拿来即用
• 令人愉快的 DX ： 超级简洁的 API， 一流的 TypeScript 支持。

目前使用 Hono 的优秀应用也非常多，比如：

• Cdnjs API Server ： Cloudflare Workers 一个免费的开源 CDN 服务，底层基于 Hono
• Polyfill.io ： 提供必要的浏览器 polyfill 的 CDN 服务，底层基于 Hono 的核心服务器。
• Ultra：React/Deno 的应用框架，Hono 用于内部服务器。
• Deno Benchmarks： Deno 基于 V8 构建的安全 TypeScript 运行时， Hono 用于基准测试。
• Cloudflare Blog：Cloudflare Workers 平台的部分文章托管基于 Hono

目前 Hono 在 Github 上通过 MIT 协议开源，有超过 8.9k 的 star、3.3k 的项目依赖量、代码贡献者 100+，是一个值得关注的前端开源项目。

如何使用 Hono

Hono 是一个类似于 Express 的简单 Web 应用程序框架，没有前端，在 CDN Edge 上运行，并允许开发者与中间件结合构建更强大的应用程序。 以下是一些典型的用例：

• 构建 Web API
• 后端服务器的代理
• CDN 前端
• 边缘应用
• 库的基础服务器
• 全栈应用

开发者可以使用 Cloudflare Workers 开发工具Wrangler、Deno、Bun 或其他工具在 TypeScript 中编写代码而自动完成转译。

下面在 src/index.ts 中使用 Hono 编写第一个应用程序。 导入和最终导出的默认部分可能因运行时而异，但应用程序代码能在任何运行时运行。

import { Hono } from 'hono';

const app = new Hono();

app.get('/', (c) => {
  return c.text('Hello Hono!');
});

export default app;

如果要获取参数可以通过下面方式：

app.get('/posts/:id', (c) => {
  const page = c.req.query('page');
  const id = c.req.param('id');
  c.header('X-Message', 'Hi!');
  return c.text(`You want see ${page} of ${id}`);
});

路由配置等与 Express 框架什么也非常类似：

app.post('/posts', (c) => c.text('Created!', 201));
app.delete('/posts/:id', (c) => c.text(`${c.req.param('id')} is deleted!`));

在 Cloudflare Workers、Cloudflare Pages、Deno、Bun、Fastly Compute、Lagon、Vercel、Netlify、AWS Lambda、Lambda@Edge、Node.js 等环境中使用 Hono 的示例可以参考文末的资料，这里不再过多展开。

参考资料

https://github.com/honojs/hono

https://hono.dev/top

https://www.youtube.com/watch?app=desktop&v=rJAbSQmhd6s