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的更多相关文章

  1. MVVM大比拼之avalon.js源码精析

    简介 avalon是国内 司徒正美 写的MVVM框架,相比同类框架它的特点是: 使用 observe 模式,性能高. 将原始对象用object.defineProperty重写,不需要用户像用knoc ...

  2. 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 的目的是 ...

  3. 迷你MVVM框架avalon在兼容旧式IE做的努力

    很多时候,写代码就像砌砖头,只要我们不关心盖楼的原因.建筑的原理.土木工程基础和工程经验,就算我们砌了100栋高楼,我们也就只是一个砌砖工人,永远也成为不了一个工程师,更别说建筑师了.而那些包工头也只 ...

  4. 前端展望：取avalon，弃angular

    打给比方,如果说angularJS是剑,那么avalon就是匕首.匕首比剑更易学,更快,更适合快速作战... 我们还是直接来实际的吧:   目前项目开发中有以下几个通用需求: 有前端路由系统,用来划分 ...

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

    迷你简单易用的MVVM框架 avalon的介绍http://rubylouvre.github.io/mvvm/ 按照作者的介绍,在HTML中添加绑定,在JS中用avalon.define定义View ...

  6. 轻量级前端MVVM框架avalon - 执行流程1

    基本上确定了avalon的几个重要元素的关系: M,即model,一个普通的JS对象,可能是后台传过来的,也可能是直接从VM中拿到,即VM.$json.有关的这个$json的名字还在商讨 V,即Vie ...

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

    接上一章 执行流程1 在这一大堆扫描绑定方法中应该会哪些实现? 首先我们看avalon能帮你做什么? 数据填充,比如表单的一些初始值,切换卡的各个面板的内容({{xxx}},{{xxx|html}}, ...

  8. 轻量级前端MVVM框架avalon - 整体架构

    官网提供架构图 单看这个图呢,还木有说明,感觉有点蛋疼,作者的抽象度太高了,还好在前面已经大概分析过了执行流程 如图 左边是View视图,我们就理解html结构,换句话就是说用户能看到的界面,渲染页面 ...

  9. 轻量级前端MVVM框架avalon - ViewModel

    废话说了大几篇,我们开始来点干货了~ ViewModel的内部机制 在MVVM中,数据是核心.而jQuery则以DOM为核心. 而DOM只是HTML在JS的世界的抽象,是一个很易变的东西.因此如果业务 ...

  10. 轻量级前端MVVM框架avalon - 模型转换

    接上一章 ViewModel modelFactory工厂是如何加工用户定义的VM? 附源码 洋洋洒洒100多行内部是魔幻般的实现 1: function modelFactory(scope) { ...

随机推荐

  1. WebStorm的下载与安装

    百度搜索: 链接:http://www.jetbrains.com/webstorm/ 链接:http://www.jetbrains.com/student/ 学生免费授权计划 请从正规来源下载软件 ...

  2. 用idea将javaweb项目部署到tomcat

    之前在网上找的一些web项目都是用eclipse开发的,想把这些项目导入到idea中,然后部署到tomcat中,在网上找了很多教程,很多都不靠谱,发现网上很多配置都是多余的,其实很多只需要按idea默 ...

  3. Flask第五篇——设置debug模式

    flask默认是没有开启debug模式的,开启debug模式有很多好处: 第一,可以帮助我们查找代码里面的错误,比如: # coding: utf-8 from flask import Flask ...

  4. 洛谷P1309 瑞士轮

    传送门 题目大意: 2*n个人,有初始的比赛分数和实力值. 每次比赛前总分从大到小排序,总分相同编号小的排在前面. 每次比赛是1和2比,3和4比,5和6比. 实力值大的获胜得1分. 每次比赛前排序确定 ...

  5. py2exe转换参数

    在公司用python写了个统计数据并通过xlsxwriter模块生成excel的小工具, 完成后使用py2exe转换成exe文件过程中遇到了些问题, 记录下. from distutils.core ...

  6. dockerize 容器工具集基本使用

    基本功能:   *  在启动的时候根据环境变量或者模版生成配置文锦啊 *   多日志文件重定向到标准输入输出 *   等待其他服务(tcp,http unix)起来之后在启动主进程   1. 安装 直 ...

  7. grpc 安装以及墙的解决方法

    1. 默认官方文档 go get -u google.golang.org/grpc 因墙的问题,大部分安装是无法完成的 2. 解决方法 a. grpc mkdir -p $GOAPTH/src/go ...

  8. golang的interface到其他类型的数据转换

    以string为例 package main import "fmt" func main() { var a interface{} var b string a = " ...

  9. 关于vim搜索/替换功能的两条配置

    之前是直接照着这篇的配置的强大的vim配置文件 自己也只是对vim新建文件修改文件的哪个函数SetTitle()做了点修改,毕竟用vim只写C/C++和python.shell. 没想到今天在用vim ...

  10. JVM内存管理之GC简介

    为何要了解GC策略与原理?        原因在上一章其实已经有所触及,就是因为在平时的工作和研究当中,不可避免的会遇到内存溢出与内存泄露的问题.如果对GC策略与原理不了解的情况下碰到了前面所说的问题 ...