组件 0.2.1
- 由
- freshOS
- sachadso
组件
组件是一个用于构建面向组件的用户界面的 Swift 框架。
因为 jmjsjsjsjsjsjsjsjsssjs Await for js to enjoy components !
| 组件 | |
|---|---|
| 纯 Swift (无 JS，无 XML) | |
| 声明式 API | |
| 热重载，支持 injectionForXcode | |
| 在 后台 运行的差异算法 | |
| 可以在应用中 增量式 使用 | |
| 没有 外部 依赖 |
使用热重载构建加载页面
class LoadingVC: UIViewController, StatelessComponent {
override func loadView() { loadComponent() }
func render() -> Tree {
return
View([
HorizontalStack(layout: .center, [
Label("Loading..."), ActivityIndicatorView(.gray)
])
])
}
}这就是我们需要渲染加载视图的所有内容！
入门指南
对组件新手？不用担心！Facebook 的 React 指南 是一个获取入门信息的宝库 :)
了解 Komponent 的最好方法，体验 Komponent 的强大功能，是查看示例项目 KomponentsExample.xcodeproj 并进行尝试！
为了获得更好的体验，我们强烈建议启用 热重载
您可以在 修补 部分了解，如同 React 一样，Komponent 如何尝试智能地重绘状态变化时的内容。
您可以在 Wiki 中找到更多详细信息和指南。
安装
Komponents 可以通过手动、Carthage、CocoaPods 或 Swift Package Manager 进行安装。
有关详细安装步骤，请参阅维基页面 这里
贡献者
YannickDot，S4cha，您呢？！
我们期待听到您的想法，所以请通过 issue 或 twit 预计联系@sachadso
许可协议
组件是根据 MIT 许可协议发布的。有关详细信息，请参阅 LICENSE
灵感来源
Facebook 的 React，ComponentKit，Preact，Vue.js AlexDrone 的渲染，Angular...
其他优秀的库
我们并非第一个努力打造快速组件的开发者，以下是一些非常酷的项目
⚠️ v 0.2🏗
请注意，这仍然是一个非常实验性的项目
实际的API可能会也确实会改变。
这不是经过战斗考验的，我们建议您不要将其用于Appstore应用（目前如此）
通过Props进行声明式样式🎨
在UI Kit元素上直接应用样式在v0.1版本中非常方便，但也附带了一些主要问题。确实，节点中的样式块只能在新线程上调用，因为UI Kit是为了从UI线程（大部分情况下）访问而设计的。此外，为了比较样式，我们需要创建一个重复的UI Kit元素（重量级）并找出其中的差异。
这就是Props的作用所在！
想法是有一个Props层，也就是一个定义元素样式的结构，它是可比较的。由于其可比较性，比较两个按钮的样式变得非常简单。例如，您只需编写
let styleIsTheSame = (button.props == newButton.props)
由于其无类型，因此在后台处理差异时也是安全的！
我们能免费获得所有这些好处吗？当然不行，欢迎来到工程领域。最大的缺点是我们必须将每个UI Kit元素属性桥接到对应的Props结构。
然而，随着时间的发展，支持的属性只会变得更好，经典的重构飞越始终可以通过引用可访问，以访问尚未支持的属性。
这样做值得！
一个死简单的声明式布局📐
即将推出的版本将从Autolayout（和Stevia）切换到声明式布局。
新的布局系统基于一个极简单的Layout结构，它结合了经典的StackViews，可以应对99.9%的布局情况。它是一个值类型，这意味着它是线程安全的，从而可以在后台线程上进行比较 :)
虚拟DOM上的Diffing🚀
由于elements、styling和layout完全是发送性、Value-Type和Equatable，我们现在可以安全地将所有繁重的工作放到后台线程！！
在v0.2中，diffing算法（也称为reconciliation）将在虚拟DOM上运行.background线程，并仅在UI线程上安排UI更改。