FRAMEWORKS
3
Angular · React · Vue
RUNTIMES
SQLite
浏览器内执行层
PERSISTENCE
OPFS
可回退 IDB / Memory
STREAMING
RxJS
查询 / 事件同一主线
the problem— 01
复杂前端应用缺的,不是组件,而是数据层
很多项目真正难的地方,是数据怎么落盘、怎么查询、怎么写入、怎么保持一致,而不是再给页面状态包一层抽象。
01 / Pillar
真正的本地执行
查询、事务、索引和持久化都在浏览器内完成,不再靠接口缓存模拟离线。
02 / Pillar
查询结果天然可订阅
界面直接跟随数据变化,减少 refetch、invalidate 和状态同步的重复代码。
03 / Pillar
模型就是数据边界
字段、关系、索引和类型围绕实体定义聚合,业务规则不再散落在页面和服务层。
04 / Pillar
跨框架保持同语义
Angular、React、Vue 只保留 UI 绑定差异,模型、查询和写入方式保持一致。
integration path— 02
先跑通本地链路,再决定是否继续扩展
推荐顺序是先建模、再接入数据库、再接入查询和 UI,最后再考虑同步与协作。这样最容易判断它是否适合当前项目。
STEP / 01
先定模型边界
先把字段、关系和索引定义清楚,后面的查询、表单和列表才有稳定基础。
STEP / 02
再选本地执行层
根据场景接入 SQLite 或 PGlite,把真实查询和持久化放进浏览器。
STEP / 03
把查询接入界面
把查询当作可订阅数据源,让界面随结果变化,而不是手写同步逻辑。
STEP / 04
最后按需引入协作
当本地链路稳定后,再引入分支、撤销重做与同步。
framework bindings— 03
三套框架,一套数据语义
先统一模型和查询,再看 Angular、React、Vue 各自的 UI 绑定方式。这样团队讨论的是业务语义,而非三套不同封装。
documentation— 04
文档按接入顺序组织
先快速开始,再建模,再查询,最后看协作与扩展。目的是帮你尽快判断边界,而不是一次性堆砌一堆 API。