做 WYSIWYG Markdown 编辑器时,我为什么没继续用 zustand,而是写了 Zenith

2025 年 12 月 15 日
 jaydenWang

我在做一个 WYSIWYG Markdown 编辑器( domd ),体积大约 20KB 。这是一个纯数据驱动的编辑器。

Demo: WYSIWYG Markdown

在这个编辑器里,状态管理是核心问题。我把 domd 的状态管理单独抽出来, 封装成了一个库:Zenith 。

Github: Zenith

Zenith 的思路并不复杂: 把派生状态、缓存和依赖关系,明确地放在 store 内部, 而不是分散在组件和各种 selector 里。

这样带来的结果是:

另一个比较关键的点是 undo / redo 。 Zenith 是基于 Immer patch 的, 不依赖整棵 state 的快照。 在大数据量、频繁编辑的场景下,这一点差异很明显。

Zenith 不是通用型状态库,也不追求简单。 如果你在做编辑器、画布或类似的复杂前端, 可能会对这种设计方式有兴趣。

2238 次点击
所在节点    前端开发
4 条回复
deng565430
2025 年 12 月 15 日
看了下,和 zustand 比反而复杂了,zustand 也能使用 immer
jaydenWang
2025 年 12 月 15 日
抛开 immer ,Zenith 和 Zustand 最主要区别是:
1. Zustand 太自由了,Zenith 修改状态只能约束在 store 中,工程化不友好
2. Zenith 支持使用 memo 计算属性
3. Zenith 派生状态都内聚在 store 中
gyrogogogo
2025 年 12 月 15 日
用 mobx 行不
jaydenWang
2025 年 12 月 15 日
Zenith store 灵感来源于 mobx 的<https://zh.mobx.js.org/defining-data-stores.html>这篇文章。但是实现和 api 不相同

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://v2ex.ih06.com/t/1178890

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX