说说从输入 URL 到页面渲染完成发生了什么。
五个经典回答示范
我按链路讲：浏览器先做 DNS 解析拿到 IP，TCP 三次握手建立连接，HTTPS 再完成 TLS 握手；然后发送 HTTP 请求，服务器返回 HTML；浏览器解析 HTML 生成 DOM，解析 CSS 生成 CSSOM，合成渲染树后布局计算几何位置，再绘制像素、合成层叠加上屏。中间遇到 script 会阻塞解析，所以有了 defer 和 async。
我讲的时候会把优化点嵌进链路：DNS 侧的预解析与 httpdns、连接侧的 keep-alive 与 HTTP2 多路复用、请求侧的强缓存协商缓存、解析侧的关键 CSS 与脚本 defer、渲染侧的分层与合成动画。这样这道题就从背流程变成展示对每个环节的性能理解，我会用自己项目做首屏优化的例子收尾。
这是道知识网络题，我会主动控制深度分布：全貌 60 秒讲完，然后落到渲染管线的关键细节——样式计算、布局、 paint、compositing 的分工，什么操作触发重排、什么只触发重绘、transform 为什么走合成。再延伸到现代渲染的演进：流式解析、speculation rules、view transition。深度取舍本身就是加分项。
常见追问三个：『script 的 defer 和 async 区别』——执行时机不同，defer 在解析完后按序执行，async 下载完立即执行可能乱序；『为什么操作 DOM 慢』——跨引擎通信且可能引发重排；『白屏和 FCP 之间发生了什么』——解析到首个有样式的可见元素完成首次绘制。
『输入网址后浏览器会发送请求给服务器，服务器把页面返回来，浏览器显示出来，中间过程是浏览器内部实现的，我大概了解就行，反正用 axios 请求。』——点评：这是前端面试的必考送分题，答不出说明基础不扎实；『了解就行』的态度在面试官听来等于知识边界很浅。
- 打开 模拟练习，选择「前端开发」方向，限时 3 分钟作答本题。
- 对照上方答题框架，逐点检查：哪些要素没覆盖、哪里表达啰嗦。
- 用自己项目的真实经历替换框架中的占位内容，重讲一遍并录音回听。
这类题在真实面试中常被追问细节，
建议进入限时模式练一遍。