【项目实战】DOM渲染的演化过程（纯后端渲染 -＞ 纯前端渲染 -＞ 服务端JS渲染结合前端渲染）

一、DOM渲染概述

DOM渲染是指浏览器生成展现给用户的DOM文档的过程。
在Chrome浏览器中，通过开发者工具的元素标签可以查看渲染后的DOM。

二、DOM渲染的演化过程

2.1 纯后端渲染

• 定义: 页面的DOM结构主要由服务器返回，与服务器返回的DOM基本一致。
• 优点: 页面主体结构快速返回，对SEO友好。
• 缺点: 开发复杂，难以实现复杂交互，每次路由变化都需刷新页面。

2.2 纯前端渲染

• 定义: DOM生成逻辑主要在前端，后端仅返回基础DOM结构。
• 前端框架，比如Vue.js，React.js，angularjs等等，主要都是以这种方式完成了对于DOM的渲染。
• 优点: 交互能力强，表现层与数据层解耦。
• 缺点: 第一屏渲染依