看到一个很有趣的组件库, 名叫 zag，核心理念是用有限状态机来管理组件的交互逻辑。
https://github.com/chakra-ui/zag
zag 大体由三个部分组成: 1. 状态机核心机制的实现；2. 组件的状态机和属性定义，即开发者对各种组件的最佳实践在状态机体系下的抽象表达，这部分是经验论的；3. 不同框架的 adaptors, 也即组件在 React, Vue 等 UI 框架中的实现。
基于这种清晰的架构，让 zag 脱离了 UI 框架的绑定。与传统的 UIKit 不同的是，zag 提供的并非成品组件，而是组件的属性变化在状态机下的表达，以 API 的形式供 JSX 元素组合使用，非常复合低耦合高内聚的设计原则。这与一些 Headless UI 库类似，但更加灵活，用户自己也可以很方便地自定义符合 zag 写法的组件 API。加上状态机这一方法论的提供，使得复杂状态管理能以更清晰和易于维护的方式完成。zag 可以说是给出了一种 UIKit 开发的新规范。
这两年另一个与状态机有关的热门库是 xstate，与 zag 不同的是，xstate 专注于状态机本身，不提供组件级别的用法和实现，但对状态机的实现更加完备，甚至提供可视化的编辑工具。适用的场景也更加广泛，不再局限于前端，也可以用于后端业务流程的定义。
https://github.com/statelyai/xstate
状态机在计算机科学领域是一个非常古老的概念，如今的开发技术日新月异，它却仍然能够发光发热，可见基础知识理论不会过时。有时候当我们踩了无数个坑所发明出的新技术，或许早就被 50 年前的教授们用更好的方法解决了。这种感受我曾有过几次，在那之后我一直觉得自己的计算机基础知识学的还是太少了，一旦遇上我都会不遗余力地弥补，时刻保持对学术知识的敬畏和学习之心。
https://github.com/chakra-ui/zag
zag 大体由三个部分组成: 1. 状态机核心机制的实现；2. 组件的状态机和属性定义，即开发者对各种组件的最佳实践在状态机体系下的抽象表达，这部分是经验论的；3. 不同框架的 adaptors, 也即组件在 React, Vue 等 UI 框架中的实现。
基于这种清晰的架构，让 zag 脱离了 UI 框架的绑定。与传统的 UIKit 不同的是，zag 提供的并非成品组件，而是组件的属性变化在状态机下的表达，以 API 的形式供 JSX 元素组合使用，非常复合低耦合高内聚的设计原则。这与一些 Headless UI 库类似，但更加灵活，用户自己也可以很方便地自定义符合 zag 写法的组件 API。加上状态机这一方法论的提供，使得复杂状态管理能以更清晰和易于维护的方式完成。zag 可以说是给出了一种 UIKit 开发的新规范。
这两年另一个与状态机有关的热门库是 xstate，与 zag 不同的是，xstate 专注于状态机本身，不提供组件级别的用法和实现，但对状态机的实现更加完备，甚至提供可视化的编辑工具。适用的场景也更加广泛，不再局限于前端，也可以用于后端业务流程的定义。
https://github.com/statelyai/xstate
状态机在计算机科学领域是一个非常古老的概念，如今的开发技术日新月异，它却仍然能够发光发热，可见基础知识理论不会过时。有时候当我们踩了无数个坑所发明出的新技术，或许早就被 50 年前的教授们用更好的方法解决了。这种感受我曾有过几次，在那之后我一直觉得自己的计算机基础知识学的还是太少了，一旦遇上我都会不遗余力地弥补，时刻保持对学术知识的敬畏和学习之心。