UI、业务规则、查询和本地持久化先在浏览器内闭环执行。远端负责交换版本,不负责接管每一次读写。
界面、本地领域逻辑、查询与事务都在浏览器内闭环运行。离线时照常可用,联网后再按需同步。
页面状态、表单和详情页直接消费本地查询结果,不必把每次读写都绑在接口往返上。
实体规则、关系约束、查询构造和副作用在浏览器内闭环执行。
SQLite / PGlite + OPFS 负责事务、索引、查询执行和持久化。
把本地提交、分支状态和需要共享的数据推到远端。
把远端最新变更拉回浏览器,再合并进本地数据流。
远端更像共享数据仓库或同步中继点,负责交换版本与变更,不负责替浏览器执行业务主流程。
每一层都围绕“浏览器内可运行的数据应用”这个目标服务
这些能力已经能在文档、demo 和源码里直接验证
从模型到界面,主链路应该短、稳、可重复
const TodoEntity: EntityMetadataOptions = {
name: 'Todo',
displayName: 'Todo',
repository: 'Repository',
extends: ['EntityBase'],
properties: [
{ name: 'title', type: PropertyType.string },
{ name: 'completed', type: PropertyType.boolean, default: false },
{ name: 'createdAt', type: PropertyType.date }
]
};
nx run rxdb-client-generator:generate
# 输出内容包括:
# - 实体类型定义
# - CRUD 与查询辅助代码
# - 框架集成封装
# - 关系映射与表单支持
Todo.find({
where: {
combinator: 'and',
rules: [{ field: 'completed', operator: '=', value: false }]
}
}).subscribe(todos => {
console.log('未完成事项:', todos);
});
const { value: todos } =
useFind(Todo, { where: {...} });
const { value: todos } =
useFind(Todo, { where: {...} });
const { value: todos } =
useFind(Todo, { where: {...} });
相同的模型与查询语义,不同的 UI 绑定层,差异集中在各框架的接入方式上。
这套架构要解决的,是复杂前端应用里数据规则无处安放的问题。先体验 demo,再回到文档,会更容易判断它是否适合你的系统。