浏览器面试题第 3 页，显示第 101–150 题，共找到 301 道完整解析，可继续按分类、标签与关键词缩小范围。
按稳定语义路径排序
@font-face 的 font-display 各取值如何控制字体加载期间的文本渲染，swap 与 optional 的体验差异是什么？ 本文先给出可直接复述的结论，再用最小代码说明font-display FOIT FOUT 字体加载 渲染的工作方式、判断依据、项目边界和常见误区。
什么是强制同步布局，在循环里交替写样式和读 offsetHeight 会造成什么后果、如何定位这类问题？ 本文先给出可直接复述的结论，再用最小代码说明强制同步布局 layout thrashing 性能诊断的工作方式、判断依据、项目边界和常见误区。
以 60Hz 刷新为例，一次渲染帧的预算大约是多少，rAF 回调里的长任务为什么直接表现为掉帧？ 本文先给出可直接复述的结论，再用最小代码说明帧预算 16ms 掉帧 rAF 长任务的工作方式、判断依据、项目边界和常见误区。
getBoundingClientRect 与 offsetTop/offsetWidth 在参考系、小数精度和 transform 影响上有什么区别？ 本文先给出可直接复述的结论，再用最小代码说明getBoundingClientRect offsetWidth offsetTop 区别的工作方式、判断依据、项目边界和常见误区。
页面里的 iframe 会怎样影响父页面 window load 事件的触发，嵌入慢第三方页面时有哪些隔离手段？ 本文先给出可直接复述的结论，再用最小代码说明iframe load 阻塞 父页面 加载的工作方式、判断依据、项目边界和常见误区。
img 标签的 loading=lazy 与 decoding=async 分别推迟什么工作，两者对首屏大图是否都合适？ 本文先给出可直接复述的结论，再用最小代码说明img loading lazy decoding async 图片懒加载 解码的工作方式、判断依据、项目边界和常见误区。
IntersectionObserver 的 root、rootMargin、threshold 各控制什么，threshold 传数组会在什么情况下触发多次回调？ 本文先给出可直接复述的结论，再用最小代码说明IntersectionObserver rootMargin threshold 触发语义的工作方式、判断依据、项目边界和常见误区。
做元素可见性检测时，IntersectionObserver 相比 scroll 事件里调 getBoundingClientRect 有什么本质优势？ 本文先给出可直接复述的结论，再用最小代码说明IntersectionObserver scroll getBoundingClientRect 可见性检测的工作方式、判断依据、项目边界和常见误区。
页面合成层过多会导致什么问题，排查层数量异常时应该看哪些信号？ 本文先给出可直接复述的结论，再用最小代码说明合成层过多 层爆炸 内存 GPU 栅格化的工作方式、判断依据、项目边界和常见误区。
如何用 PerformanceLongTaskTiming 监测页面长任务，50ms 阈值是怎么来的、attribution 能定位到什么粒度？ 本文先给出可直接复述的结论，再用最小代码说明Long Tasks API 长任务监测 50ms attribution的工作方式、判断依据、项目边界和常见误区。
MutationObserver 的回调是按每次 DOM 变更同步触发还是批量触发，这决定了它适合和不适合什么场景？ 本文先给出可直接复述的结论，再用最小代码说明MutationObserver 批量回调 微任务 DOM 监听的工作方式、判断依据、项目边界和常见误区。
用 PerformanceNavigationTiming 能拆解出页面加载的哪些阶段，TTFB 偏长应看其中哪几个时间戳？ 本文先给出可直接复述的结论，再用最小代码说明PerformanceNavigationTiming TTFB 加载阶段拆解的工作方式、判断依据、项目边界和常见误区。
OffscreenCanvas 解决了什么渲染瓶颈，把 canvas 绘制移进 Worker 需要满足什么前提？ 本文先给出可直接复述的结论，再用最小代码说明OffscreenCanvas Worker 离屏渲染的工作方式、判断依据、项目边界和常见误区。
document.visibilityState 有哪几种取值，页面最小化与切到后台标签页分别进入哪个状态？ 本文先给出可直接复述的结论，再用最小代码说明Page Visibility API visibilityState 状态的工作方式、判断依据、项目边界和常见误区。
beforeunload、unload、pagehide 三个事件在触发时机与可靠性上有什么区别，移动端为什么应优先用 pagehide？ 本文先给出可直接复述的结论，再用最小代码说明beforeunload unload pagehide 区别 可靠性的工作方式、判断依据、项目边界和常见误区。
PerformancePaintTiming 提供的 first-paint 与 first-contentful-paint 有什么区别，FCP 偏晚通常意味着什么？ 本文先给出可直接复述的结论，再用最小代码说明PerformancePaintTiming FP FCP 首次绘制的工作方式、判断依据、项目边界和常见误区。
给 touchstart、wheel 监听加 passive:true 为什么能改善滚动流畅度，加上之后代码里不能再做什么？ 本文先给出可直接复述的结论，再用最小代码说明passive 事件监听 滚动性能 preventDefault的工作方式、判断依据、项目边界和常见误区。
HTML 解析器被脚本阻塞时，浏览器的预加载扫描器为什么还能提前发起资源请求？ 本文先给出可直接复述的结论，再用最小代码说明preload scanner 预加载扫描器 推测解析的工作方式、判断依据、项目边界和常见误区。
哪些 DOM 读写操作会触发回流，为什么把多次几何读取集中到写入之前能减少回流次数？ 本文先给出可直接复述的结论，再用最小代码说明回流 reflow 触发 读写分离 批量更新的工作方式、判断依据、项目边界和常见误区。
重绘和回流的触发条件与开销有何不同，为什么修改 color 通常比修改 width 便宜？ 本文先给出可直接复述的结论，再用最小代码说明重绘 repaint 回流 reflow 区别 开销的工作方式、判断依据、项目边界和常见误区。
requestAnimationFrame 的回调相对一次渲染更新的布局、绘制步骤在什么时候执行，为什么适合在里面读写 DOM？ 本文先给出可直接复述的结论，再用最小代码说明requestAnimationFrame 回调时机 渲染帧的工作方式、判断依据、项目边界和常见误区。
requestIdleCallback 的回调在什么时机执行，deadline.timeRemaining 与 timeout 参数各自解决什么问题？ 本文先给出可直接复述的结论，再用最小代码说明requestIdleCallback 空闲回调 deadline timeout的工作方式、判断依据、项目边界和常见误区。
监听单个元素尺寸变化为什么要用 ResizeObserver 而不是 window 的 resize 事件，它的回调在渲染流程的哪个时机触发？ 本文先给出可直接复述的结论，再用最小代码说明ResizeObserver 元素尺寸 监听 回调时机的工作方式、判断依据、项目边界和常见误区。
preload、prefetch、preconnect、dns-prefetch 四种资源提示分别影响加载流程的哪个环节，preload 为什么需要 as 属性？ 本文先给出可直接复述的结论，再用最小代码说明preload prefetch preconnect 资源提示 优先级的工作方式、判断依据、项目边界和常见误区。
把一个大任务拆成多个小任务时，scheduler.yield 相比 setTimeout(0) 在恢复优先级上有什么优势？ 本文先给出可直接复述的结论，再用最小代码说明scheduler.yield 任务拆分 让出主线程的工作方式、判断依据、项目边界和常见误区。
script 标签的 defer 与 async 属性在下载时机、执行顺序和相对 DOMContentLoaded 的执行点上有什么区别？ 本文先给出可直接复述的结论，再用最小代码说明script defer async 执行顺序 DOMContentLoaded的工作方式、判断依据、项目边界和常见误区。
setTimeout 嵌套调用超过一定层数后为什么最小延迟会变成 4ms，后台标签页中定时器还会被怎样节流？ 本文先给出可直接复述的结论，再用最小代码说明setTimeout 4ms 钳制 后台节流的工作方式、判断依据、项目边界和常见误区。
为什么用 transform 和 opacity 做动画通常比修改 top/left 或 width 更流畅？ 本文先给出可直接复述的结论，再用最小代码说明transform opacity 动画 合成线程 性能的工作方式、判断依据、项目边界和常见误区。
View Transitions API 在 DOM 更新前后分别做了什么，为什么它能让状态切换变成平滑动画而不手写关键帧？ 本文先给出可直接复述的结论，再用最小代码说明View Transitions API startViewTransition 过渡动画的工作方式、判断依据、项目边界和常见误区。
实现十万条数据的虚拟列表，核心渲染策略是什么，固定行高与不定行高在实现难度上差在哪？ 本文先给出可直接复述的结论，再用最小代码说明虚拟列表 长列表 渲染 窗口化的工作方式、判断依据、项目边界和常见误区。
基于 visibilitychange 事件，哪些类型的页面任务应该在页面隐藏时暂停或降级，为什么？ 本文先给出可直接复述的结论，再用最小代码说明visibilitychange 暂停视频 轮询 草稿保存的工作方式、判断依据、项目边界和常见误区。
VisualViewport API 与 window.innerWidth 衡量的视口有何不同，移动端弹出软键盘后页面布局该参考哪个？ 本文先给出可直接复述的结论，再用最小代码说明VisualViewport 视觉视口 布局视口 软键盘的工作方式、判断依据、项目边界和常见误区。
哪类计算适合移入 Web Worker，Worker 与主线程通信的 postMessage 结构化克隆会带来什么成本？ 本文先给出可直接复述的结论，再用最小代码说明Web Worker 主线程 卸载计算 postMessage 成本的工作方式、判断依据、项目边界和常见误区。
CSS will-change 应该什么时候声明、为什么长期挂在大量元素上反而会拖慢页面？ 本文先给出可直接复述的结论，再用最小代码说明will-change 合成层 内存 代价的工作方式、判断依据、项目边界和常见误区。
Cookie 的 Expires 和 Max-Age 如何决定其是会话级还是持久级？ 本文先给出可直接复述的结论，再用最小代码说明Cookie Expires 与 Max-Age 会话与持久的工作方式、判断依据、项目边界和常见误区。
本题说明 Cookie 三个安全属性各自的防御目标：HttpOnly 防脚本窃取、Secure 防明文传输窃听、SameSite 防跨站伪造请求，并给出真实配置场景与失效边界。
Cookie 的 Path 和 Domain 属性如何联合限定其作用域？ 本文先给出可直接复述的结论，再用最小代码说明Cookie Path 和 Domain 作用域规则的工作方式、判断依据、项目边界和常见误区。
Cookie 名字中的 __Host- 前缀有哪些约束？ 本文先给出可直接复述的结论，再用最小代码说明__Host- Cookie 前缀约束的工作方式、判断依据、项目边界和常见误区。
SameSite=Lax 和 Strict 在实际导航中有什么不同？ 本文先给出可直接复述的结论，再用最小代码说明SameSite Lax 与 Strict 的区别的工作方式、判断依据、项目边界和常见误区。
为什么 SameSite=None 必须配合 Secure 属性？ 本文先给出可直接复述的结论，再用最小代码说明SameSite=None 为什么必须加 Secure的工作方式、判断依据、项目边界和常见误区。
Secure 属性在 localhost 或 HTTP 环境下如何使用？ 本文先给出可直接复述的结论，再用最小代码说明Secure Cookie 在 localhost 的例外的工作方式、判断依据、项目边界和常见误区。
Cookie 大小和数量的上限是多少？ 本文先给出可直接复述的结论，再用最小代码说明Cookie 大小与数量上限的工作方式、判断依据、项目边界和常见误区。
Cookie 中 Domain= 属性是否包含点号前缀对子域访问有什么影响？ 本文先给出可直接复述的结论，再用最小代码说明Cookie Domain 点号与子域访问的工作方式、判断依据、项目边界和常见误区。
Cookie、localStorage 和 IndexedDB 分别适合存储什么类型的数据？ 本文先给出可直接复述的结论，再用最小代码说明Cookie localStorage IndexedDB 区别与适用场景的工作方式、判断依据、项目边界和常见误区。
Web Locks API 如何避免多个标签页同时修改 IndexedDB？ 本文先给出可直接复述的结论，再用最小代码说明Web Locks API 多标签页互斥的工作方式、判断依据、项目边界和常见误区。
如何用 BroadcastChannel 实现 localStorage 的跨标签页同步？ 本文先给出可直接复述的结论，再用最小代码说明BroadcastChannel 跨标签页同步 localStorage的工作方式、判断依据、项目边界和常见误区。
IndexedDB 中存储 Blob 和 ArrayBuffer 有什么不同？ 本文先给出可直接复述的结论，再用最小代码说明IndexedDB 存 Blob 与 ArrayBuffer 区别的工作方式、判断依据、项目边界和常见误区。
IndexedDB 事务成功的标志是 oncomplete、onsuccess 还是 onerror？ 本文先给出可直接复述的结论，再用最小代码说明IndexedDB 事务 oncomplete 与 onsuccess的工作方式、判断依据、项目边界和常见误区。
IndexedDB 如何创建复合索引并用其查询？ 本文先给出可直接复述的结论，再用最小代码说明IndexedDB 复合索引创建与查询的工作方式、判断依据、项目边界和常见误区。
什么时候应该用 IndexedDB 游标而不是直接用 get 或 index？ 本文先给出可直接复述的结论，再用最小代码说明IndexedDB 游标适用场景与性能的工作方式、判断依据、项目边界和常见误区。
