当用户输入URL或者点击链接时，浏览器向服务器发起HTTP（或HTTPS）请求以获取HTML文档数据。
服务器将HTML内容返回给浏览器，浏览器开始接收数据流。
浏览器接收到HTML内容后，开始解析这些文本并将其转换成DOM（Document Object Model）树结构。在这个过程中，浏览器会从上到下逐行读取HTML代码，并创建相应的DOM节点。
（1）在解析HTML的同时，浏览器遇到< script>、<link>（样式表）、<img>、<video>、<audio>等标签时，会根据需要异步下载CSS、JavaScript和其他媒体文件。
（2）如果遇到没有async或defer属性的<script>标签，浏览器会暂停DOM构建来执行脚本，等待脚本执行完成后再继续构建DOM。
当初始HTML文档被完全加载和解析，DOM树构建完成后，浏览器会触发DOMContentLoaded事件。这意味着DOM已经准备好，但不保证所有外部资源如图片、样式表等已加载完毕。
浏览器接着进行样式计算（包括CSSOM树构建），确定每个DOM元素的具体样式，并基于计算出的样式进行布局操作（也称为回流或重排layout/reflow）。
最后，浏览器将布局后的各个部分按照正确顺序绘制到屏幕上，这一过程可能涉及多个步骤，包括合成层处理、绘制以及GPU加速渲染等。
页面加载完毕后，浏览器进入事件循环阶段，监听用户的交互以及其他异步事件，例如网络请求完成、定时器到期等，并根据事件做出相应更新。
所有资源（包括样式表、图片、字体等）全部加载完成后，浏览器会触发window对象上的load事件，标志着整个页面的加载过程结束。
当用户离开当前页面时，浏览器会停止渲染当前页面，并开始卸载相关的资源和执行必要的清理工作，如垃圾回收机制回收不再使用的内存对象。
注意：在整个html生命周期中，浏览器会持续监控网络状态、内存使用情况以及用户交互，以便及时响应和更新页面内容。
浏览器接收到HTML文档后，开始解析HTML标记并构建DOM（Document Object Model）树。
当初始HTML文档被完全加载和解析，DOM树构建完成时，浏览器会触发DOMContentLoaded事件。这个事件标志着DOM结构已经准备就绪，但不包括样式表、图像和其他外部资源。
在DOMContentLoaded事件之后，浏览器继续加载页面中的其他外部资源，如样式表、图片、字体等。
当整个页面的所有内容（包括图像、样式表等所有外部资源）都已加载完毕，浏览器会触发window的load事件。这是页面完全加载的标志。
在DOMContentLoaded和load事件之后，JavaScript代码可以注册事件处理程序来响应用户的交互，如点击按钮、滚动页面等。
当用户离开当前页面（通过点击链接、输入新URL或者关闭窗口等方式）时，浏览器会触发beforeunload和unload事件，允许JavaScript执行清理工作，如取消网络请求、保存状态等。
注意：在整个生命周期中，JavaScript代码可以在不同的阶段执行相应的任务，如初始化页面元素、注册事件监听器、处理用户交互、以及在页面卸载前进行必要的清理工作。
https://blog.csdn.net/Yuanyuan__/article/details/128428923