avalonjs - 相关文章

前端神器avalonJS入门（一）

转自:http://www.cnblogs.com/vajoy/p/4063824.html avalonJS是司徒正美开发和维护的前端mvvm框架,可以轻松实现数据的隔离和双向绑定,相比angularJS等前端框架它有如下优势: 1.压缩后仅有60多kb,而angular的min版是100多kb: 2.兼容IE6+,符合天朝市场需求: 3.效率更高,跑起来比angular和knockout都要更快,在移动端上该优势会更大(avalon有移动端专版的avalon.modern.js).关于其性能…

迷你MVVM框架 avalonjs 入门教程

新官网请不要无视这里,这里都是链接,可以点的 OniUI组件库学习教程视频教程: 地址1 地址2 关于AvalonJs 开始的例子扫描视图模型数据模型绑定作用域绑定(ms-controller, ms-important) 忽略扫描绑定(ms-skip) 模板绑定(ms-include) 数据填充(ms-text, ms-html) 类名切换(ms-class, ms-hover, ms-active) 事件绑定(ms-on,--) 显示绑定(ms-visible) 插入绑定(m…

JS高级群的日常！写一个从10到0的倒计时，用console.log打印，不可以用 setInterval！本来说好的研究avalonJS最后演变成了看着大神在那边互相比拼实力。。

JS高级群的日常!写一个从10到0的倒计时,用console.log打印,不可以用 setInterval!本来说好的研究avalonJS最后演变成了看着大神在那边互相比拼实力.. 小森执行一个函数没有全局变量写一个从10到0的倒计时用console.log打印不可以用 setInterval 小白..额,可以多次调用setTimeout()吗某个被打败的神Function fn(a){console.log(a--);if(a>=0) Settimeo…

前端神器avalonJS入门（二）

本章开始搭配requireJS来使用avalon,开始之前,我们可以对avalon进行精简改造(注:新版的avalon已提供了shim版本,无需再做如下的精简了,直接点这里获取). avalon源码里有自己的AMD加载器和DOMReady模块,使用requireJS来加载各依赖脚本的话,使用其配套插件DOMReady来ready执行会更合适,而且avalon的AMD模块也多余了.故我们可以把这俩块代码咔嚓掉. 只需要在源码里搜索“AMD”和“DOMReady”就能找到位于尾部的这俩模块,删掉它们…

使用MVVM框架（avalonJS）进行快速开发

背景在运营活动开发中,因为工作的重复性很大,同时往往开发时间短,某些情况下也会非常紧急,导致了活动开发时间被大大压缩,同时有些活动逻辑复杂,数据或者状态变更都需要手动渲染,容易出错,正是因为这些问题的存在,所以才有了MV*框架的诞生,比如大名鼎鼎的angularJS.今天就跟大家讲讲国产的MVVM框架avalonJS是如何快速进行开发的,同时大家也可以对比石器时代的开发模式(jquery或者zepto)与mv*模式的区别. avalonJS简介 avalonJS是前端大牛司徒正美开发和维护的m…

avalonjs 1.3.7发布

avalonjs 1.3.7发布又到每个月的15号了,现在avalon已经固定在每个月的15号发布新版本.这次发布又带来许多新特性,让大家写码更加轻松,借助于“操作数据即操作DOM”的核心理念与双向绑定机制,现在越来越多人加入到avalon的阵营中来.此外,基于avalon的UI库OniUI也越来越强大,很快,树组件也开发完毕,下星期也与大家见面了.到时,OniUI也有两个Grid组件,一个树组件的完整UI库.与本次发布的UI还有验证组件,mask组件,百叶窗切换组件…… UI库的广告就到时为…

avalonJS入门（一）

前端神器avalonJS入门(一) posted @ 2014-10-31 17:44 vajoy 阅读(1665) 评论(32) 编辑收藏 avalonJS是司徒正美开发和维护的前端mvvm框架,可以轻松实现数据的隔离和双向绑定,相比angularJS等前端框架它有如下优势: 1.压缩后仅有60多kb,而angular的min版是100多kb: 2.兼容IE6+,符合天朝市场需求: 3.效率更高,跑起来比angular和knockout都要更快,在移动端上该优势会更大(avalon有移动…

迷你MVVM框架 avalonjs 0.95发布

迷你MVVM框架 avalonjs 0.95发布本版本最主要的改进是ms-with 深层绑定的实现,至少,avalon1.0所有重要的feature已经开发完毕,之后就是小补小漏,性能优化了. ms-with进行绑定.对VM的某个对象属性重新赋给它一个对象,那么页面上对应的列表将根据它的键值对重新排列增删,修改它的$val.如果对它的对象属性的某一个键重新赋值 ,只会进行更新操作,详见index21with.html, index22with.html, index23with.html ms…

迷你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是只读的,…

迷你MVVM框架 avalonjs 0.82发布

迷你MVVM框架 avalonjs 0.82发布本版本最大的改进是启用全新的parser. parser是用于干什么的?在视图中,我们通过绑定属性实现双向绑定,比如ms-text="firstName", ms-html="sex + '士'", ms-visible="Math.abs(toggle + 2000) >= 20", 我们需要将它们转换为求值函数.我们通过ms-controller="vm"来绑定Vie…

avalonjs学习笔记之实现一个简单的查询页

官网地址:http://avalonjs.coding.me/ 因为是为了学习js,所以对样式没什么要求,先放效果图: 步骤为:初始页面-------条件查询-------编辑员工1-------保存编辑(主要保存这里需要优化,因为新编辑的数据只能放到列表最后位置) HTML页面代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="te…

AvalonJS+MVVM实战部分源码

轻量级前端MVVM框架avalon,它兼容到 IE6 (其他MVVM框架,KnockoutJS(IE6), AngularJS(IE9), EmberJS(IE8), WinJS(IE9) ),它可以更高效地运行于IE10等新版本浏览器中.代码量少,方便格式化输出. AvalonJS的使用很方便,类似基础标签绑定值,前端代码非常简洁,如果你有一定的JS基础,上手都是很快的.大家下来可以了解一下. 不闲聊,直接看部分代码示例: <script type="text/javascript&qu…

avalonjs 中的if else实现的几种方法

在学习avalonjs的过程中,发现模板中并没有if else这样的写法,不像tempalte ejs这些,所以总结了三种方法来实现,仅供在使用avalonjs的同学参考,主要是通过ms-if 表达式和方法来实现. 1.开始前的准备首先是做一个简单的html作为基础 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; ch…

利用Bootstrap+Avalonjs+EntityFramework 开发ASP.NET WebForm应用程序（上）

本文将介绍如何利用Bootstrap+Avalonjs+EntityFramework 开发ASP.NET WebForm应用程序,分为上下两篇.上篇主要介绍实现,下篇主要介绍界面. 打开Visual Studio Web Express2013新建一个空白应用程序 ContactSample--联系人示例 (1)数据库引入界面文件BootStrap,JS文件jquery和avalon,建立联系人页面Contact.aspx. 打开数据库,设计数据库ContactSample,数据库比较简单,…

迷你MVVM框架 avalonjs 1.3.9发布

本次升级,avalon改进了许多内部方法,大大提升性能,并且带来异步刷新视图的新功能. ms-html内部不再使用异步 head元素中的avalon元素加入ms-skip指令重构计算属性,现在超级轻量化重构CG回收,不会每次都全部检测所有绑定对象重构内部方法isArrayLike,更好的判定非负整数重构number过滤器重构widget的节点回收,去掉onTree方法重构Collection内部工厂重构modelFactory, 现在VM.$event.$digest开启异步刷新视…

迷你MVVM框架 avalonjs 1.3.8发布

avalon1.3.8主要是在ms-repeat. ms-each. ms-with等循环绑定上做重大性能优化,其次是对一些绑定了事件的指令添加了roolback,让其CG回收更顺畅. 重构ms-repeat.ms-each.ms-with, 内部的代理对象全部使用普通的对象实现, 并且一个监控数组只对应一个代理VM数组,从而大量减少VM的数量. avalon不再使用scanCallback实现内部各种rendred回调,改成checkScan方法.详看这里的例子. fix parseHTML在…

迷你MVVM框架 avalonjs 1.3.7发布

又到每个月的15号了,现在avalon已经固定在每个月的15号发布新版本.这次发布又带来许多新特性,让大家写码更加轻松,借助于"操作数据即操作DOM"的核心理念与双向绑定机制,现在越来越多人加入到avalon的阵营中来.此外,基于avalon的UI库OniUI也越来越强大,很快,树组件也开发完毕,下星期也与大家见面了.到时,OniUI也有两个Grid组件,一个树组件的完整UI库.与本次发布的UI还有验证组件,mask组件,百叶窗切换组件-- UI库的广告就到时为止,我们看一下新版本带来…

迷你MVVM框架 avalonjs 1.3.6发布

本版本是一次重要的升级,考虑要介绍许多东西,也有许多东西对大家有用,也发到首页上来了. 本来是没有1.36的,先把基于静态收集依赖的1.4设计出来后,发现改动太多,为了平缓升级起见,才减少了一部分新特性,做成1.36.因此是先有1.4,才有1.36. 本版本针对公司(去哪儿网,毕竟是带薪在公司里搞这框架)的访问浏览器的占有率,加大对国产浏览器的测试.涉及浏览器有QQ浏览器, 搜狗浏览器, 猎豹浏览器, 傲游浏览器,但没有360浏览器,我们公司的同事还是很注意安全的.这么多浏览器,现在还差两个ca…

迷你MVVM框架 avalonjs 1.3.5发布

本版本主要是修复内存泄漏问题,让其在移动端更好的运作. 修正visible BUG 详见这里修正$fire方法里的正则错误详见这里修正ms-attr BUG,在IE9-11,直接用element.setAttribute("value","xxx")还是不能同步到element.value 详见这里修正ms-class BUG,现在ms-hover对应的属性发生变成,类名也能跟着变了详见这里修正avalon.modern的AMD加载器的onerror触发逻…

迷你MVVM框架 avalonjs 1.3.4发布

发现一个以前从来没发现的大BUG,紧急发布此版本. fix getEachProxy BUG,此BUG会导致监控数组在删除某元素然后再添加元素时出现问题. avalon ms-on-*绑定添加一个钩子,方便以后扩展. 添加一个统一的去掉内部方法 uniqSet. DOMNodeRemoved事件不好用,改用DOMNodeRemovedFromDocument事件监听元素是否被移除添加一个全局心跳检测函数,avalon.tick,要求放入一个函数,当它返回false就从心跳列队中移除它.现在有关…

迷你MVVM框架 avalonjs 1.3.3发布

大家可以在仓库中看到,多出了一个叫avalon.observe的东西,它是基于Object.observe,dataset, Promise等新API实现.其中,它也使用全新的静态收集依赖的机制,这个机制也完成得差不多,因此avalon与avalon.mobile下一版将会应用这最新成果,进行大改. fix IE6-8下直接修改表单元素值不触发data-duplex-changed回调的BUG, 详见这里 chrome浏览器对文本域进行Ctrl+V操作,会触发DOMNodeRemoved事件,这…

迷你MVVM框架 avalonjs 1.3.2发布

时隔一个月,avalon的新版本终于出来了,本次更新带来强大的模块间通信机制,其他就往常一样FIX BUG. 在文本绑定里,IE会对流离于DOM树外的文本节点的data属性赋值报错,需要添加一层判定派发事件的逻辑,由DOC.createEvent("Event")必成DOC.createEvent("Events") 添加一个反XSS的过滤器sanitize 重构事件系统,暴露eventHooks对象 firefox添加对mousewheel的兼容支持升级ms-…

迷你MVVM框架 avalonjs 1.2发布

avalon1.2 带来了许多新特性,让开发更轻松!详见如下: 升级路由系统与分页组件. 对ms-duplex的绑定值进行增强,以前只能prop或prop.prop2,现在可以prop["xxx"].prop[prop2].换言之,添加对数组法对子属性的支持.详见这里 ms-duplex支持用JS修改input.value触发oninput事件(实现旧式IE下onpropertychange的功能),实现大量第三方组件都会操作input.value,有了这功能,我们就不需要写额外回调实…

迷你MVVM框架 avalonjs 1.3发布

性能得到大幅改良的avalon1.3发布了. 修复$outer BUG 修复IE6-8下扫描加载Flash资源的OBJECT标签时,遇到它既没有innerHTML也没有getAttributeNode的奇葩情况,解决方法是直接忽略它 ms-duplex添加对中文输入法的处理 removeFromSanctuary添加一分支,加强对旧式IE的节点的内存回收 fix 监控数组的set方法无法同步$model BUG 重构avalon.fn.offset方法 fix avalon.fn.data BU…

迷你MVVM框架 avalonjs 1.3.1发布

avalon1.3.1发布. interpolate支持注释节点做定界符,avalon.config({interpolate:[""]}) 监控数组添加pushArray方法,类似于push方法,不过参数是一个数组 data-duplex-changed回调会在第一次赋值就触发添加一配置项,调整ms-repeat的对象池的大小,avalon.config({maxRepeatSize:30}) 迷你MVVM框架在github的仓库…

avalonJS入门

前端神器avalonJS入门(一) posted @ 2014-10-31 17:44 vajoy 阅读(8759) 评论(42) 编辑收藏 avalonJS是司徒正美开发和维护的前端mvvm框架,可以轻松实现数据的隔离和双向绑定,相比angularJS等前端框架它有如下优势: 1.压缩后仅有60多kb,而angular的min版是100多kb: 2.兼容IE6+,符合天朝市场需求: 3.效率更高,跑起来比angular和knockout都要更快,在移动端上该优势会更大(avalon有移动…

AvalonJS学习笔记（一）

一.关于AvalonJS avalon是国内的一个MVVM框架,是从knockout发展起来的分为两个版本 avalon.js版本,支持IE6及非常老的标准浏览器.这里的标准浏览器特指W3C阵营中的safari, opera, firefox, chrome avalon.modern.js版本,兼容IE10与标准浏览器如果想做移动端开发,有一个mobile.js,可以直接将它的源码拷贝到avalon.modern.js里最后一个花括号的前面二.获得源码项目地址:https://git…

迷你avalonjs框架

valon2是一款基于虚拟DOM与属性劫持的迷你. 易用. 高性能的前端MVVM框架, 拥有超优秀的兼容性, 支持移动开发, 后端渲染, WEB Component式组件开发, 无需编译, 开箱即用.avalonjs最大的优点在于它支持IE6浏览器,这无疑对于一些政府网站和兼容性比较高的公司有很大的帮助,也可以享受MVVM框架开发带来的乐趣.在早期受到angular与knockout的影响,API与他们很相近,但是经过几年的发展,它有了自己的一套模式,在现在的阿里腾讯等大公司仍然是有部门在…

前端神器avalonJS入门（三）

本章将介绍如何使用avalon来实现前端路由功能. 我们需要用到两个avalon路由配套模块—— mmHistory.js 和 mmRouter.js .其中mmHistory是用于历史管理,它会劫持页面上所有点击链接的行为,当这些链接是以 #/ .#!/ 开头,就尝试匹配路由规则,阻止页面刷新(通过hash方式或HTML5的replaceState方式).mmRouter是给我们定义路由规则,路由规则可以更精细地指定每个参数(param)的匹配规则,如果符合就执行对应的回调,如果不符合,就进入…

迷你MVVM框架 avalonjs 实现上的几个难点

经过两个星期的性能优化,avalon终于实现在一个页面绑定达到上万个的时候不卡顿的目标(angular的限制是2000).现在稍作休息,总结一下avalon遇到的一些难题. 首先是如何监控的问题.所有MVVM要将VM中的属性与视图中的绑定属性关联起来大抵有如下三种方式:angular是对函数体取toString进行预编译,将里面的赋值语句,取值语句替换为set,get方法,然后通过特定方法进行脏检测触发,或手动触发:ko是对VM的属性用监控函数外包一层,全事件驱动触发:avalon是通过Obje…

【avalonjs】的更多相关文章