跳到主要内容

百度✅

  • 业务领域: 搜索引擎、人工智能（文心一言）、云计算、百度网盘、移动生态
  • 技术栈: React、Vue、TypeScript、Node.js、WebAssembly、San（百度自研 MVVM 框架）
  • 团队规模: 前端团队约1000+人
  • 办公地点: 北京（总部）、上海、深圳、成都
  • 公司性质: 互联网
  • 薪资水平: 校招22-38万，社招30-75万

岗位类型​

  • 前端开发工程师 - 负责百度搜索结果页、文心一言 Web 端、百度网盘、移动生态各业务线前端开发
  • 高级前端工程师 - 负责多端渲染性能攻坚、大模型 AI 原生交互、端到端监控体系与核心组件库建设
  • 前端架构师 - 负责大前端技术基础设施建设、San 框架及编译生态演进、跨端混合开发容器设计

技术特色​

  • 自研 MVVM 框架 San: 百度自主研发的高性能响应式框架，体积仅约 15KB，具备极速服务端渲染（SSR）与客户端反向 Hydration 优势，全面承载百度搜索亿级流量。
  • AI 原生应用架构: 深度融合文心大模型能力，沉淀 Server-Sent Events (SSE) 流式解析渲染、Markdown/KaTeX 动态排版与多模态交互工程方案。
  • 超大规模云存储与传输架构: 百度网盘在 Web 端大文件切片上传、多线程断点续传、分块校验（MD5）与 WebWorker 资源加速领域拥有深厚技术积累。

面试流程概览​

校园招聘​

  1. 简历筛选 → 在线笔试（含客观题与编程题） → 技术一面 → 技术二面 → HR面试
    • 总流程约3-4周
    • 难度: 4/5星
    • 通过率: 约6%

社会招聘​

  1. 简历筛选 → 技术一面（基础与源码） → 技术二面（业务与架构） → 技术三面（部门总监面） → HR面试
    • 总流程约2-3周
    • 难度: 4/5星
    • 通过率: 约10%

题库​

P0 必考知识点​

百度网盘 Web 端大文件切片上传与断点续传如何设计？​

答案

核心结论​

针对百兆至数十 GB 级别的大文件上传，直接单一 HTTP POST 极易因网络超时、内存溢出或中断而导致失败重试成本极高。标准解决方案是前端文件切片（Blob.prototype.slice）+ WebWorker 计算文件唯一标识（SparkMD5 抽样哈希）+ 并发控制 + 服务端秒传探测与切片持久化合并。

架构设计与实现步骤​

  1. 文件指纹与秒传探测：
    • 为避免超大文件计算完整 Hash 卡顿，在 WebWorker 中采用抽样哈希策略（首尾切片全量 + 中间切片各取前中后 2KB 数据）生成文件特征值。
    • 上传前向服务端发送 checkFile({ fileHash, ext })：若文件已存在直接返回成功（实现秒传）；若部分切片已存在，返回已接收的切片索引列表（uploadedChunks）。
  2. 切片切割与并发上传池：
    • 设定切片大小（通常 5MB~20MB），利用 file.slice(start, end) 切割成 Blob。
    • 过滤已上传切片，通过并发调度器（限制 3~6 个并发连接）异步上传，并在每个切片带上 { chunkHash, index, total, fileHash }。
  3. 断点续传与失败重试：
    • 监听每个切片请求的 onprogress，实时计算总体上传进度。
    • 单个切片失败时，采用指数退避重试（最多 3 次）。网络中断恢复后，重新调用探测接口即可无缝续传。
  4. 通知合并切片：
    • 全部切片上传完毕后，前端触发 mergeChunks({ fileHash, fileName, size })，后端完成文件拼装与完整性校验。

面试官视角​

面试官考察候选人对 Blob 二进制操作、Worker 线程异步计算、网络可靠性兜底与高并发控制的实战深度，同时关注断网恢复、大内存占用防范（流式读取而非全部加载进内存）等工程细节。

实现类似 Slack 的实时在线聊天室（IM）架构设计？​

答案

核心结论​

实时在线聊天室核心解决低延迟双向通信、消息时序一致性、弱网离线重连、消息去重与已读未读状态同步。前端架构需涵盖连接层（WebSocket + 心跳保活）、协议层（Protobuf 序列化）、状态缓存层（IndexedDB 离线存储）与虚拟滚动消息渲染层。

核心模块划分​

  1. 双向长连接与高可用保活：
    • 采用 WebSocket 作为主通道，降级使用 HTTP SSE（服务端事件推送）或长轮询（Long Polling）。
    • 心跳机制与断线重连：前端每 15-30s 发送 ping，若超时未收到 pong 则主动销毁连接，并采用带随机抖动的指数退避策略（Exponential Backoff + Full Jitter）发起重连。
  2. 消息时序与去重保证：
    • 前端生成本地临时 ID（UUID + Timestamp）实现乐观更新（UI 立即上屏），待服务端下发递增 msgSeqId 后完成状态确认。
    • 本地维护已接收消息的最大 seqId，重连后拉取差异增量消息（syncMessages({ lastSeqId })），确保消息不丢不重。
  3. 海量聊天记录渲染优化：
    • 采用双向不定高虚拟列表，视口仅挂载当前可见的数十条消息，避免长期聊天导致的 DOM 节点数暴增与内存溢出。
    • 历史消息向上滚动触顶加载时，记录当前顶部可视元素的绝对位置或使用 overflow-anchor: auto 保持视口稳定防跳动。

延伸阅读​

考察重点速览​

  • 必考知识点: 原生 JavaScript 闭包与作用域链、事件循环机制、HTTP/HTTPS 与浏览器缓存、CSS 盒模型与布局。
  • 高频面试题: 大文件切片上传、WebSocket 实时通信、虚拟滚动原理、前端首屏秒开优化。
  • 编程挑战: 手写防抖/节流、深拷贝、二叉树广度/深度优先遍历、LRU 缓存实现。

备考建议​

针对性准备策略

  • 扎实巩固前端原生与网络协议: 百度技术风格偏向计算机底层基础与协议规范，建议重点复习 TCP 三次握手/四次挥手、HTTP 缓存头及浏览器渲染管道。
  • 深挖实际项目难点: 准备具有工程深度和技术挑战的项目案例（如大文件传输、实时协作、首屏性能攻坚），讲清架构取舍与收益指标。

推荐准备资源

差异化准备建议

  • 校招生: 重视基础数据结构、算法、计算机网络与操作系统，编码习惯需规范严谨。
  • 社招生: 突出中大型系统架构设计能力、前端工程化沉淀及团队技术领导力。
最后由 zenheart 于 更新