Fork me on GitHub

浅谈Javascript架构

1. 交互模式

以往的交互模式,用户一旦点击链接、或者提交表单,都将重定向到服务器,待服务器处理完返回 完整html代码,而且此时浏览器需要重新载入相关JS、CSS、Image,对服务器和浏览器资源消耗都比较大
framework

而ajax技术流行之后,B/S交互模式产生变化,最主要是产生了中间层
framework

增加ajax中间层之后,交互产生了变化

  1. 异步请求,改善用户体验
  2. 减少http请求量和数据量(HTML、CSS、Image、JS都无需重新载入)

2.架构模式

得益于ajax异步请求技术,大部分复杂的页面,都可以使用模块化架构
当然没有数据交换的页面也可以模块化,但是在如今网络数据请求频繁的操作面前,ajax异步请求显得尤为重要

a) 类库(Base Lib)

类库是最基本的的类,通常只有应用知道加载了哪些类库
类库的任务

  1. 解决浏览器兼容性
  2. DOM等对象操作
  3. XML、JSON数据操作
  4. AJAX对象
  5. 扩展性

b) 模块(Modules)

一切皆为模块,模块本身并不知道外面环境,模块必须运行在沙箱,模块间要解耦
模块设计原则

  1. 不创建全局变量
  2. 不访问非内置全局变量
  3. 不访问无关DOM节点
  4. 只能调用自己,或者沙箱里的方法
  5. 不直接引用其它模块,需要时先向沙箱申请

c) 沙箱(Sandbox)

沙箱是模块运行的安全环境
沙箱的责任

  1. 安全性,当模块调用方法时,确保接口有该方法访问权利
  2. 交互性,及时把模块请求发给系统

d) 应用(App Core)

应用的任务

  1. 管理模块生命周期,创建、销毁模块
  2. 处理模块间交互,尽可能解耦
  3. 异常处理,检测、报告错误
  4. 扩展性

相关文章推荐

如果觉得我的文章对您有用,可否请我喝杯速溶咖啡