shoope秋招 二面凉 前端

1.实现CSS垂直水平居中的5种方案2.解释JavaScript闭包及其应用场景3.手写防抖函数debounce4.浏览器事件循环机制中宏任务与微任务执行顺序5.Vue3响应式原理实现流程6.如何实现首屏加载时间从5s优化到1s以内?7.Webpack分包策略如何配置?8.实现深拷贝时如何处理循环引用?9.React Hooks的useEffect与useLayoutEffect别10.前端如何实现精准的埋点数据采集?11.设计可撤销/重做的前端操作方案12.设计高并发场景下的前端缓存策略13.实现权限路由系统的技术方案14.从输入URL到页面展示的完整过程15.手写Promise.all并处理异常情况16.前端监控系统设计要点17.微前端方案落地难点及解决方案18.如何设计跨平台组件库架构?19.LeetCode 146.LRU缓存机制

一面 1. 多个用户同时登陆如何判断token是谁的？2.实习中遇到的挑战3.围绕项目提问4.为什么用webgl渲染，了解其他的渲染方式吗（webgpu、webusb）5.monorepo多包管理6.react的安全漏洞7.react里怎么接入vue组件（给我问懵了，说web component包装，算对）8.AI：MCP\agent智能体、知识库9.进程和线程的区别10.面向对象编程/函数式编程11.并行/并发代码：1.代码输出（事件循环）2.手撕：图片懒加载二面：1.对于美团工作的诉求2.上一份实习最大的收获（答：开发状态转变，问有没有具体case）3.项目人员配置，承担什么工作4.技术选型5.为什么选这个组件库6.什么场景会用到vibe coding7.直接用npm workspace就可以了为什么要＋lerna，解决了什么核心问题8.lerna怎么实现的多包管理9.性能优化指标怎么得出？如何实现？10.总结渲染层面的性能提升手段11.一些第三方库的底层实现原理代码：1.K个一组反转链表2.求一组数的中位数。多种实现方式

1.React 和 Vue 在底层实现上的核心差异2.为什么有的大公司选择react3.JWT缺陷4.有哪些更较健壮的登陆机制5.登录后 Token 的安全存储6.Token 的cookie泄露怎么办7.怎么知道cookie泄露8.如何识别短时间内高频次请求敏感接口的行为9.浏览器本地缓存机制10.sessionStorage 和内存缓存的区别11.service worker和web worker的区别以及使用场景12.Service Worker 实现离线访问，去离线的理解13.PWA14.计算机进程和线程的区别15.串行 并行 同步 异步的区别16.同步队列  串行队列 等等跟线程的关系17.锁18.多线程安全问题19.如何使用锁，给谁加锁20.三个线程 如何让加锁21.meta标签有哪些属性22.meta标签 name=viewport的作用23.如何监听浏览器到底部24.addEventListener监听如何实现25.平时你怎么学习前端的手撕：两数之和

12.25 深圳锐明技术 面试：标记：M 面试官 W 我## 1.场景题：对一个考生的答题应用场景，如何避免考生同时打开两个页面的错误？W；回答使用布尔值，存储在 localStorage，M；存储本地还是后端数据库呢？怎么拦截用户打开新的页面呢？W；当用户结束答题的时候改为 false，M；但是如果断网了，或者直接关闭了浏览器，那么布尔值没有按照正常的逻辑被修改怎么办？W；在服务端判断用户端的网络状况，如果断网了或者关闭了浏览器 及时修改布尔值 但是应该不行？我现在的想法是使用 Websocket 退出会话就代表会话结束了# 2.场景题：虚拟滚动的核心原理W；数值计算： ViewHeight scrollHeight 每行数据的高度 height前端计算 startId 和 limit 然后发送请求IntersectionObserver 的浏览器 API M；面试官对这个提出疑问，说什么得提前渲染节点M；如果行高不唯一呢？如何兼容行高不固定的场景。W；我回答使用哈希表来记录M；用户准备从虚拟列表的第一页切换到第二页了，但是有人在后台中新增了两个数据添加在虚拟列表的最开始，那么原先的第二页需要展示 10-20 对应的数据，但是现在可能展示的是原先的 8-18 对应的数据，那么用户已经在第一页浏览过这个数据了，请问如何优化用户的体验呢？W；虚拟滚动本身就有缓存区会缓存 DOM 节点。。# 3.Canvas 和 SVG 的区别W；不太清楚# 4.JWT 的 token 登录逻辑W；refresh-token / access-token 存储位置 安全防范 过期时长请求和响应拦截器 返回 401 错误 无感刷新 token 的实现 使用 isRefeshing 标记来避免重复调用刷新 token 的接口M；多标签页怎么构建请求队列，第二个标签页怎么监听到第一个标签页的 token 已经刷新完了呢？我感到很疑惑，面试官说两个标签页的内存是不共享的，那么请求队列使用的也不是一个内存里的变量，第二个页面不知道第一个页面的 token 是否刷新成功？内存不是跨标签页的？？？我感到很疑惑。# 5.Vue 和 React 中的遍历 v-for 为什么需要 key 这个关键字M；手写三个 div 为啥不需要 key 但是使用遍历就需要 key 呢？# 6.图片懒加载M；图片进入页面才加载怎么实现 我回答 IntersectionObserverM；如果页面中的按钮突然加载出来，把图片顶到下面去了，那用户刚好点击了这个怎么办？我觉得需要有骨架屏把图片的占据位置就固定的，不可以频繁的变化，这样子引起的重绘太多，# 7.Echarts 图表渲染如果后端返回的数据有很多的小数点很精确该怎么渲染呢# 8.Nextjs 的服务端组件和客户端组件渲染的区别SSR 的渲染和 CSR 的区别水合脚本 js 静态页面--》动态页面服务端组件的限制 这个没回答出来面试官很失望。# 9.介绍 TS 的泛型解决的问题没回答出来interface 和 type 的使用上的区别# 10.在移动端 CSS 如何实现特别小的字体比标准字体更小# 11.算法题：计算字符串中回文子串的数量我回答的是二维 dp 数组实现动态规划的状态转移，面试官说可以只使用一个指针，然后以这个指针为中心去遍历两边对称的回文子串 ，这样子空间复杂度优化了，同时也只需要一个指针。状态转移方程 我的复杂度是 O(n2)总结：凭什么我反问面试官的都是开放性问题，我下次直接拿面试题问他，shame！。