SPA设计与架构随笔1

SPA是一种web开发方法，整个应用功能都存在于单个页面当中。优势包括类桌面应用程序的呈现效果，解耦的表现层，更快速更轻量的负荷，更少的用户等待时间以及更好的代码维护性等

单页面应用程序的“单页面”指的是初始化的html页面亦被称为外壳页面。这个页面仅被加载一次，充当应用程序其余部分的起点。而典型的外壳页面在结构上保持最小化，并通常包含一个空的div标签，这个标签的作用就相当于母容器或者停泊的甲板。

spa应用程序中‘页面’其实并不是页面，至少不是传统概念上的页面。当用户进行导航操作的时候，屏幕呈现看似是页面实际上是应用程序内容的独立部分，一般称为‘视图’。导航切换实际上是不同的视图之间的切换。导航时无需重新加载页面是单页面应用程序的关键特性之一。

构建可维护，可扩展的spa应用需要简洁并且组织良好的js代码，并对代码进行分层使得js和html尽量松耦合。现在一般比较常见的创建分离层次关系的MV*模式主要有：

模型-视图-控制器（Model-View-Controller,MVC）

模型-视图-表示器（Model-View-Presenter,MVP）

模型-视图-视图模式（Model-View-ViewModel,MVVM）

这些模式实现的基本思想是在开发者个人的逻辑之外，以框架或者库来管理js与html之间的关系。MV*框架允许开发者设计UI以让业务数据（模型）与生成的视图之间互相通信，但却分开管理。MV*中的最后一个组件是机制的协调者。为了让js代码在页面中和谐共处，spa应用中我们将应用功能放到模块中一次达成目标。模块能限制代码的作用域，在每个模块定义的变量和函数都有其所属的局部作用域，避开了全局作用域相关的各种陷阱同时这也有助于代码的解耦和维护。