xcodebuild / overdom Goto Github PK
View Code? Open in Web Editor NEWA tiny view library with JSX, mutate(data) = mutate(DOM).
Home Page: https://xcodebuild.github.io/overdom/
A tiny view library with JSX, mutate(data) = mutate(DOM).
Home Page: https://xcodebuild.github.io/overdom/
我回来了!我发现有人,只使用 ref,而不使用 reactive
https://github.com/pago/reactive#why-refcurrent-instead-of-refvalue
也就是说,模拟不支持 Proxy 的嵌套,但是默认使用 ref 的话,用户就会主动感知到,然后主动加 .value
另外我发现,这里的 diff 算法有优化空间:https://github.com/xcodebuild/overdom/blob/master/packages/overdom/src/directive.ts#L120
这组 API 不需要 Proxy 就可以做到
比如脏检查:https://github.com/yisar/dirty-check
比起 Proxy apply,脏检查的内部实现会精彩一些,但是单纯从 API 来说,其实都有点丑,而且语义也不好
但是不管怎么说,我个人不喜欢将这个思路用于 jsx……
jsx 这种偏 runtime 的 dsl,怎么写怎么憋屈
Funtional API 存在不小心解构 props
后无法响应的问题,见 #2 中的讨论
const Count = ({ count }) => {
const state = reactive({
get double() {
return count * 2; // 无法 reactive
}
});
return <div>{count}</div> // 这里消费了,所以不会再报错
}
如果基于 class
重新设计 API 可以规避上述问题:
class Count {
@reactive props;
@compute get double() {
const {
count,
} = this.props; // 这样解构没有问题,因为是以函数为维度响应的
return count * 2;
}
render() {
const {
count,
} = this.props; // 同样的没有问题
return <div>{count} {this.double}</div>;
}
}
关于逻辑组合方面可以考虑用实例化的方式组合
class NewCount {
count: new Count();
render() {
return <div>{this.count.double}</div>
}
}
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.