美团春招前端面经

继续来分享下之前的面经~欢迎友好讨论，信息共享1.React Fiber架构解决了什么问题?它的工作原理是怎样的?2.在开发Agent产品时，如何实现一个流畅的"打字机"输出效果?3.如何处理Agent返回的长文本中的Markdown和LaTeX公式渲染?4.你们项目里是如何进行前端性能优化的?有哪些量化指标?5.Webpack 的构建流程是怎样的?你做过哪些打包优化?6.谈谈微前端架构，为什么需要它?常用的方案有哪些?7.在 Agent这种复杂状态的应用中，你会选择哪种状态管理方案?为什么?8.快手内部有很多跨端场景，你对跨端方案(如小程序、KwaiNative)有了解吗?9.前端如何捕获并处理异常?对于白屏异常怎么监控?

感觉还是有点压力的，可能本人水平还是太菜了导致的1、自我介绍2、询问之前实习，做过或者遇到过比较大的问题是什么？3、安卓的AIDL是什么？底层是基于什么？4、Binder为什么效率更高？详细解释一下（意思估计就是说一下内存映射与一次拷贝）5、假设有一个Java的普通类，实现生产者-消费者模式。大体说明思路，并且用代码写一个大体框架。6、实现一个线程池（正式写代码，当让不出意外的，超时了也没搓出来）7、如果这个线程池是I/O密集型或者CPU密集型，那应该怎么设计？8、这个自定义线程池如果在上述条件下，通常多开一点线程可以解决。但是上限该怎么界定？9、假设一个内存4GB，用户与内核内存分配比例是多少？3GB的话，从内存资源限制来看的话，最多能开大约多少个线程？10、一个懒汉式单例的代码，找问题（实际上缺的是在多线程环境下，双重检查锁定，也就是线程安全，以及指令重排的问题。开始一直按照正常状态想，面试官说这代码上线的话绝对崩一大片想到了）然后就反问问题了；部门开发日常属于偏全栈，前端、数据、客户端等几乎所有的语言都会用到。当然估计肯定挂了，哈哈哈太菜了

攒人品中，祝大家都能拿到满意的Offer！1.AI聊天界面中，当新消息到达时如何平滑地滚动到底部?如果用户正在向上滚动查看历史记录，该如何处理?2.详细说明一下前端如何处理 Markdown中的代码块高亮，以及如何支持代码的一键复制。3.在构建AI应用时，你是如何设计Prompt模板管理系统的?4.谈谈你对RAG(检索增强生成)流程中前端职责的理解。5.如何解决流式输出(Streaming)过程中，由于内容长度变化导致的页面布局抖动(Layout Shift)?6.你们项目里是如何处理大模型响应慢的问题的?前端有哪些优化手段?7.介绍一下WebWorker在AI前端应用中的使用场景。

1. 浏览器 CSS、JS、DOM 解析顺序• 解析顺序：HTML 解析生成 DOM → CSS 解析生成 CSSOM → 合成渲染树 → 渲染• 阻塞规则：CSS 不阻塞 DOM 解析，但阻塞 JS 执行；JS 阻塞 DOM 解析2. 表格相关• 表格缓存：内存/本地存储缓存数据、滚动位置、筛选状态• 首屏监控：用 Performance 监听 FP、FCP、LCP 等核心指标• 虚拟表格：只渲染可视区 DOM，用占位撑开高度，滚动时动态替换内容• 表格选型：简单用原生；大数据用虚拟表格；复杂用 AntD/AgGrid3. 前端安全• XSS：转义、CSP、HttpOnly• CSRF：Token、SameSite Cookie• 点击劫持：X-Frame-Options• 资源校验：SRI4. Tree-Shaking 原理• 基于 ES6 模块静态分析，打包时删除未引用代码，生产模式生效，不支持 CommonJS5. React 与 Vue 区别• React：不可变数据、JSX、手动更新、全量 Diff• Vue：响应式代理、模板、自动更新、精准追踪更新6. 微前端隔离（快照 vs Proxy）• 快照：保存/恢复全局变量，实现简单，性能差• Proxy：代理 window 实现沙箱，隔离好、性能高，兼容略差7. 部署与回滚• 部署：打包 → 上传静态资源 → Nginx 配置• 回滚：切换至历史版本/重新部署上一版包8. WebWorker• 作用：开辟独立线程，处理耗时计算，不阻塞主线程• API：new Worker()、postMessage、onmessage、terminate()9. AI 语音对话实现1. 前端获取麦克风音频2. ASR 转文字3. 发送大模型获取回答4. TTS 转语音5. 前端播放10. JWT 双 Token• AccessToken：短效，接口鉴权• RefreshToken：长效，刷新用• 流程：AT 过期 → 用 RT 换新 AT → RT 过期重新登录11. MiniMax 了解• 国内 AGI 大模型公司，提供文本、语音、多模态AI 能力，低延迟、端侧优化