think in avalon
1.不要设计,也不要通过DOM操作去改变你的页面
你用jQuery去设计一个页面,并让它动起来。这是因为jQuery就是让一切简单的事情变复杂的罪魁祸首。
但是用avalon,你必须从零开始去构思你的架构。"我有这么一些DOM,我想要它去做XXX",不,你不该这么想,你首先应该想到你要完成的是什么,
然后去设计你的整个应用,最后去设计你的view。
2.不要在avalon的代码里混杂着jQuery代码
不要首先想到用jQuery去解决问题。首先想到的应当是avalon的VM与$watch。
你刚开始学avalon的时候jQuery特别诱人,所以我才建议新的avalon开发者坚决不用jQuery,
至少等到你能够按MVVM的方式去处理问题时再说吧。
3.要一直想着架构
首先你要明白,SPA(single-page applications)也是applications。不是零散的网页。
因此我们不能仅仅从客户端开发者的角度去考虑,还需要把自己当成服务器端工程师。
我们要想这把我们的application分离成独立的,可扩展的,可供测试的组件。
为了达到这一点,你要把你重复利用的视图独立成一个模板,通过ms-include引入。
你要把你经常用到的方法,封装成VM的一个个方法或过滤器。
你要学会切割页面
,让它交由不同的ms-controller来处理。
你要学会使用mmRouter,路由器是你掌握SPA的证明。
你要学会用ms-widget封装UI组件,这是对你未来的投资!
think in avalon的更多相关文章
- MVVM大比拼之avalon.js源码精析
简介 avalon是国内 司徒正美 写的MVVM框架,相比同类框架它的特点是: 使用 observe 模式,性能高. 将原始对象用object.defineProperty重写,不需要用户像用knoc ...
- MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录
注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...
- 迷你MVVM框架avalon在兼容旧式IE做的努力
很多时候,写代码就像砌砖头,只要我们不关心盖楼的原因.建筑的原理.土木工程基础和工程经验,就算我们砌了100栋高楼,我们也就只是一个砌砖工人,永远也成为不了一个工程师,更别说建筑师了.而那些包工头也只 ...
- 前端展望:取avalon,弃angular
打给比方,如果说angularJS是剑,那么avalon就是匕首.匕首比剑更易学,更快,更适合快速作战... 我们还是直接来实际的吧: 目前项目开发中有以下几个通用需求: 有前端路由系统,用来划分 ...
- 轻量级前端MVVM框架avalon - 初步接触
迷你简单易用的MVVM框架 avalon的介绍http://rubylouvre.github.io/mvvm/ 按照作者的介绍,在HTML中添加绑定,在JS中用avalon.define定义View ...
- 轻量级前端MVVM框架avalon - 执行流程1
基本上确定了avalon的几个重要元素的关系: M,即model,一个普通的JS对象,可能是后台传过来的,也可能是直接从VM中拿到,即VM.$json.有关的这个$json的名字还在商讨 V,即Vie ...
- 轻量级前端MVVM框架avalon - 执行流程2
接上一章 执行流程1 在这一大堆扫描绑定方法中应该会哪些实现? 首先我们看avalon能帮你做什么? 数据填充,比如表单的一些初始值,切换卡的各个面板的内容({{xxx}},{{xxx|html}}, ...
- 轻量级前端MVVM框架avalon - 整体架构
官网提供架构图 单看这个图呢,还木有说明,感觉有点蛋疼,作者的抽象度太高了,还好在前面已经大概分析过了执行流程 如图 左边是View视图,我们就理解html结构,换句话就是说用户能看到的界面,渲染页面 ...
- 轻量级前端MVVM框架avalon - ViewModel
废话说了大几篇,我们开始来点干货了~ ViewModel的内部机制 在MVVM中,数据是核心.而jQuery则以DOM为核心. 而DOM只是HTML在JS的世界的抽象,是一个很易变的东西.因此如果业务 ...
- 轻量级前端MVVM框架avalon - 模型转换
接上一章 ViewModel modelFactory工厂是如何加工用户定义的VM? 附源码 洋洋洒洒100多行内部是魔幻般的实现 1: function modelFactory(scope) { ...
随机推荐
- 使用python处理selenium中的鼠标悬停问题
# 导入selenium中的actionchains的方法 from selenium.webdriver.common.action_chains import ActionChains #识别需要 ...
- springboot项目启动之后初始化自定义配置类
前言 今天在写项目的时候,需要再springboot项目启动之后,加载我自定义的配置类的一些方法,百度了之后特此记录下. 正文 方法有两种: 1. 创建自定义类实现 CommandLineRunner ...
- Windows7 下python3和python2同时 安装python3和python2
1.下载python3和python2 进入python官网,链接https://www.python.org/ 选择Downloads--->Windows,点击进入就可以看到寻找想要的pyt ...
- objectForKey与valueForKey在NSDictionary中的差异
从 NSDictionary 取值的时候有两个方法,objectForKey: 和 valueForKey:,这两个方法具体有什么不同呢? 先从 NSDictionary 文档中来看这两个方法的定义: ...
- 前端(六):JavaScript面向对象之宿主对象
宿主对象即浏览器提供的对象,主要包括DOM对象和BOM对象. 一.DOM源起 1.SGML.XML和XHTML SGML(标准通用标记语言)是定义使用标签来表示数据的标记语言的语法. - 标签由一个小 ...
- 重温CLR(十三) 定制特性
利用定制特性,可宣告式为自己的代码构造添加注解来实现特殊功能.定制特性允许为几乎每一个元数据表记录项定义和应用信息.这种可扩展的元数据信息能在运行时查询,从而动态改变代码的执行方式.使用各种.NET技 ...
- LeetCode Number of Atoms
原题链接在这里:https://leetcode.com/problems/number-of-atoms/description/ 题目: Given a chemical formula (giv ...
- 【DUBBO】Dubbo:monitor的配置
[一]:配置项 <dubbo:monitor protocol="registry"/> [二]:配置解析器-->具体解析器为com.alibaba.dubbo. ...
- iOS7 自己定义动画跳转
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/Liar0606/article/details/26399125 简单介绍 在iOS7系统中,假设你 ...
- Jacoco在eclipse上的集成使用
随着敏捷开发的流行,编写单元测试已经成为业界共识.但如何来衡量单元测试的质量呢?有些管理者片面追求单元测试的数量,导致底下的开发人员投机取巧,编写出大量的重复测试,数量上去了,质量却依然原地踏步.相比 ...