javascript 前段MVVM 框架

JavaScript富应用MVC MVVM框架

对框架的挑选 Ember.js.Backbone.js.Knockout.js.Spine.js.Batman.js , Angular.js 1. 轻量级的应用选择哪一个会比较好?2. 那一个比较简单,容易上手3. 哪一个开发周期最短? 具体可以看 (英) Rich JavaScript Applications – the Seven Frameworks Web前端开发:为何选择MVVM而非MVC 由于工作关系~一直没时间细细研究下这些框架的源码~ 早期就看过Backbone.js与E…

不要听吹牛逼什么前端MVVM框架就是好，其实都是一帮没学好分层设计的搞出来的，让你彻底看清前端MVVM的本质

最近前端圈子里面,发现大家都在热炒概念,什么knockout,angularJs,都被捧成神了,鄙人不才,最近心情也不好,特地写这篇文章来找骂写代码的码农都知道,Java社区虽然不是一个提出分层思想的,确实贯彻的最好的,如今是个Java开发都不会不知道SSH的开发模式,从MVC到MVVM的概念的热炒,其实真没什么技术进步 (如果你觉得本文言辞激烈,过于愤世嫉俗,实在看不下去,欢迎移步另一位园友的分层进化史科普文章http://www.cnblogs.com/indream/p/3602348.…

迷你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…

前端MVVM框架设计及实现（一）

最近抽出点时间想弄个dom模块化的模板引擎,不过现在这种都是MVVM自带的,索性就想自己造轮子写一个简单的MVVM框架了借鉴的自然还是从正美的avalon开始了,我记得还是去年6月写过一个系列的avalon源码分析的,不过那时候0.7版本,不够健全,现在已经好太多了框架是面向一个领域,提供一套解决方案,那么我们用前端的MVVM能为我们带来什么便利? 关注点分离操作数据即操作DOM 动态模板关注点分离是MVVM与身俱来的,操作数据即操作DOM,是VM中的访问器带来的,动态模板是流程绑定…

迷你MVVM框架 avalonjs1.5 入门教程

avalon经过几年以后,已成为国内一个举足轻重的框架.它提供了多种不同的版本,满足不同人群的需要.比如avalon.js支持IE6等老旧浏览器,让许多靠政府项目或对兼容性要求够高的公司也能享受MVVM的乐趣.avalon.modern.js支持IE10以上版本,优先使用新API,性能更优,体积更少.avalon.mobile.js在avalon.modern的基础提供了触屏事件的支持,满足大家在移动开发的需求.此外,它们分别存在avalon.xxx.shim版本,指无自带加载器版,avalon…

JavaScript客户端MVC 框架综述

简介 15 年前,许多人都使用 Perl 和 ColdFusion 之类的工具构建网站.我们经常编写可以在页面顶部查询数据库的脚本,对数据应用必要的转换,以及在同一个脚本底部显示数据.这类架构适合于向网站添加简单的 "Contact us" 表单.然而,随着应用程序变得更加复杂,这种方法无法进行相应的扩展来处理更大的复杂问题.大部分 Web 应用程序现在已经对模型-视图-控制器 (MVC) 架构进行了标准化,使用单独的代码实现业务逻辑.显示逻辑和用户交互(路由)逻辑.涌现出从 Spri…

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

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

【JavaScript】对比12 款优秀的JavaScript MVC/MVVC框架你最喜欢Backbone or Ember

http://codebrief.com/2012/01/the-top-10-javascript-mvc-frameworks-reviewed/ 目前基本所以后台程序都是面向对象MVC模式开发,作为Web前端开发的人来说,也是很需要的,那么目前有没有可以借鉴的呢?作者(Gordon L.Hempton)一直在寻求哪种MVC框架最为完美,他将目前能获取到的所有框架都粗略地试了试,然后在文章中列出了每一种框架的情况概要,在文末分享了作者经过对比之后最终的推荐产品. 首先要特别说明一下,作者认为…

CSS+Javascript的那些框架

CSS CSS 制作框架 SASS http://www.oschina.net/p/sass Blueprint http://www.oschina.net/p/blueprintcss Elastic CSS布局 http://www.oschina.net/p/elastic CSS 预处理器 Stylus CSS预处理器 http://www.oschina.net/p/stylus LESS CSS预处理 http://www.oschina.net/p/lesscss Web…

迷你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…

前端MVVM框架：Knockout.JS（一）

前言在我们平时开发 Web 应用程序的时候,如果项目不算特别大的话,一般都是拿 jQuery 再配合一些前端 UI 框架就在项目上面应用了.如果页面逻辑稍微复杂的话,那个在写前端 JavaScript 代码时,势必会充斥前大量 jQuery 的选择器的应用.我并不想说它好或不好.只想问一下,有没有更方便的方法呢?有过 WPF 开发经验的同学一定会知道 MVVM(Model View ViewModel) 这种开发模式.它可以很轻松的将 View 与对应的后端代码隔离开来.使项目易于维护.那么…

js架构设计模式——前端MVVM框架设计及实现（一）

前端MVVM框架设计及实现(一) 最近抽出点时间想弄个dom模块化的模板引擎,不过现在这种都是MVVM自带的,索性就想自己造轮子写一个简单的MVVM框架了借鉴的自然还是从正美的avalon开始了,我记得还是去年6月写过一个系列的avalon源码分析的,不过那时候0.7版本,不够健全,现在已经好太多了框架是面向一个领域,提供一套解决方案,那么我们用前端的MVVM能为我们带来什么便利? 关注点分离操作数据即操作DOM 动态模板关注点分离是MVVM与身俱来的,操作数据即操作DOM,是VM中的访…

【学习笔记】剖析MVVM框架，简单实现Vue数据双向绑定

前言: 学习前端也有半年多了,个人的学习欲望还比较强烈,很喜欢那种新知识在自己的演练下一点点实现的过程.最近一直在学vue框架,像网上大佬说的,入门容易深究难.不管是跟着开发文档学还是视频教程,按步骤操作总是最肤浅,想要把这门功课做好毕竟得下足功夫.因此,特意花了好几天时间阅读相关技术博客和源码,简单实现了一个数据双向绑定的vue框架,希望能让各位有点启发... 1.什么是MVVM MVVM即modle-view-viewmole,MVVM最早由微软提出来,在前端页面中,把Model用纯Java…

迷你MVVM框架 avalonjs 学习教程18、一步步做一个todoMVC

大凡出名的MVC,MVVM框架都有todo例子,我们也搞一下看看avalon是否这么便宜. 我们先从react的todo例子中扒一下HTML与CSS用用. <!doctype html> <html lang="en" data-framework="react"> <head> <meta charset="utf-8"> <title>React • TodoMVC</titl…

迷你MVVM框架 avalonjs 1.3.6发布

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

迷你MVVM框架 avalonjs 0.9发布

本版本最大的改进是引进了ms-with绑定,现在可轻松遍历对象了. 改进列表如下: 重新使用082的scanNodes方法,因为有关旧式IE下UI渲染锁死的问题已经解决了. 优化each绑定与Collection 添加CSS3 animationend事件支持添加ms-with绑定 fix IE9-10获取option元素的value的BUG 改良 AMD加载器与jQuery这些在内部使用了全局define方法的库的兼容问题抽象setNumber方法来处理splice,slice这两个数组方…

迷你MVVM框架 avalonjs 沉思录第2节 DOM操作的三大问题

jQuery之所以击败Prototype.js,是因为它自一开始就了解这三大问题,并提出完善的解决方案. 第一个问题,DOM什么时候可用.JS不像C那样有一个main函数,里面的逻辑不分主次.但JS是这样玩,并不意味着DOM也是这样.被JS自由惯了的人,于是傻眼了. 这涉及一个时间的概念.牛顿与爱因斯坦的差别,也是在于这个时间的引入.我们的脚本并不是一下子就引入,页面也不是一下加载完毕.前者引发脚本加载管理问题,后者就是DOMReady这个概念的导入.页面是从上到下生成,除了样式或图片在浏览器的…

如何实现一个简单的MVVM框架

接触过web开发的同学想必都接触过MVVM,业界著名的MVVM框架就有AngelaJS.今天闲来无事,决定自己实现一个简单的MVVM框架玩一玩.所谓简单,就是仅仅实现一个骨架,仅表其意,不摹其形. 分析 MVVM最大的特点莫过于双向绑定了,数据的变化能及时更新到视图上,同时视图的变化也能及时的更新到数据中. 那么怎么实现这样的双向绑定呢?最直接的方式莫过于事件了. 所以,我们需要实现一个事件的订阅与分发机制,这个功能很常见,网上搜一搜一大堆. 有了这么一套事件的订阅与分发机制,我们就可以通过它将…

Vue.js-----轻量高效的MVVM框架（一、初识Vue.js）

1.什么是Vue.js? 众所周知,最近几年前端发展非常的迅猛,除各种框架如:backbone.angular.reactjs外,还有模块化开发思想的实现库:sea.js .require.js .webpack以及前端上线部署集成工具如: grunt.gulp.fis等. Vue.js与reactjs相似,是一个构建数据驱动的 web 界面的库,一个注重ViewModel的典型的MVVM框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. Vue.js 自…

Vue中的MVVM框架

ViewModel:数据双向绑定场景: 针对具有复杂交互逻辑的前段应用提供基础的架构抽象通过Ajax数据持久化,保证前端用户体验什么是vue.js? 是一个轻量级的mvvm框架数据驱动+组件化的前端开发 Github超过25k+的star数,社区完善 Vue对比Angular,react vue更清凉,gzip有20k+ vuejs更上手,学习曲线平稳借鉴了angular的指令和react的组件化 Vue核心思想数据驱动数据响应原理: 组件化组件设计原则:…

鸿蒙真的是套壳吗？HarmonyOS应用开发初体验，Java原生和JavaScript的mvvm开发

初探寻鸿蒙os的应用开发本期视频已发布到bilibili 注意是应用开发,没错码农(应用开发)一般关注这个就行了 IDE 点击应用开发以后,点击链接下载IDE,DevEco Studio是基于IDEA开源版魔改的,别再说什么抄袭Androidstudio了,使用这个工具没毛病,快速适应,gradle(gradle是打包构建工具,和Maven这种类似)的下载终于快了一次了安装过程没什么好说的,就是如果你C盘不够了,安装SDK的时候可以先不确定,进入IDE以后修改安装位置再安装 SDK Tool…

MVVM框架从WPF移植到UWP遇到的问题和解决方法

MVVM框架从WPF移植到UWP遇到的问题和解决方法 0x00 起因这几天开始学习UWP了,之前有WPF经验,所以总体感觉还可以,看了一些基础概念和主题,写了几个测试程序,突然想起来了前一段时间在WPF下写的简易的MVVM框架(MVVM模式和在WPF中的实现),都是.NET平台的,移到通用类库里只要复制粘贴就可以了吧.抱着这个心态试了下,结果代码一片红,折腾了一下午总算搞得差不多了,第二天写了个测试试了下感觉基本问题应该是解决了.现在总结一下自己踩到的坑. 0x01 命令绑定之前在WPF中实…

“老坛泡新菜”:SOD MVVM框架，让WinForms焕发新春

火热的MVVM框架最近几年最热门的技术之一就是前端技术了,各种前端框架,前端标准和前端设计风格层出不穷,而在众多前端框架中具有MVC,MVVM功能的框架成为耀眼新星,比如GitHub关注度很高的Vue.js ,由于是国人作品,其设计风格和文档友好度对国人而言更胜一筹,因此我也将它推荐到公司采用,其中我推荐都理由就是它非常优秀的MVVM功能,面向数据而不是面向DOM细节相比jQuery等更加节省代码,更符合后端程序员的胃口,也更有利于UI设计人员跟程序员都分工配合. 下面是Vue.js实现MVV…

前端MVVM框架设计及实现

最近抽出点时间想弄个dom模块化的模板引擎,不过现在这种都是MVVM自带的,索性就想自己造轮子写一个简单的MVVM框架了借鉴的自然还是从正美的Avalon开始了,我2013年写过一个关于MVC MVVM源码分析系列,其实MVVM并不难为了便于大家更深刻理解前二版会先简单的模仿avalon的实现最基本的原理从第三版开始就会加入AMD,ko,vue等框架的设计元素,形成自己的一套风格框架是面向一个领域,提供一套解决方案,那么我们用前端的MVVM能为我们带来什么便利? 关注点分离操作数据即操…

前端MVVM框架设计及实现（二）

在前端MVVM框架设计及实现(一)中有一个博友提出一个看法: “html中使用mvvm徒增开发成本” 我想这位朋友要表达的意思应该是HTML定义了大量的语法标记,HTML中放入了太多的逻辑,从而增加了复杂度将逻辑放入HTML是一个不好的做法,也不建议这么做,即便从复用的角度来讲,因为HTML与代码紧密耦合,要想重新组成一个应用程序非常困难当然,在构建一个应用程序时,你也可以不使用框架,但不可否认,使用框架将使得你的开发工作变得更容易框架都不是万能的,但是在某一种特定的项目中,用最方便快捷的…

轻量级前端MVVM框架avalon - 初步接触

迷你简单易用的MVVM框架 avalon的介绍http://rubylouvre.github.io/mvvm/ 按照作者的介绍,在HTML中添加绑定,在JS中用avalon.define定义ViewModel,再调用avalon.scan方法,它就能动了! 神奇的代码: 如上图所示: 开发者: 1 定义一个带有自定义标签的HTML结构 2 定义一个简单的JS代码用户操作: 用户在input文本框中改变值时,你就会发现对应的多条相关联的记录都被同步修改问题: 事件是什么时候绑定的,因为开发者…

轻量级前端MVVM框架avalon - 执行流程2

接上一章执行流程1 在这一大堆扫描绑定方法中应该会哪些实现? 首先我们看avalon能帮你做什么? 数据填充,比如表单的一些初始值,切换卡的各个面板的内容({{xxx}},{{xxx|html}}, ms-html) 类名处理,如隔行变色,掠过变色(ms-class, ms-hover) 事件绑定(ms-click) 属性处理(ms-checked, ms-href, ms-disabled) 数据格式化与验证(过滤器与$watch) 将某个元素转为一些功能更强大的UI,如果拖动块,滑动块,弹…

Atitit.js javascript的rpc框架选型

Atitit.js javascript的rpc框架选型 1. Dwr1 2. 使用AJAXRPC1 2.2. 数据类型映射表1 3. json-rpc轻量级远程调用协议介绍及使用2 3.1. 2.3.JavaScript客户端调用示例2 3.2. 2.4.直接GET请求进行调用2 4. atiri3 1. Dwr Dwr要自己一个method挑选了,麻烦的.. 2. 使用AJAXRPC 在调用RPC方法时,如果没有传递回调函数,则是同步调用:如果传递回调函数,则是异步调用. 2.1.1.1. …

使用MVVM框架时，如何处理在页面动态渲染完之后需要发生的事件呢？

在项目实践过程中,当我们使用如avalon这样的MVVM框架时,通常会发现一直会有个问题. 过往的经验告诉我们,想在页面加载完之后处理些事件我们可以绑定document的ready方法或者使用jquery的$(function{})去处理. 但是,如果在页面中数据有些时动态渲染的呢,这些数据不一定时在页面加载完之后就存在,而是页面加载完之后,由于业务需求,我们可能还需要去ajax后台重新渲染某些页面, 这个时候我们可以将页面需要动态渲染的元素绑定一个事件,如下: $("变化的元素选择器"…

【javascript 前段MVVM 框架】的更多相关文章