前端 MVVM 框架 Avalon

前端 MVVM 框架 Avalon

MIT
JavaScript 查看源码»
跨平台
2013-07-18
qinerg

avalon是一个功能强大,体积小巧的MVVM框架。它遵循“操作数据即操作DOM”的理念,让你在代码里基本见不到一点DOM操作代码。DOM操作全部在绑定后,交给框架处理。相当后端有了ORM一样,不用你手写SQL,提高生产力!

与其它js框架相比,同样实现著名的todos功能,(参见todomvc官网),在所有MV*的实现中avalon是让用户写代码最少的。

与其他MV*相比,它不仅轻量,最低支持到IE6,而且性能是最好的。

优势:

  • 使用简单,在HTML中添加绑定,在JS中用avalon.define定义ViewModel,再调用avalon.scan方法,它就能动了!

  • 兼容到IE6(其他mvvm框架, knockoutjs IE6, angularjs IE7, emberjs IE8, winJS IE9 )

  • 没有任何依赖,只有72K,压缩后22K

  • 支持管道符风格的过滤函数,方便格式化输出

  • 局部刷新的颗粒度已细化到一个文本节点,特性节点

  • 要操作的节点,在第一次扫描就与视图刷新函数相绑定,并缓存起来,因此没有选择器出场的余地。

  • 让DOM操作的代码近乎绝迹

  • 使用类似CSS的重叠覆盖机制,让各个ViewModel分区交替地渲染页面

  • 节点移除时,智能卸载对应的视图刷新函数,节约内存

  • 操作数据即操作DOM,对ViewModel的操作都会同步到View与Model去。

与其他框架比较:

  • 它体积更少,在主要的几个MVVM框架(拥有双向绑定机制),knockout是三千多行,angularjs 1.6万, emberjs2-3万行, winjs是几M, kendoui是几M!

  • 兼容情况,kendoui与 knockoutjs IE6, angularjs IE7, emberjs IE8, winJS IE9

  • 让用户写代码更少(可见我给出的todos)

  • 上手难度,与knockout差不多,但借鉴了angularjs的,更为易用。

  • 与knockoutjs, angular, winjs一样是使用动态模板,至少保持第一屏数据是真实的,对SEO友好。

  • 源码也是它们中最易读的。简单的代码也意味着扩展调试等容易。

的码云指数为
超过 的项目
加载中

评论(9)

欲风
欲风
在 todomvc 也没找到关于 avalon 的 Examples 啊
顾志雄
顾志雄
已用,以前的项目用的是1.5的,最近重构权限用的是2的版本,建议最好能够出一些UI封装的DEMO
红薯官方
红薯官方
avalon 已经用了1年。
MaxSherry
MaxSherry
ie9以下的前端mvvm框架首选,用于PC页面开发是不二选择
龙影
龙影
咋没多少人用呢?感觉不错。就是少了些扩展。但足够使用。 Avalon
MartinBockZhu
MartinBockZhu
mark #Avalon#
红薯官方
红薯官方
http://runjs.cn/code/0am2urjo 禁止双向数据同步为什么无效果。 #Avalon#
Tom-Lin
Tom-Lin
avalon2有什么新特性? #Avalon#
红薯官方
红薯官方
已用在oa/crm系统上。 #Avalon#

Avalon 2.2.4 发布,迷你易用的 MVVM 框架

avalon 2.2.4 发布了。avalon是一个功能强大,体积小巧的MVVM框架。它遵循“操作数据即操作DOM”的理念,让你在代码里基本见不到一点DOM操作代码。DOM操作全部在绑定后,交给框架处理。相当后...

2017/01/05 13:52

Avalonjs 2.0.5 发布,迷你易用的 MVVM 框架

