使用方式如有不明白,可以参见example中的todoList源码
- Worker中Diff算法,精确更新Dom,缩小了Dom更新范围.
- 列表单独渲染,组件渲染进行diff操作
- 增加ref功能
- 由于主线程与Worker的数据传递限制,性能受影响,暂时取消Worker渲染。
- MessageBus连接池
- 支持多列表
- 多次render合并实现Batch update
- 增加条件渲染,和嵌套列表
模板解析引用Regular中的Parser
在html文件中的script标签下引入
<script src="./dist/Freemamba.js"></script>
在模板中的列表项容器元素的属性中添加
list
<ul list="list1"></ul>
this.$list.list1
在index前插入列表项
this.$list.list1.insert(index, item);
修改指定index的列表项
this.$list.list1.modify(index, item);
删除指定index的列表项
this.$list.list1.delete(index);
替换整个列表数组
this.$list.list1.replace(newArray)
整个组件渲染会在Worker中进行Diff探查,列表渲染为同步更新
this.$render() //渲染整个组件
this.$list.list1.render() //渲染列表实例
进入/examples查看效果以及代码