迷你MVVM框架 avalonjs 0.85公布

迷你MVVM框架 avalonjs 0.85发布

本版本对循环绑定做了巨大改进，感谢@soom, @limodou, @ztz, @Gaubee 提供的大量测试文件。

fix scanNodes, 在循环绑定（ms-each）扫描元素节点时必须 nextTick,否则旧式IE会忙碌不过来。fix ms-css ,旧式IE style[name] = value, 当value为NaN ，不带单位或不是数值什么会抛异常，需要try catch。旧式IE下有些元素的innerHTML是只读的, 因此不能一律使用innerHTML，并且有些元素的生成，如script标签是不会执行，为此我引入新的parseHTML模块来处理此事。fix AMD 加载因为手误进错分支的BUGfix scanExpr bug， 它在IE10有时会多生成一个绑定对象，异致不渲染错误。重构Collection内部对象与ms-each绑定，引入“事务”的概念，让其插入节点时更加智能高效。

我们看最后一条，我们可以类似纯JS操作为内存操作，DOM操作为IO操作，执行一万次前者所需的时间可能还比不上一次后者的。DOM操作的开销就是这么大。有的DOM操作还会引起reflow，这危害更大。因此明智的做法就是将要操作的节点移出DOM树。更好的办法是，此多个DOM操作合成一个，全部在文档碎片中搞完才插入DOM树。

我们看下面的注解：

??var aaa = [1, 2, 3, 4, 5, 1] ????????????var bbb = [{v: 2}, {v: 3}, {v: 1}, {v: 1}, {v: 5}, {v: 4}] ????????????var swapTime = 0 ????????????var isEqual = Object.is || function(x, y) {//主要用于处理NaN 与 NaN 比较 ????????????????if (x === y) { ????????????????????return x !== 0 || 1 / x === 1 / y; ????????????????} ????????????????return x !== x && y !== y; ????????????}; ????????????for (var i = 0, n = bbb.length; i < n; i++) { ????????????????var a = aaa[i]; ????????????????var b = bbb[i] ????????????????var b = b && b.v ? b.v : b ????????????????if (!isEqual(a, b)) { ????????????????????console.log(++swapTime) ????????????????????var index = getIndex(a, bbb, i); ????????????????????var el = bbb.splice(index, 1) ????????????????????bbb.splice(i, 0, el[0]) ????????????????} ????????????} ????????????function getIndex(a, bbb, start) { ????????????????for (var i = start, n = bbb.length; i < n; i++) { ????????????????????var b = bbb[i]; ????????????????????var check = b && b.v ? b.v : b ????????????????????if (isEqual(a, check)) { ????????????????????????return i ????????????????????} ????????????????} ????????????} ????????????console.log(JSON.stringify(bbb)) //在框架中，aaa为数据模型M中的数组，bbb为视图模型VM中的数组

如果有更好的算法，请多多指教。

经过这次大重构后，avalon在API上基本没有变化了，未来的v0.9就是fix BUG然后发布正式版。