Avalonjs 2.0.5 发布,此版本更新内容如下: 本版本最重要就是解决多次渲染的问题,这带来了性能的极大提高! ------------------- 组件里 onInit 会加载多次(延迟到dif...

2016/06/17 12:56

avalonjs 1.5.2 发布,迷你 MVVM 框架

avalon经过几年以后,已成为国内一个举足轻重的框架。它提供了多种不同的版本,满足不同人群的需要。比如avalon.js支持IE6等老旧浏览器,让许多靠政府项目或对兼容性要求够高的公司也能享受M...

2015/09/21 18:24

Avalonjs 1.4.6 发布,迷你易用的 MVVM 框架

Avalonjs 1.4.6 发布,此版本更新内容如下: 修复对flexbox的CSS属性支持 fix IE6-8 VBSCRIPT 对象的D,P属性遍历不出来的BUG fix visible BUG 去掉ms-repeat过火的优化 fix ms-html属性绑定错...

2015/08/17 22:34

avalonjs 1.4.2 发布,迷你MVVM框架

迷你MVVM框架 avalonjs 1.4.2 发布,avalon是一个功能强大,体积小巧的MVVM框架。它遵循“操作数据即操作DOM”的理念,让你在代码里基本见不到一点DOM操作代码。DOM操作全部在绑定后,交给框...

2015/05/04 18:06

迷你 MVVM 框架 avalonjs 1.3.9 发布

本次升级,avalon改进了许多内部方法,大大提升性能,并且带来异步刷新视图的新功能。 ms-html内部不再使用异步 head元素中的avalon元素加入ms-skip指令 重构计算属性,现在超级轻量化 重构C...

2015/01/16 18:44

迷你 MVVM 框架 avalonjs 1.3.6 发布

本版本是一次重要的升级,考虑要介绍许多东西,也有许多东西对大家有用,也发到首页上来了。 本来是没有1.36的,先把基于静态收集依赖的1.4设计出来后,发现改动太多,为了平缓升级起见,才减...

2014/10/14 20:40

迷你MVVM框架 avalonjs 1.3.2 发布

时隔一个月,avalon的新版本终于出来了,本次更新带来强大的模块间通信机制,其他就往常一样FIX BUG。 在文本绑定里,IE会对流离于DOM树外的文本节点的data属性赋值报错,需要添加一层判定 ...

2014/07/13 21:49

迷你MVVM框架 avalonjs 1.2 发布

avalon1.2 带来了许多新特性,让开发更轻松!详见如下: 升级路由系统与分页组件。 对ms-duplex的绑定值进行增强,以前只能prop或prop.prop2,现在可以prop["xxx"]、prop[prop2]。换言之,添...

2014/02/21 17:08

迷你MVVM框架 avalonjs 0.96发布

本版本主要是性能优化与 fix BUG,改进如下: 处理notifySubscribers中的BUG,它在标准浏览器不会移除那些无用的视图刷新函数。详见这里 重构modelBindling.SELECT方法中的updateView, 感谢...

2013/09/23 09:02

没有更多内容

加载失败,请刷新页面

1
回答
avalon 方法的调用

var ava = avalon.define({ $id: "table", table_value: [], check_list: [], sele...

2016/07/19 10:42
4
回答
很是纠结,jQuery插件那么多,但是写起来各种笨重,用还是不用好?
宏哥 的回答 2016/03/29 14:02
最佳答案
引用来自“zabcd117”的评论 这就是为什么公司都有自己的一套工具集或者脚本库,主要是社区维护的东西,有时候可能不太稳定,出现issue也不一定能及时修复。而且出现不满足需求的时候,修改或者重构几乎是不可能的。所以我建议逮着一套稳定的ui库和lib库,就坚持用下去,形成自己的一套工具链。 ...
2
回答
avalonJS问题

@呢喃的猫咪 你好,想跟你请教个问题: avalonJS里 avalon.define = function(id, factory) { var $id...

2015/01/20 21:23

没有更多内容

加载失败,请刷新页面

没有更多内容

【MVVM】- Avalon 基础入门案例

Avalon 国产前端大神司徒正美借鉴knockout和angularJS的基础上开发的mvvm框架,avalon相比knockout和angularJS在运行效率和设备适配上面具有更大的优势,同时具备以上两种框架的部分特点 av...

02/28 08:45
13
0
avalonJS-源码阅读(二)

上一篇文章讲述的avalon刷页面所用到的几个函数。这篇则是主要讲avalon对刷DOM刷出来的avalon自定义属性如何处理的。

2014/05/03 13:45
520
0
AVALON2.2 发布

经过avalon2.0.*与avalon2.1.*这30多个小版本的迭代,avalon终于实现自己一套html parser, 虚拟DOM系统与两个数组的精致diff算法,再结合mobx的一些源码阅读所得,终于催生了avalon2.2。...

2016/11/18 21:27
32
0
Failed to read artifact descriptor for xxx:jar

Failed to read artifact descriptor for xxx:jar 和Missing artifact有关问题,以及相关maven install打war包失败问题...

2015/05/12 16:35
37
0
【MVVM】- Avalon 过滤器

ms-controlle作用:当页面事先加载而页面并未完全渲染完成时自动隐藏目标显示域,待数据完全显示时avalon会自动取消样式,达到遮挡初始静态页面的显示效果 css样式 .ms-controller{ visibili...

02/28 23:00
1
0
avalonJS-源码阅读(三) VMODEL

avalon的重头戏。终于要到我最期待的vmodel了。 ps:这篇博文想做的全一点,错误少一点,所以会有后续的更新在这篇文章中。 状态:一稿

2014/05/05 16:33
2.3K
1
使用avalon实现用户分组管理的介绍

在我的应用中,有一块消息处理的功能,它可以按组给相应的人发送消息。为了方便使用,増加了自定义分组的功能,用户可以自行将人员分为不同的组。目前分组只支持一级,对于日常使用目前是足够...

2013/10/14 13:14
5.6K
5
Avalon-learning 教程基本编写完毕

为了方便对 Avalon 感兴趣的同学快速上手,我花了三天时间写了一个入门教程,地址在 《[Avalon Learing](http://limodou.github.io/avalon-learning/zh_CN/index.html)》,所有文档都放在git...

2014/03/16 20:14
320
1
Java开发条形码

条形码

2015/02/04 16:31
40
0

没有更多内容

加载失败,请刷新页面

返回顶部
顶部