浏览器面试题
按难度分为基础、进阶、高级。每道题附参考答案与评分要点。
一、基础题
1. 浏览器有哪些主要进程？各自负责什么？基础
2. 从输入 URL 到页面显示，浏览器经历了哪些步骤？基础
3. 什么是重排（Reflow）和重绘（Repaint）？如何减少？基础
4. 解释事件捕获、冒泡和事件委托。基础
5. cookie、localStorage、sessionStorage、IndexedDB 的区别？基础
6. 什么是强缓存和协商缓存？分别由哪些 HTTP 头控制？基础
7. `<script>` 标签的 `defer` 和 `async` 有什么区别？基础
二、进阶题
8. 浏览器渲染主流程是什么？DOM、CSSOM、Render Tree 的关系？进阶
9. 什么是 CRP（Critical Rendering Path）？如何优化？进阶
10. 什么是布局抖动（Layout Thrashing）？如何避免？进阶
11. 解释合成层（Compositing Layer）和硬件加速。进阶
12. 浏览器的同源策略是什么？跨域有哪些解决方案？进阶
13. 什么是 Web Worker？它的作用和使用限制？进阶
14. 解释 requestAnimationFrame 和 setTimeout/setInterval 做动画的区别。进阶
三、高级题
15. 浏览器是如何保证渲染进程安全的？什么是站点隔离（Site Isolation）？深入
16. 详细描述 Chrome 的合成器线程（Compositor Thread）和主线程的关系。深入
17. 如何分析并优化首屏加载时间（FCP/LCP）？深入
18. Service Worker 是什么？它能做什么？生命周期是怎样的？深入
19. 如何设计一个高性能的虚拟列表（Virtual List）？深入
20. 浏览器的内存泄漏常见场景有哪些？如何排查？深入
21. 什么是 Web Vitals？LCP、INP、CLS 分别衡量什么？深入
22. 什么是 Passkeys？相比传统密码有什么优势？深入
23. 什么是 RenderingNG？它对前端开发者有什么意义？深入
面试准备建议
- 能画出浏览器进程架构图和渲染流程图。
- 准备自己项目中的性能优化案例，量化收益（如 LCP 从 3s 降到 1.2s）。
- 熟练使用 Chrome DevTools 的 Performance、Memory、Layers、Network 面板。
- 理解 Web Vitals 指标和优化策略。
领域编号：F03 浏览器
最后更新：2026-06-24