传统 ORM（如 Prisma、TypeORM）主要运行在后端，但随着 PWA、离线优先应用的流行，前端也需要类似 ORM 的能力来管理浏览器本地数据。本文介绍 2026 年主流的前端 ORM/数据库方案。

为什么需要前端 ORM？

• 离线支持
• 快速本地读写（避免网络请求）
• 复杂查询与关系管理
• 数据同步到后端

主流存储：IndexedDB（最强大）、localStorage（简单但有限）

推荐方案对比

| 方案 | 存储引擎 | 类型安全 | 查询能力 | 活跃度（2026） | 适用场景 | | ------------ | ---------------- | -------- | -------- | ---------------- | ------------------- | | Dexie.js | IndexedDB | TS 支持 | 强大 | 高 | 大多数 Web 离线应用 | | idb | IndexedDB | TS 支持 | 中等 | 中 | 轻量级项目 | | LokiJS | IndexedDB/Memory | TS 支持 | 强大 | 中 | 需要复杂查询的 SPA | | WatermelonDB | IndexedDB/SQLite | 高 | 极强 | 大型离线优先应用 |

Dexie.js 实战示例（最推荐）

Dexie.js 是 IndexedDB 上最流行的 ORM-like 库，API 简洁，支持 TypeScript。

import Dexie, { Table } from 'dexie';

interface Todo {
  id?: number;
  title: string;
  done: boolean;
  createdAt: Date;
}

class TodoDB extends Dexie {
  todos!: Table<Todo>;

  constructor() {
    super('TodoDB');
    this.version(1).stores({
      todos: '++id, title, done, createdAt'
    });
  }
}

const db = new TodoDB();

// 增删改查
await db.todos.add({ title: '学习 Next.js', done: false, createdAt: new Date() });
await db.todos.where('done').equals(false).toArray();
await db.todos.update(1, { done: true });
await db.todos.delete(1);

与后端同步策略使用背景 sync（Service Worker）
结合 Supabase/Realtime 或 Firebase 的客户端 SDK
冲突解决：最后写入胜出或 CRDT

小结虽然前端没有传统意义上的后端 ORM，但 Dexie.js 等方案已经足够强大，能满足大多数离线和本地缓存需求。2026 年的趋势是：更多应用采用“本地优先 + 后端同步”架构，前端 ORM 将成为 PWA 的标配能力。