前后端分离阶段

前端渲染的理解：

每次请求涉及到的静态资源都会从静态资源服务器获取，这些资源包括HTML+CSS+JS，然后在前端对这些请求回来的资源进行渲染；

需要注意的是，客户端的每一次请求，都会从静态资源服务器请求文件；

同时可以看到，和之前的后端路由不同，这时后端只是负责提供API了；

前后端分离阶段：

随着Ajax的出现, 有了前后端分离的开发模式；

后端只提供API来返回数据，前端通过Ajax获取数据，并且可以通过JavaScript将数据渲染到页面中；

这样做最大的优点就是前后端责任的清晰，后端专注于数据上，前端专注于交互和可视化上；

并且当移动端(iOS/Android)出现后，后端不需要进行任何处理，依然使用之前的一套API即可；

目前比较少的网站采用这种模式开发；

单页面富应用阶段:

其实SPA最主要的特点就是在前后端分离的基础上加了一层前端路由.

也就是前端来维护一套路由规则.

前端路由的核心是什么呢？改变URL，但是页面不进行整体的刷新

URL的hash

前端路由是如何做到URL和内容进行映射呢？监听URL的改变。

URL的hash

URL的hash也就是锚点(#), 本质上是改变window.location的href属性；

我们可以通过直接赋值location.hash来改变href, 但是页面不发生刷新；

hash的优势就是兼容性更好，在老版IE中都可以运行，但是缺陷是有一个#，显得不像一个真实的路径。

开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 13 天，点击查看活动详情