js前端库推荐:hyperscript-rxjs
js前端库推荐:hyperscript-rxjs
hyperscript-rxjs是一个直接操作DOM的前端框架库。
hyperscript-rxjs具有如下特点:
- 相比操作DOM模型的命令式代码,hyperscript-rxjs更具声明性。
- hyperscript-rxjs修复或绕开了很多DOM的历史缺陷。
- 像knockout一样,hyperscript-rxjs使用MVVM分离视图与视图模型,不同的是hyperscript-rxjs采取通用的rxjs库来观察变化。
- 像react一样,hyperscript-rxjs操作DOM,与html无关。不同的是hyperscript-rxjs直接操作DOM本身,无虚拟DOM。
- hyperscript-rxjs采用更新的事件标准addEventListener,不采用属性事件onevent。采用rxjs观察DOM模型的变化,事件通知。
- 尽管rxjs是技术发展趋势,用户仍然可以基于hyperscript-rxjs实现代码,渐进实现不依赖任何框架的代码。
hyperscript-rxjs学习难度小于react,并且其知识兼容底层的DOM,实用性更强。教程见单独的文件。
依赖库
hyperscript-rxjs is based on rxjs。
入门
一个Hello World程序,就像写html一样简单。
import { p } from 'hyperscript-rxjs'
export function hello() { return p('hello world!'); }
本框架API的设计和DOM底层完全一致,即使你将来不使用本框架,也会有益于你的职业生涯。本教程的其余部分将更加详细地涵盖前端库的各种功能以及其它高级用法,所以请务必读完整个教程!
教程目录
在github上xp44mm的hyperscript-rxjs-test仓库上有教程及其源代码,本教程由浅入深,请从前到后依次阅读。
readme 创建运行框架
第1章 hyperscript
第2章 textNode
第3章 props
第4章 observable props
第5章 event
第6章 form控件
第7章 组件
第8章 simple list
第9章 表达类似记录的数据
第10章 MVVM
第11章 序列化和反序列化
parseHtml
相关库
structural-comparison
deep-rxjs
parse-html
漫思