JavaScript 模块化

  • 模块：封装实现、暴露接口、声明依赖
  • 模块系统：依赖管理（加载、分析、注入、初始化）、决定模块写法
  • Commonjs、AMD、CMD、ES6 module 等

框架

  • 库：针对特定问题的解答、不控制应用程序、被动的被调用

  • 框架：控制反转、决定应用程序生命周期、一般会集成大量的库

    库与框架
    图 1 库与框架

  • 解决方案
    • DOM：Selector、Manipulation、Event、Animation
    • 通信：XmlHttpRequest、Form、JSONP、Socket
    • 工具：函数增强 & shim、Flow Control
    • 模版：String-based、Dom-based、Living Template
    • 组件：Modal、Slider、DatePicker、Tabs、Editor
    • 路由：Client Side、Server Side
    • 架构：MVC、MVVM、MV*

单页面应用

  • 单页面应用（single-page application，简称 SPA)，是指在浏览器中运行的应用，它们在使用期间不会重新加载页面
  • 它将所有的活动局限于一个 Web 页面中，仅在该 Web 页面初始化时加载相应的 HTML、CSS 和 JavaScript
  • 一旦页面加载完成，SPA 不会因为用户的操作而重新加载页面或跳转
  • 它利用 JavaScript 动态地变换 HTML 的内容，从而实现 Ul 与用户的交互
  • 由于避免了页面的重新加载，SPA 可以提供较为流畅的用户体验

前端架构

前端MVC框架
图 2 前端MVC框架

前端MVP框架
图 3 前端MVP框架

前端MVVM框架
图 4 前端MVVM框架