一、过程
1、浏览器解析HTML，生成DOM Tree
2、浏览器解析CSS，生产CSSOM Tree
3、JavaScript会通过DOM API 和CSSOM API 来操作DOM Tree和CSS Rule Tree，浏览器将DOM Tree和CSSOM Tree合成渲染树（Render Tree）
4、布局(layout)：根据Render Tree进行回流，计算每个节点的几何信息
5、绘制：根据渲染树和回流得到的几何信息，得到每个节点的绝对像素
6、展示：将像素发送给GPU在页面展示
二、主流技术架构
1、服务端渲染：后端同步渲染（JSP、Node.js等，能够快速实现业务开发并上线，优势：快。协助利器：jSmart、Velocity.js。）、同构直出、BigPipe
2、客户端渲染：
JavaScript渲染：
静态化（使动态化的网址生成静态HTML页面以供用户更好访问的技术，一般分为纯静态化和伪静态化。优势：提高访问速度、降低服务器负担。缺点：服务器存储占用问题、静态页面中的链接更新会出问题。技术实现：定时任务、模板技术）、
前后端分离（待续...）
单页面应用
WebAPP：Angular、React、Vue等，PWA
原生APP：ios、Android
Hybrid App:PhoneGap、AppCan
跨平台开发：RN、flutter、小程序等
原文：https://www.cnblogs.com/cvv54/p/13282110.html