从零开始的响应式UI框架-序幕

189 阅读1分钟

这几年有很多新兴的小众前端框架,其中尤以 svelte 和 solid 给前端带来了更多的思路和可能性。svelte 的编译期响应式为更小的产物提供了一个新方向,而 solid 的 signal 为精准更新提供了无需 diff 的方案,推广了 signal 模式在前端的使用。这些都是很值得借鉴的模式。 但这两个框架并非无可挑剔,我这里列出几个我认为他们不符合我口味的设计。先说明一下,这纯粹是个人口味,如果不喜欢,请不要介意。

  • svelte 的隐式更新不够明确,在.svelte文件中对变量赋值会引发响应式更新,但在普通 js文件中需要使用 store,以及对变量属性的更新或数组的内部修改却无法做反应式更新,这些都是设计不一致的地方,对使用者并不友好。
  • solid 的响应式依赖跟踪写法多种多样,并不一致。例如 signal 的 get/set 方法,props/store 使用了 proxy/defineProperty 所以只需要属性读取。这导致引入更多的心智负担,例如需要使用 mergeProps 和 splitProps 来处理组件的 props。 我计划从头实现一个设计统一,使用简单且高性能的响应式框架。但由于工作负担比较大,可能随时断更。我会在平台上记录框架的设计准则和实现原理,且适当时候会公开源码。有兴趣的同学可以关注下 ^_^