浏览器渲染机制与全链路内存分析

补全 V8 ↔ 渲染 ↔ 内存 的知识缺口 面向：初级 H5 游戏程序员 | 前置：2_1_v8Learn + 2_2_h5-rendering-mastery 预计学习时间：2-3 周

项目简介

你已经学了 V8 引擎和 H5 渲染，但这两个项目之间有一条裂缝。本项目就是填这条裂缝的——学完后能画出从 JS 代码到屏幕像素的完整链路，并能定位任意一个内存增长点。

目录结构

2_3_browser-rendering-memory/
├── 00-学习路线图.md
├── 01-浏览器渲染管线详解.md
├── 02-合成层与GPU加速.md
├── 03-重排与重绘优化.md
├── 04-事件循环与渲染时序.md
├── 05-浏览器全链路内存全景图.md     ⭐ 核心
├── 06-JS堆与GPU显存桥梁.md         ⭐ 核心
├── 07-内存泄漏排查SOP.md           ⭐ 核心
├── 08-Node.js服务端内存.md
├── 09-H5游戏内存优化实战.md
├── 10-性能预算与监控体系.md
└── web/                            # HTML版本（浏览器阅读）

阅读方式

• 在线阅读：打开 web/index.html，使用浏览器阅读，支持导航和代码高亮
• Markdown阅读：直接阅读 .md 文件

重新构建HTML

cd 2_AllLearn
node build-all.js

核心章节

章节	核心内容
05-浏览器全链路内存全景图	JS堆↔GPU显存↔DOM的完整链路，Chrome Task Manager实操
06-JS堆与GPU显存桥梁	texImage2D上传链路、纹理生命周期、Cocos Creator资源释放、WebGLContext丢失处理
07-内存泄漏排查SOP	三快照对比法、Allocation Timeline、6大泄漏模式