网易 AI 全栈开发一面（游戏宣发官网方向）

《面试题目》

1. 简历项目相关。
2. 浏览器各种不同的缓存方案有什么区别？
3. WebSocket 原理，如何实现双向通信？
4. 浏览器输入 URL 到渲染的流程？
5. 请求、渲染分别能做什么项目优化操作？
6. 前端核心性能指标有哪些？
7. Vue3 响应式原理？
8. Proxy 原理？
9. 浏览器三次挥手的弊端？

《参考解析》

1. 浏览器缓存方案的区别：分强缓存和协商缓存。强缓存（Cache-Control 的 max-age、immutable，以及 Expires）命中时根本不发请求；协商缓存（ETag 与 If-None-Match、Last-Modified 与 If-Modified-Since）会带上校验字段去问服务端，没变就返回 304。此外还有 memory cache、disk cache、Service Worker 缓存和 CDN 边缘缓存这些层级；实践上静态资源用内容哈希文件名加长 max-age，HTML 用协商缓存保证能及时拿到新版本。
2. WebSocket 怎么实现双向通信：先用一次 HTTP 请求带 Upgrade: websocket 完成握手，服务端返回 101 后协议切换到建立在 TCP 之上的帧协议，之后双方可以随时互相推送，不再有请求与响应的语义绑定。相比轮询省掉了大量无效请求和头部开销，代价是要自己处理心跳保活、断线重连和连接数管理；和 SSE 的区别是 SSE 只能服务端单向推、仍基于普通 HTTP。
3. 输入 URL 到渲染：DNS 解析、TCP 与 TLS 建连、发 HTTP 请求、服务端响应，然后浏览器解析 HTML 构建 DOM（遇到 CSS 阻塞渲染、同步 JS 阻塞解析），生成 CSSOM 并合成渲染树，接着布局、绘制、合成上屏。能优化的点分散在各段：DNS 预解析与预连接、CDN、压缩与缓存、关键 CSS 内联、JS 用 defer 或 async、减少重排重绘、图片懒加载并给合适尺寸与格式。
4. 前端核心性能指标：核心是 Core Web Vitals——LCP 看最大内容绘制对应加载体验，INP 看交互响应性，CLS 看累计布局偏移即视觉稳定性，再配合 TTFB、FCP、TBT、长任务与首屏时间。优化要落到具体手段：LCP 靠资源优先级、图片优化与服务端渲染；INP 靠拆长任务、减少主线程阻塞；CLS 靠给图片和广告位预留尺寸。
5. Vue3 响应式与 Proxy：Vue3 用 Proxy 包裹对象做拦截，读取时 track 收集依赖、写入时 trigger 派发更新，配合 Reflect 保证 receiver 语义正确。相比 Vue2 的 Object.defineProperty，Proxy 能直接监听新增与删除属性、数组下标和 length 变化，不需要递归遍历整个对象做转换，初始化更快也更容易做懒代理；代价是不支持 IE，基本类型仍需 ref 包一层。
6. 三次挥手的问题：TCP 挥手是四次而不是三次——因为 TCP 是全双工，一方发 FIN 只表示自己不再发数据，另一个方向仍可继续传，所以 FIN 和 ACK 常常不能合并；如果硬压成三次，等于把被动方”我还有数据要发”的状态省掉，可能丢掉未传完的数据。回答这类题时主动纠正成”握手三次、挥手四次”，比顺着题面答更稳。