[JS/TS] NitroJS：用写前端的方式开发服务端

部署一个 API 接口，你需要配置多久？选框架、处理跨平台兼容、优化构建产物……如果有个工具能让你像写 Vue 组件一样写后端，会是什么体验？

什么是 Nitro

Nitro 是 UnJS 团队开发的服务端工具包，基于轻量级 HTTP 框架 h3 构建。它的设计理念很简单：零配置开发，跨平台部署。

具体来说，它能做到：

• 文件路由自动生成 API
• 同一份代码部署到 Node.js、Cloudflare、Vercel、AWS Lambda
• 内置 TypeScript、热重载、自动导入

主要功能

文件路由系统

不用手动注册路由，创建文件就能生成接口：

// routes/api/user.ts
export default defineEventHandler((event) => {
  return { name: '云栈大前端', id: 123 }
})

访问 /api/user 就能拿到数据，和 Nuxt 的页面路由逻辑一样。

跨平台部署

通过配置文件切换部署目标：

// nitro.config.ts
export default defineNitroConfig({
  preset: 'cloudflare-pages' // 可选 vercel、node-server 等
})

支持 Node.js、Deno、Cloudflare Workers、Vercel、AWS Lambda 等十几个平台。

性能优化

• 服务端缓存：cachedEventHandler 实现缓存，官方测试显示性能提升 600 倍
• 代码分割：基于 Rollup 的 Tree-shaking，构建产物约 50KB
• 边缘部署：支持 CDN 边缘节点部署

实际使用场景

场景 1：搭建 RESTful API

// routes/api/posts/[id].ts
export default defineEventHandler(async (event) => {
  const id = getRouterParam(event, 'id')
  const post = await fetchPost(id)
  return post
})

场景 2：数据缓存

export default cachedEventHandler(
  async () => await fetchHeavyData(),
  { maxAge: 3600 } // 缓存 1 小时
)

场景 3：全栈开发

配合 Nuxt 使用，前后端共享类型定义。

技术实现

路由算法

采用 Radix Tree（前缀树）实现路由匹配，时间复杂度 O(k)，k 为路径长度，比正则匹配更快。

适配器模式

通过预设（Presets）抽象平台差异，开发者只需关注业务逻辑。

中间件处理流程

请求 → 鉴权中间件 → 业务逻辑 → 缓存处理 → 响应

快速开始

# 安装依赖
pnpm add nitropack

# 启动开发服务器
pnpm dev

# 构建生产版本
pnpm build

创建 routes/index.ts：

export default defineEventHandler(() => {
  return 'Hello Nitro!'
})

访问 http://localhost:3000 查看效果。

适合谁用

• 全栈开发者：用熟悉的前端思维写后端
• Serverless 开发者：快速部署到边缘节点
• 性能优化需求：需要缓存和构建优化的项目

总结

Nitro 不是要替代 Express 或 Koa，而是为前端开发者提供一个更直观的服务端工具。如果你在用 Nuxt，Nitro 就是它的服务端引擎；如果你想快速搭建 API，Nitro 能让你几分钟完成部署。

---

关注「云栈大前端」，获取更多技术分享

---

项目地址
https://github.com/nitrojs/nitro

官方文档
https://nitro.build

---

标签：#Nitro #Github #Serverless #全栈开发 #UnJS #服务端 #边缘计算