浏览器面试题第 2 页，显示第 51–100 题，共找到 301 道完整解析，可继续按分类、标签与关键词缩小范围。
按稳定语义路径排序
AbortSignal.timeout() 相比手写 setTimeout 加 AbortController 有什么优势（2022 年起主流浏览器支持）？ 本文先给出可直接复述的结论，再用最小代码说明AbortSignal.timeout 超时 静态方法的工作方式、判断依据、项目边界和常见误区。
什么样的跨域 fetch 请求会触发 CORS 预检（OPTIONS）请求，如何避免不必要的预检？ 本文先给出可直接复述的结论，再用最小代码说明CORS 预检 OPTIONS 触发条件 简单请求的工作方式、判断依据、项目边界和常见误区。
在 fetch 的 catch 中如何区分请求是被 AbortController 取消还是真的网络失败，为什么要区分？ 本文先给出可直接复述的结论，再用最小代码说明区分 AbortError 网络错误 catch name的工作方式、判断依据、项目边界和常见误区。
fetch 的 mode 选项 cors、no-cors、same-origin 分别产生什么行为？ 本文先给出可直接复述的结论，再用最小代码说明fetch mode no-cors opaque 响应的工作方式、判断依据、项目边界和常见误区。
fetch 默认跨域请求为什么不带 Cookie，credentials 选项各取值有什么区别？ 本文先给出可直接复述的结论，再用最小代码说明fetch credentials cookie same-origin include的工作方式、判断依据、项目边界和常见误区。
解释 fetch 为什么对 404、500 不 reject：Promise 只在网络层失败时拒绝，HTTP 错误状态会正常 resolve。给出检查 response.ok 或 status 并手动抛错的标准处理方式与边界。
fetch 调用 response.json() 时报错通常有哪些原因，如何健壮处理？ 本文先给出可直接复述的结论，再用最小代码说明response.json 解析失败 空响应的工作方式、判断依据、项目边界和常见误区。
页面即将卸载时 fetch 请求容易中断，keepalive 选项如何解决这类上报丢失问题？ 本文先给出可直接复述的结论，再用最小代码说明fetch keepalive 页面卸载 埋点上报的工作方式、判断依据、项目边界和常见误区。
fetch 发送 POST 请求时，FormData 与 JSON body 在 Content-Type 和处理上有什么区别？ 本文先给出可直接复述的结论，再用最小代码说明fetch POST FormData JSON Content-Type boundary的工作方式、判断依据、项目边界和常见误区。
fetch 遇到 3xx 重定向时 redirect 选项的 follow、error、manual 各有什么效果？ 本文先给出可直接复述的结论，再用最小代码说明fetch redirect manual opaqueredirect的工作方式、判断依据、项目边界和常见误区。
在支持流式请求体的浏览器中用 fetch 上传 ReadableStream，为什么必须设置 duplex: 'half'（Chrome 105+）？ 本文先给出可直接复述的结论，再用最小代码说明fetch 流式请求体 duplex half ReadableStream 上传的工作方式、判断依据、项目边界和常见误区。
为什么 fetch 的 Response body 只能读取一次，需要读两次时怎么办？ 本文先给出可直接复述的结论，再用最小代码说明Response bodyUsed 只能读一次 clone的工作方式、判断依据、项目边界和常见误区。
fetch 本身没有超时参数，如何实现一个请求超时控制？ 本文先给出可直接复述的结论，再用最小代码说明fetch 超时 AbortController setTimeout的工作方式、判断依据、项目边界和常见误区。
为什么原生 fetch 无法监听文件上传进度，有哪些替代方案？ 本文先给出可直接复述的结论，再用最小代码说明fetch 上传进度 不支持 XHR upload的工作方式、判断依据、项目边界和常见误区。
浏览器中 fetch 与 XMLHttpRequest 的核心差异是什么，选型时怎么权衡？ 本文先给出可直接复述的结论，再用最小代码说明fetch 与 XMLHttpRequest 区别的工作方式、判断依据、项目边界和常见误区。
HTTP/1.1 下浏览器对同一域名的并发连接数限制如何影响 SSE 和轮询，HTTP/2 如何缓解？ 本文先给出可直接复述的结论，再用最小代码说明浏览器 同域名 连接数限制 SSE HTTP/2 多路复用的工作方式、判断依据、项目边界和常见误区。
后端以 NDJSON（逐行 JSON）流式返回数据时，前端如何边接收边解析而不是等全部完成？ 本文先给出可直接复述的结论，再用最小代码说明NDJSON 流式解析 fetch reader 按行切分的工作方式、判断依据、项目边界和常见误区。
如何用 fetch 的 response.body.getReader() 逐块读取大文件下载内容并显示进度？ 本文先给出可直接复述的结论，再用最小代码说明response.body getReader 分块读取 下载进度的工作方式、判断依据、项目边界和常见误区。
前端不再需要 SSE 推送时为什么要显式调用 EventSource.close()，服务端如何感知断开？ 本文先给出可直接复述的结论，再用最小代码说明EventSource close 关闭 服务端清理的工作方式、判断依据、项目边界和常见误区。
SSE 的 text/event-stream 数据格式长什么样，EventSource 如何接收消息？ 本文先给出可直接复述的结论，再用最小代码说明SSE EventSource text/event-stream 格式的工作方式、判断依据、项目边界和常见误区。
EventSource 有哪些硬性限制，为什么自定义请求头或 POST 请求做不到？ 本文先给出可直接复述的结论，再用最小代码说明EventSource 限制 GET 自定义请求头的工作方式、判断依据、项目边界和常见误区。
提前终止 fetch 的流读取时，reader.cancel() 和直接丢弃 reader 有什么区别？ 本文先给出可直接复述的结论，再用最小代码说明reader cancel 取消流 释放连接的工作方式、判断依据、项目边界和常见误区。
分块读取流时直接拼接 Uint8Array 转字符串为什么会乱码，TextDecoder 流式解码如何解决？ 本文先给出可直接复述的结论，再用最小代码说明TextDecoder stream true UTF-8 多字节边界 乱码的工作方式、判断依据、项目边界和常见误区。
TransformStream 与 pipeThrough 在 fetch 响应处理中适合解决什么问题，举一个具体场景？ 本文先给出可直接复述的结论，再用最小代码说明TransformStream pipeThrough 流处理 解压 转换的工作方式、判断依据、项目边界和常见误区。
高频发送 WebSocket 消息时为什么需要关注 bufferedAmount，如何处理发送背压？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket bufferedAmount 背压 发送队列的工作方式、判断依据、项目边界和常见误区。
WebSocket 收发二进制数据时 binaryType 选 blob 还是 arraybuffer，依据是什么？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket binaryType blob arraybuffer的工作方式、判断依据、项目边界和常见误区。
WebSocket 关闭连接时 close(code, reason) 的状态码怎么选，1000 与 1006 有什么区别？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket close code 1000 1006 异常关闭的工作方式、判断依据、项目边界和常见误区。
为什么 WebSocket 的 error 事件几乎不携带具体错误信息，实际诊断应该看什么？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket error 事件 信息少 诊断 close code的工作方式、判断依据、项目边界和常见误区。
WebSocket 建立连接时的 HTTP 升级握手过程是怎样的，101 状态码代表什么？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket 握手 Upgrade 101 Sec-WebSocket-Key的工作方式、判断依据、项目边界和常见误区。
WebSocket 的 open、message、error、close 事件与 readyState 在连接生命周期中如何配合？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket readyState open close 生命周期的工作方式、判断依据、项目边界和常见误区。
WebSocket 消息本身没有送达确认和重传机制，需要可靠投递时应用层应怎么设计？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket 消息 可靠性 确认 重传 应用层的工作方式、判断依据、项目边界和常见误区。
设计 WebSocket 客户端的重连与心跳机制时需要考虑哪些要点？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket 重连 心跳 指数退避 ping的工作方式、判断依据、项目边界和常见误区。
WebSocket 构造函数的第二个参数（子协议）起什么作用，协商失败会怎样？ 本文先给出可直接复述的结论，再用最小代码说明WebSocket 子协议 Sec-WebSocket-Protocol 协商的工作方式、判断依据、项目边界和常见误区。
从通信方向、数据类型、断线恢复和实现成本对比 WebSocket 与 SSE，结合消息通知、AI 流式输出、协同编辑等场景给出直接可用的选型方法。
调用 XMLHttpRequest 的 abort() 后，readyState、事件和该对象还能复用吗？ 本文先给出可直接复述的结论，再用最小代码说明XHR abort 后 状态 复用的工作方式、判断依据、项目边界和常见误区。
XMLHttpRequest 的 readyState 从 0 到 4 各代表什么阶段，onreadystatechange 与 onload 有何不同？ 本文先给出可直接复述的结论，再用最小代码说明XMLHttpRequest readyState 状态 onload 区别的工作方式、判断依据、项目边界和常见误区。
XMLHttpRequest 的 responseType 有哪些取值，下载二进制文件时应该选什么？ 本文先给出可直接复述的结论，再用最小代码说明XMLHttpRequest responseType blob arraybuffer的工作方式、判断依据、项目边界和常见误区。
为什么主线程上的同步 XMLHttpRequest 被废弃并应避免使用？ 本文先给出可直接复述的结论，再用最小代码说明同步 XHR 主线程阻塞 废弃的工作方式、判断依据、项目边界和常见误区。
XMLHttpRequest 的 timeout 属性与 ontimeout 事件如何工作，与手动 setTimeout 中断有何区别？ 本文先给出可直接复述的结论，再用最小代码说明XHR timeout ontimeout 超时的工作方式、判断依据、项目边界和常见误区。
XMLHttpRequest 如何分别监听上传进度和下载进度，两个 progress 事件挂在哪个对象上？ 本文先给出可直接复述的结论，再用最小代码说明XHR upload progress 下载进度 事件的工作方式、判断依据、项目边界和常见误区。
什么情况下页面能进入往返缓存（bfcache），pageshow 事件的 persisted 属性如何帮助处理恢复逻辑？ 本文先给出可直接复述的结论，再用最小代码说明bfcache pageshow persisted 往返缓存的工作方式、判断依据、项目边界和常见误区。
Element.checkVisibility 与用 offsetParent 或 getClientRects 判断元素是否可见相比，能额外覆盖哪些隐藏情形？ 本文先给出可直接复述的结论，再用最小代码说明checkVisibility 元素可见性 判断的工作方式、判断依据、项目边界和常见误区。
clientWidth、offsetWidth、scrollWidth 三者分别包含哪些部分，判断元素是否出现溢出该比较哪两个？ 本文先给出可直接复述的结论，再用最小代码说明clientWidth offsetWidth scrollWidth 区别 溢出的工作方式、判断依据、项目边界和常见误区。
content-visibility:auto 如何跳过屏外内容的布局与绘制，它对滚动条和锚点跳转有什么副作用？ 本文先给出可直接复述的结论，再用最小代码说明content-visibility auto 跳过渲染 屏外的工作方式、判断依据、项目边界和常见误区。
浏览器从收到 HTML 字节到首屏像素的关键渲染路径包含哪些阶段，每个阶段的输入输出是什么？ 本文先给出可直接复述的结论，再用最小代码说明关键渲染路径 DOM CSSOM 渲染树 布局 绘制 合成的工作方式、判断依据、项目边界和常见误区。
为什么外部样式表会阻塞首次渲染，而内联脚本必须等待之前的 CSSOM 构建完成？ 本文先给出可直接复述的结论，再用最小代码说明CSS 阻塞渲染 CSSOM 脚本等待样式表的工作方式、判断依据、项目边界和常见误区。
CSS contain 属性的 layout、paint、size 等取值如何让浏览器缩小一次样式变更的重算范围？ 本文先给出可直接复述的结论，再用最小代码说明CSS contain 布局隔离 渲染性能的工作方式、判断依据、项目边界和常见误区。
display:none、visibility:hidden、opacity:0 三种隐藏方式在布局、绘制、命中测试和可访问性上各有什么差异？ 本文先给出可直接复述的结论，再用最小代码说明display none visibility hidden opacity 0 区别的工作方式、判断依据、项目边界和常见误区。
document.readyState 的 loading、interactive、complete 三个值分别对应页面加载的什么时刻？ 本文先给出可直接复述的结论，再用最小代码说明document.readyState readystatechange 加载状态的工作方式、判断依据、项目边界和常见误区。
DOMContentLoaded 事件与 window 的 load 事件分别等待什么资源，监听哪个会漏掉图片加载完成？ 本文先给出可直接复述的结论，再用最小代码说明DOMContentLoaded load 事件区别 资源加载的工作方式、判断依据、项目边界和常见误区。
