当你在浏览器地址栏输入网址，敲下回车后，浏览器和服务器发生了那些事情？传统模板引擎制作的网页和单页应用有什么区别？

静态资源访问

第一步，发送请求，拿到html文件并渲染页面

问静态资源（html）地址，这个链接是约定好的（完整路径为www.sjm.com/），服务器收到请求后获取到url为“/”，知道客户端是要访问网站首页，于是读取index.html文件，发送给客户端，http响应头Content-Type字段设为text/html。
  客户端（浏览器）收到响应信息后，读取到Content-Type字段为text/html，知道这是一个html字符串，然后把它当做html代码运行，渲染页面。

第二步，发送后续请求，获取更多静态资源

页面渲染过程中（自行百度页面渲染流程），script、img、link等标签会再次向服务器发送请求。script标签发起的请求得到响应结果后，会将响应的数据转换为字符串并当做js代码运行，img、link等标签也会将响应的数据做对应的处理。

第三步，js发起的请求

js代码运行后，若有ajax请求的发送则会有这一步。

模板引擎和单页应用的区别

浏览器在线访问网页的过程大致就是上文描述的样子，但传统的模板引擎和单页应用又有些许差别，体现在网页组装的位置（或者说时机）不一样

模板引擎

  常见的模板引擎有jsp、php、ejs等，可以将服务器端代码嵌入html代码，对于开发简单页面来说非常高效。
  模板引擎将整个页面组装好后，发送给浏览器，浏览器渲染页面。整个过程比较复杂，简化后的大致流程如上图。

单页应用

  单页应用顾名思义就是只有一个index.html页面的应用，页面上的所有内容包括视觉上的页面切换全都是通过js控制页面渲染得到的
  由于单页应用的内容来自js渲染，所以一开始得到的html页面是没有实质内容的，如下图

后续页面上的内容显示、变化全由js控制，所以单页应用组装页面是在浏览器端进行的。

总结一下

• 模板引擎开发页面，html页面由后端组装好了发送给前端，前端渲染即可
• 单页应用开发，后端将数据发送给前端，前端用js组装渲染页面