字节飞书文档前端 二面

一面 （2.24）：面试时长（1h5min）1. 实习过程中最难上手的或者最大的难点是什么？2. 如何理解Web Component，如何学习的？3. 如何在Web Component中引入第三方库？4. 介绍一下什么是服务端渲染5. 为什么要SSR，对比CSR有什么优缺点6. 第三方库在服务端渲染时还有哪些兼容性问题7. 在SSR中进行数据处理有什么不同吗？比如正则或者symbol（没了解）8. 性能优化一般用什么样的方式去衡量？（只粗略地说了LCP，CLS，FID）9. 怎样去监控这些性能指标呢？（没深入了解过，说了lighthouse）10. 有用过浏览器的Performance吗？（没听过）11. 项目中会用一些什么样的手段进行性能优化呢？（聊了官网SEO优化）12. 为什么要做SEO优化，是基于什么问题呢？对性能有什么帮助呢？13. 预渲染的话预先渲染的是什么东西？14. 除了刚刚哪些还知道哪些优化手段吗？（没说好，其实方案挺多的）15. 提到了移动端安全区处理，展开说说吧，对性能有什么提升呢？16. 回到SSR的问题，你将项目从CSR转为SSR后，如何衡量这是一次性能优化而不是性能劣化呢？（答得不好，还是没具体了解过）17. 说说vue的渲染流程吧18. 提到了diff算法，说说vue3的diff算法吧（说的有点乱，感觉没说清楚）19. diff算法中，有key的情况下时间复杂度会是多少？（没深入了解，答得不好）20. 有key和没key的情况下会有什么区别（没深入了解，答得不好）21. 虚拟DOM对比真实DOM有什么优势吗？22. 操作虚拟DOM更快呢还是操作真实DOM更快？（对于虚拟DOM的理解还是不够透彻，没理解其本质和意义，面试官表示需要再学习一下批量更新）23. 说说vue中computed是怎么实现的？24. 说说vue3生命周期25. 在SSR的项目里面哪一个生命周期里面可以操作localStorage？26. 说说响应式布局如何实现27. 说说有哪些相对单位？28. 用过CSS变量吗？了解多少？（说了个主题色的例子）29. CSS里面有什么选择器？优先级说一下30. 相邻节点如何选择？还有哪些操作符？31. document.querySelector用的什么算法？（没了解过，但因为是树结构我说应该是深度优先搜索）32. 除了深度优先，遍历一个树还有什么算法？33. 算法题：lodash.get反问二面 （2.25）：面试时长（35min）1. 项目履历中最有挑战的一个，为什么你觉得这个项目有挑战2. 组件库是如何实现跨框架运行的3. 你这个组件库是基于ES Modules的，那遇到不支持ES Modules的浏览器怎么办？（没了解过...）4. 说说ES Modules，AMD，UMD以及ES Modules的区别5. UMD是怎么实现？为什么他能兼容兼容多种环境？（也没了解过...到这里这场面试已经凉了一半）6. 算法题：    （1）链表最后第 k 个结点     （2）hardman（磨磨唧唧没撕出来，面试彻底凉透）反问（已经不好意思问啥了，就随便问了业务和后续流程）

概括过去一年跳槽了两次，最近的一年都在面试，失败了很多次，也拿了很多offer，腾讯，字节，虾皮，滴滴都oc，最终人生的第三方份工作选择了腾讯，工作空闲之余，把最近一年的面经整理一下。联系我wx：Chan-FE 可腾讯内推～抖音二面面经介绍项目亮点，负责的模块webpack升级过程做了哪些优化，提升了多少，具体的指标三种哈希的使用区别是什么，为什么css使用contenthashwebpack升级优化过程中踩了什么坑，或者说两个版本差异需要注意的地方除了这些还有别的优化手段嘛，用到的没用到的都可以说一下webpack热更的原理websocket的原理TLS握手的过程对前端安全方面的理解简单请求...

没有投搜索突然发了面邀，可能是被hr捞的吧受大罪了上来问项目，正好有个大数据处理的前端项目，简单说了一下实现的分页和懒加载，面试官说重复了，没啥这样做的必要然后就跟着问有什么更好的处理方法，一开始说了下缓存，然后面试官说不要轻易缓存，非常危险，还有呢？我：；又简单说了下suspense骨架屏那种，但面试官觉得在背八股；问我具体到交互上有什么更好的优化策略，直接蒙住了；最后说了个滑动的加载区间来处理，面试官说明白我这种奇思妙想，然后问我知不知道大数据已有的成熟策略，我：不知道然后随便问了个let const var就开始写算法题之字形遍历二叉树 这个倒是写上来了最后问了下面试官是做大模型搜索这块的，属于是正好撞上了。一共面了半小时结束，应该不用等后续了

饿了么前端笔试一、HTML 与 CSS简述题：请解释 HTML5 语义化标签（如<header>、<nav>、<article>、<section>、<footer>）的作用，以及在实际项目中使用它们的好处。布局实现题：使用 CSS Flexbox 布局实现一个页面结构，要求包含一个顶部导航栏、中间主体内容区（分为左右两栏，左栏宽度为 25%，右栏宽度为 75%）和底部页脚。请写出 HTML 结构和 CSS 样式代码。样式问题排查：给定一段 HTML 和 CSS 代码，其中存在样式显示不符合预期的问题（例如元素间距异常、文本颜色未生效...