tme暑期前端一面 4.22

上周我面了字节、阿里、美团的前端岗，都过了。血泪经验总结成一句话：今年面试，懂AI的比懂React的更抢手。字节那轮面试，面试官问了我一个问题："你平时怎么用AI辅助前端开发？"我当时心想，终于到我擅长的领域了。因为我最近一直在研究Cursor做React组件开发，用AI生成TypeScript类型定义，还做过一个基于AI的组件库文档生成工具。结果面试官追问："你用AI生成的组件有做过性能优化吗？怎么保证AI生成的代码没有XSS漏洞？"这两个问题直接把我问住了。AI生成代码是快，但它不懂业务场景，不懂安全边界，更不懂性能调优。这些"后处理&qu...

面试时间：4.22下午3点 时长1h道心破碎了，对项目进行非常深度的拷问，还考了性能监测这一部分，以及一个音乐播放的场景题，全程基本无八股无手撕，最没有悬念的一次面试，g的不能再g，基本上考的都是我没有了解的知识，反问我直接问前面的答案了，还是太菜了，录音还忘记录了，算了反正也不敢听1. 自我介绍2. 虚拟列表怎么实现的3. 一道性能指标采集代码找错误，力竭了，根本找不出来，根本没了解过这部分知识4. 文件上传是怎么实现的5. 大文件分片上传时，计算 5MB 分片 MD5 大概要多久6. 如果文件很大，计算完整文件 MD5 很耗时，有什么性能优化方案7. Web Worker 在大文件 MD5 计算里能怎么用8. 服务端保存所有分片索引和分片文件，会不会导致碎片文件越来越多9. 分片合并完成后，服务端临时分片目录应该怎么清理10. 如果清理了分片，下次上传同一个文件还能不能做分片级别的秒传11. 秒传应该基于完整文件 hash 还是分片 hash12. 服务端怎么设计分片管理，才能避免既存完整文件又存所有分片造成空间浪费13. 如果两个文件部分分片相同、整体文件不同，怎么判断和复用分片14. 歌曲列表页点击歌曲后，如何打开一个独立播放页15. 如果播放页已经存在，列表页怎么通知已有播放页切换歌曲16. 怎么判断播放页是否已经存在或是否被关闭17. 如何用 LocalStorage 实现跨页面通信18. 如何用 LocalStorage 实现页面间心跳检测19. LocalStorage 轮询方案有什么性能问题20. 除了 LocalStorage，跨页面通信还有哪些更好的方案21. postMessage 和 Service Worker 怎么用于跨页面通信22. 歌曲列表中大量图片加载时，如何先展示占位图23. 图片加载成功后怎么切换为真实图片24. 图片加载失败后怎么展示失败图25. 如何通过图片的 load 和 error 事件判断加载状态26. 你接触过 React Native 或 Flutter 这类跨端技术吗27. Vite 相比 Webpack，为什么开发阶段启动更快28. Webpack 能不能也配置成使用 ES Module29. Vite 的热更新 HMR 是怎么实现的30. WebSocket 和 SSE 有什么区别31. 反问

面试官很和善，引导的很好，技术理解的题答不出来会讲解然后跳过，感谢1.主要拷打项目和实习工作时的主观能动性，比如为了解决什么样的问题或者需求做的，工作时对项目的整体架构探索和需求背景的了解；2.提问hook和工具函数的区别，只从复用角度为什么还要用的自定义hook而不是封装成工具函数；3.前端框架的意义；4.diff和如何降低多叉树复杂度；5.找出无序数组的连续区间（思路有但没写出来，刷题刷傻了，想复杂了）；6.如何使用ai工具，使用哪些编译器，项目编译前后分别是什么；7.vite，webpack如何配置；总之考察思维和开放题为主。收获：提升了自信，以及还是要提升解决问题的能力，不能一味刷八股...

面试官介绍部分 pcg 腾讯视频1. 什么是闭包，什么时候会用到2. 电商项目中，如何将FCP从3.3优化到1.83. WebP与PNG、JPG图片格式区别4. SSE跟WebSocket的区别5. 流式对话中响应中断如何处理6. Agent中react模式是怎样的7. Skills、MCP、CLI三者区别与优缺点8. 什么是状态机，语音输入为什么要用状态机9. 封装组件需要遵循哪些原则10. AI聊天对话框如何实现，怎么承接SSE流式返回11. AI流式输出图片、PDF、富文本、Markdown、交互组件如何统一渲染12. 用户个人知识库搭建与完整使用流程13. 文档上传后解析、分块、向量化、入库、检索全流程14. 自研知识库和普通桌面AI上传文档问答区别、项目初衷15. Monorepo大仓与传统单层单体架构优缺点对比16. Monorepo和微前端是不是同一个东西，区别是什么17. 业界主流大仓、模块化工程方案有哪些18. 为什么需要微前端，解决什么痛点19. 常见微前端框架及各自特点20. 微前端适用场景与优缺点21. 对Harness Engineering的理解22. Agent人机等待、表单确认、对话交互闭环实现深度23. Harness工程是否有项目落地实践24. 面试回答流畅是提前准备还是真实项目积累反问：组内具体的业务根据面试表现给建议结果多久出 1-2天面试完一个小时约二面了