zoukankan      html  css  js  c++  java
  • avalon1与avalon2的异同点

    avalon2并不向下兼容avalon1,但许多API与指令很相似,迁移成本比较低。此外,良好的性能与强大的功能是你迁移的动力。下面是一个列表,如有提问尽管提出。

    avalon1与avalon2的异同一览表

    科题 avalon1 avalon2
    如何得知某个属性被改动 使用VBScript,Object.defineProperty实现对=号的重写 在此基础增加Proxy的魔术监听
    如何更新视图 找到变动属性对应的订阅者数组,执行这些数组元素的update方法 使用vm.$render生成虚拟DOM树,diff,从上到下有序更新
    计算属性 支持 移除,使用js指令实现相同功能
    绑定属性的处理 扫描后删除 扫描后还留着
    循环指令 ms-repeat,ms-each,ms-with ms-for
    循环指令的语法 ms-repeat-el='array' ms-for="el in @array"
    如何辩别指令中的vm属性 avalon自行进行语法抽取 强制在前面带@或#符号
    垃圾回收 密封舱机制,负责清空订阅者数组 由于不保存绑定对象,没有CG的烦恼
    性能 一般,但能撑起上万个指令,瓶颈取决于绑定对象的所占内存 原来的5倍以上,瓶颈取决于虚拟DOM的规模
    最复杂的指令 ms-repeat ms-duplex
    数据验证 使用oniui的validation 使用内置的ms-validate,ms-duplex,ms-rules
    组件指令 ms-widget='id,name,opts' ms-widget='Array'传入一个对象数组,用法更灵活
    组件生命周期 onInit, onDispose onInit, onReady, onViewChange, onDispose
    如何操作组件 通过onInit取得组件vm进行操作 直接操作配置对象
    如何对组件传入大片内容 使用ms-html或改成模板 通过slot机制
    加载器 使用AMD风格的内置加载器 移除,建议使用webpack进行打包
    动画 ms-effect(与angular的animate更接近) ms-effect
    模块化 源码里自由划分 使用nodejs的require与module.exports组织起来
    important指令 有(让页面渲染更快)
    {{}}与ms-text的关系 ms-text会对内容再次扫描,不是单纯等价于{{}} 完全等价
    if指令 ms-if ms-if
    attr指令 ms-attr-name=value ms-attr="object" object是一个对象,方便每次处理多个属性
    class指令 ms-class='xxx: toggle' ms-class=’Array
    visible指令 ms-visible ms-visible
    过滤器 只能用于innerText中的{{}}及ms-text, ms-html 数量琳琅满目,所有指令都支持
    js指令 没有 新增
    模板指令 ms-include 移除,由于后端无法实现等价功能
    事件指令 普通的事件绑定 能支持事件代理的都用事件代理
    后端渲染 实现成本高昂 轻松支持
    核心架构 观察者模式 + 属性劫持 大模板函数+虚拟DOM+属性劫持

    其中变量名前加上@,是一个很大的区别。虽然avalon也可以通过内部 分析得到,但可能有缺失,再三考虑,决定加上这一个标识符。如果大家还记得的话,我早些年的ejs模板引擎就是使用@来标识变量的。因此许多东西都是有传承的,都是非常成熟的方案。

    往后,我会出一系列教程来介绍avalon2。avalon的优点可以自行发掘,但可以说一点的是,其兼容性,易用性,体积在市面上都是数一数二的。

    avalon2托管在GITHUB上,心急的人可以先下回来研究,但记得加星啊!

  • 相关阅读:
    ASM ClassReader failed to parse class file- probably due to a new Java class file version that isn't supported yet问题
    Git配置工作
    Git多人协作
    Git分支合并
    网络收藏夹
    莫道桑榆晚,为霞尚满天
    2021幼升小
    2020年07月28日10:36:36
    JAVA中如果用BigDecimal做除法
    mybatis
  • 原文地址:https://www.cnblogs.com/rubylouvre/p/5358820.html
Copyright © 2011-2022 走看看