失业状况（请跳过）
失业在家快一年了，刚过 40 岁，有点不知所措。刚拿到赔偿金那天还很高兴，当天就去自驾游了，但玩得很内疚，总感觉在浪费时间，想是不是该沉下心来学习？于是玩了一周就回家了。
回来后，几个月都在打兼职，写 AI 工具，总共就赚了五千块，还借了六七千块钱给个在创业的朋友（估计是要不回来了）。
后面感觉做兼职是浪费时间，转头研究 AI Agent ，自已写了个本地对话工具，基于 Ollama ，但是本地电脑算力不够，而且 ollama 不支持 mcp ，bridge 写得头大，放弃了。(遗产： https://gitee.com/james-yin01/viviwawa ）
又转头研究腾讯的 KuiklyUI ，自研个“贷款计算 App”，但发现 Kuikly 非常不成熟，文档不全，bug 多，功能不完善，社区没人，果断放弃。（遗产： https://gitee.com/james-yin01/lc-loan-calculator ）
最后，心想还是做自已最擅长的东西吧（我十多年 web 前端开发），于是就花一个月写了个 web 框架。当然，目前只是原型阶段，只是跑通了基本的几个小场景，问题肯定还有很多，所以想在这儿问问大佬们这玩意有没有搞头，有的话就继续写写看，没有的话就放弃搞别的去了。
框架简述
框架名为 LazyCoffee ，是一款设计为面向对象开发的 web 框架。框架地址： https://gitee.com/james-yin01/lc_ood_framework
为什么要开发这个框架？
实话实说，我也是个讨厌重复造轮子的人，没事找事，感觉像刷 KPI 。但我写前端这么多年了，用了巨多框架，各种优点缺点我都心中有数，所以想能不能造个能解决某些痛点，又简单好用的框架，于是就萌生了写框架的想法，绝不是简单的造轮子。
失控的状态变量
我是从 ie6 那年代过来的，我特别喜欢原生开发，有一种掌控全局的感觉，到后面 angular, react, vue ，我发现项目变大后，有种失控的感觉，例如一个 dom 元素会被 state, props, redux 等各种变量控制，产生这样的问题是因为不同的变量有不同的作用域，你必须从上到下传递变量或者利用 redux 这样的框架全局把控。随着代码贡献的人变多，思路不一致，会发现项目的组件像口袋里的有线耳机一样混乱，例如明明可以组件内控制的变量非要用 props 传过来。
举个经典例子：弹窗。我们要做很多个弹窗，所以会有一个叫 Modal 的组件统一显示弹窗，弹窗内容通过props.children传过来，开关通过props.isOpen控制。因为你有很多不同的弹窗，所以你要一个数组来控制所有的弹窗变量，这就需要 redux 之类的状态管理工具来全局把控了。如果要关闭某个弹窗，你要遍历，变更状态，触发更新，麻烦的很。
解决单向流的痛点
其实造成上面的问题的根本原因就是 react, vue 都一直尊循的原则：状态变量单向流，你的状态变量只能从上层往下层传递，如果你的下层组件想变更上层状态变量，是不允许的，如果想实现，只能把状态变量统一提取到全局作用域，下层组件通过变更全局变量才能实现。
为了解决这个问题 LazyCoffee 框架利用了两个古老但实用的设计：元素查找和属性代理。
元素查找和属性代理
如果有两个平行的组件，例如两个弹窗，你不能在一个组件里变更另一个组件的变量，只能改为上下级或者通过共同父组件来控制。但 LazyCoffee 框架就可以，你只要找到另一个组件的实例，然后调用实例方法即可，看下面伪代码：
import { queryOne } from 'lc_ood_framework';
function submit() {
const anotherModal = queryOne('#confirm');
anotherModal.open('Are you sure?', function () {
// do something
});
}
是不是很熟悉的感觉？这不就是 jquery 老一辈的设计嘛？是的，朋友，是的。queryOne就是元素查找的方法，anotherModal就是元素的实例，open就是元素的方法，这个方法就是通过属性代理实现的。
通过这种设计，不管你的组件是平行的，还是上下级，都可以直接操控别的组件，从单向流的桎梏中解脱出来。
是不是有别的办法？
我在想，是不是有别的办法解决上面说的痛点，有必要另外写个框架？有的，朋友，当然有。利用 redux 或 pinia 之类的状态管理库，统一管控起来，然后让团队成员遵守代码规范，做好代码检视，一般是能实现的。我之所有写框架，是想更优雅解决这个痛点，提供一个与众不同的思路。
没了，就这样
框架的其他设计几乎都是照抄 react ，就是代码实现上自已另外造了个轮子，没找到复用的方法（有想到的告诉我，维护一个 jsx 实现是很难的）。
请大佬们指点迷津，谢谢！
另外，有需要前端老中医的欢迎联系我，我失业中，谢谢！
Select Language