字节 生活服务 一面 凉经

省流：无八股，四十分钟项目输出，二十分钟笔试题 + 反问面试体验最满意的一次，虽然开头细细的讲项目细节导致节奏有点慢了，只讲出了两个核心，还有两个核心没讲，但面试官很耐心的听完并跟我确认上下文细节，下次继续优化- 自我介绍- 挑一个简历上最值得讲的项目开始表演  - 背景介绍（某游戏 mod 开发组前端成员，主要负责一些页面制作宣传的需求，后期组内其他成员提出 wiki 制作需求，开始了调研之旅）  - 主流 wiki 框架（语法晦涩难懂，开发者需要时间去学习成本；使用 mdx 可以无压力上手 + 需求/问题快速沟通解决；Astro 我有实践经验，阅读过核心 api 源码，知道底层实现与扩展/局限性）  - 反问了一下这个项目什么时候开始做的：第一版落地时间周期（去年5月调研，7月开始第一版开发，9月落地，到12月前长期维护 + 新功能上线）  - 第一版落地后遇到的问题（项目结构混乱，非业务核心代码与核心混在一起，网站无法进行复用）  - 解决方案（采用 monorepo，重新梳理整个项目业务核心逻辑与周边生态逻辑，进行归类划分并确定职责和要暴露的接口）  - 成果（项目职责分离（解包，语法检查，wiki 核心，组件库，针对不同 ide 的检查适配器）对整个项目有了个更好的认知，知道整个项目的进展和状态）  - 带来的新问题（此时已经半小时了，面试官让我挑2点最大的问题（不同包之间没有权限区分；一些历史遗留插件没法及时迁移，付出了一定开发成本）其实这里可以讲一下代码复用，参考了 Astro Starlight 项目落地后发现全局 Astro 特性被局限至仅 集成暴露 api；部分 api 使用后效果不一样（Astro 官方给出了解决该问题的实验性特性））- 网站访问量多少（不多，算是技术能力锻炼产品和圈子内的服务用产品）- 是不是 minecraft 的发烧友（还真是，高中就喜欢玩珍珠炮，并且从里面开始接触到编码解码概念和一些二进制理论）- 笔试  - 版本号排序（后续讨论了一下健壮性和 plus）  - Promise.all 实现  - 写一个后台管理系统的侧边栏组件，伪代码即可（顺便聊了一下 vue compiler 的 props 宏展开）  - 本来还有第四题，面试官说不用了，直接开聊（以为会问 Promise 顺序，他说他不喜欢考这些，然后聊了一下 Promise 内返回 Promise 的问题，涉及到 v8 以及 ecma resolveThenableJob 规范，不过面试官似乎不是很了解这里）- 反问  - 我需要提升的地方（计算机四大件别丢了，讲的很认真）  - 部门主要技术栈（react，然后就是要了解一点 node，不用做开发，nginx了解即可，吧啦吧啦的，后续忘了）  - 新技术会用吗（会做研讨会和研究，不过更多是基建部门负责，他们会看手册学习并尝试在小项目落地）  - 主要业务（搜索中台，技术 + 业务结合部门？面试官好像一时也没法彻底讲清楚）  - 部门压力大吗（不算大（真的吗））  - 入职要注意的事情（需要两个月进行磨合，因为有些事情可能没有给到完整上下文就让你做，需要自己翻手册或找 mentor 问，流程清楚后就轻松了，后面一堆不记得了）  - 转正？（会给，但是看分到的名额，说25届留了两个实习生，刚好两个名额就全给他们了，然后细细的讲了一下转正前会给你的各种通知和要做的事情）  - 就面试来说有啥需要改进的地方（笔试侧边栏组件你可以做的更好点，抽象级别可以更高点，加强一下基础框架学习使用）体验最好的一次，唯一的遗憾就是讲细节太多了，还有一些核心没讲出来。其他我都很满意，1 小时后收到了三面时间选择通知许愿三面能遇到像这样体验这么好的面试官

前端小厂二面，感觉没想让我好好回答的！ 提示：工资10k左右 还在996的发源地！#你都收到了哪些公司的感谢信？##你的实习什么时候入职##牛客创作赏金赛##非技术求职现状##找工作，你会甘心进小厂还是猛冲大厂#为什么vue用数组，react用链表为fiber架构？什么时候使用关系型数据库，什么时候使用nosql数据库？For... of和正常的for的循环方式有什么区别？ For of没有索引下标，怎么知道下一个？Async await基于什么去做封装，实现异步变为同步呢？redux数据流不是单向会造成什么不太好的地方？react里面哪里使用闭包？协商缓存和强缓存分别有什么字段？http2为什么比http1.1快很多？什么情况使用git rebase? Git cheyyerry-pick?场景题目：react项目中有上下左右中间各1个组件，共5个组件，点击中间的组件，其他四个组件也接收到点击事件返回的数据，这些组件和中间组件没有一定的联系，这种情况下怎么去做？

一面 11.28- 自我介绍- 现在的最新的es版本是哪个版本- 说一下你认为es更新的最有意思的部分 说了异步- 说一下Promise- fetch如果不返回promise怎么捕获错误- 说一下数组的api- 哪些会返回新数组哪些只修改原数组- 手写：用reduce完成一个map- 说一下vite和webpack- vite打开页面为什么会有点慢，是因为什么- 按需加载会出现什么问题导致打开页面速度慢- http1.1和http2的区别- http1.1限制了一个域名最多发几个请求- 讲一下jwt，不是库方法，而是token的构成- 数据库三范式- 手写：列表转树- 线程与进程- 死锁- flex布局和grid布局- 盒子模型，想听更深层次的- z-index怎么理解- 如果子元素距离根元素距离不一样，z-index也不一样，怎么判断他们的优先级第二天通知一面过二面：1. 自我介绍2. http缓存3. 左右各固定100px的三栏布局怎么设置4. 如果中间设置flex：10还能实现吗5. js数据类型6. js判断数据类型的方法7. new的过程8. map和对象的区别9. 讲一下vue的响应式原理10. vue2和vue3的区别11. 讲一下promise12. 手写promise.all挂了啊啊啊啊，有点太紧张了

省流：无八股，项目输出 + 性能优化疯狂拷打 + 场景题- 自我介绍- 为什么学前端- 什么时候开始学的- 看你项目还挺多，挺多方面都有涉及的，node 学的怎么样（仅基础，rust 写的那部分后端可能还多点）- 平时怎么学（从实验室给的路线发展到自己看文档查资料，会主动关注新 api）- 关注新 api？举个例子（用我博客的 content collection api 举例子，翻了 rfc 文档，对着英文生肉硬啃）- 最近科技周报看了啥，举个例子（rspack，阮一峰谈发展 ai 的公司，还有自己想在项目落地实践 ai）- 为什么想要实践ai，你是想在自己项目的哪里实践？（原来的开发者想更专注于核心开发；词条内容编写，让 ai 写雏形，自动生成框架，我们按需补充（其实有个点没谈到，就是有些内容需要编写者阅读过源码才知道机制，ai 写可以节省一部分时间；其次是语义检查，看看是否符合人类阅读习惯））- 看一眼你的后台（演示了一下基本内容，是 monaco 做的）- 讲一下选 Astro 的原因（调研现有 wiki 框架发现不适合，学习成本高；横向对比 VitePress VuePress，局限使用于 vue，扩展性开发难度较高；从 Vite 或者 Nextjs 开始写的话基建要做很多东西，一时看不见效果；页面样式自定义要求程度非常高，css 几乎都是手写；Astro 基于 vite 封装，帮我们做好了很多事，且具备 vite 大部分能力；阅读过内容集合 api 源码，知道扩展性和局限性（其实还有很多可以说，不过脑子一热忘了））- 有试过什么优化手段吗（开始拷打）  - CSS 规范，强制要求所有元素尽可能有个固定宽高，避免 CLS  - 某些显隐采用 visibility + pointer-events 处理，避免重排  - 后台部分使用 `manualChunk` 分包（面试官让我打开项目看看分包结果，然后就对着页面的请求在那里讲自己的分包思路）- 接下来从开发过程，打包编译，网络传输，首屏展示四个方面聊聊你知道的优化，越多越好  - 开发过程扯了一下 vite 全局定义 `__DEV__` 变量，然后把仅开发逻辑放在这里头，编译过程会移除（其实可以再讲讲引入路径规划，做一个强隔离，项目后台就是对每个页面进行强隔离，保证逻辑无关联，这样分包函数可以针对每个页面打包成一个 css + js，避免过多网络请求），还有 await import 作为分包点  - 打包编译讲了 terser 的上下文分析，分析 dead code 的存在和不必要的逻辑进行移除；其次是避免桶文件 + rollup 静默打包（桶文件在项目中真实出现过，打包整个 mui icon 导致打包时间 + 2min，面试官当场提问最终这些会被打入包内吗（不会，会做 tree shaking）；静默输出则是因为 mui 组件都写了 'use client' 导致 rollup 警告大量占用控制台输出间接导致打包时间下降，面试官继续提问如果我不让你用静默怎么办，见我不知道就说了可以写插件去直接替换底层方法，不过感觉不算太严谨（逃））；聊了一下通过插件移除指定注释下的代码（类似 rust 注解）（其实可以再讲讲语法转换，即向低版本的 js 代码进行兼容处理，即 tsconfig 的 target 选择）  - 网络传输用了项目从 http1.1 升级到 2.0 避免一个对头阻塞的问题（顺便牵扯到 tcp 阻塞，讲了一下前面的包没到后面的都得等），还有 3.0  - 首屏的话则是聊了一下 script 标签的 async defer 去避免 dom 解析阻塞，还有内联资源，扯了一下 tcp 拥塞控制的一个算法算出来首屏 css 控制在 14.6 kb 内，不过没讲出原理；顺便聊了一下我的博客，他的夜间模式 js 是放在 async 内执行的，面试官马上知道了会有闪烁问题，然后我就说在 html 前面写了一个阻塞 script 去修改 cssom 树，避免了闪烁- 场景题，现场设计一个 PC 登录扫码功能，PC 要有消息同步功能（1. PC 向服务器请求登录 token 并展示到二维码内，随后使用轮询或者 ws 等待状态 2. 手机扫码，获取 token 后发送到服务端，服务端改变状态 3. 通知 PC 可以登录了，由 PC 主动去请求个人信息）（中间扯了中间人攻击，包阻断，重放攻击；根据操作系统生成唯一标识符，mac 地址等）（感觉最核心的还是各种安全细节和登录成功后的消息同步功能，如何保证数据一致性）- 最后十分钟试试 IntersectionObserver，现场投屏写（前面聊了一下图片懒加载跟面试官说使用原生 loading lazy 和缺陷，面试官就反问有没有用过（没有）；最后没写出来，但是面试官看完思路说大致没错，改改细节就可以了）- 反问  - 是日常实习吗（是）  - 您负责的内容（leader，项目负责人）  - 部门主要业务（搜索中台 + 大模型，顺便提醒我可以去学习一下看看真实项目怎么落地的）  - 就个人来说要怎么继续提升自己（去一下更大的平台，学习一下企业是怎么管理的，以及整个 workflow 的实现；就我的项目举了一些例子，我自己一些自研的地方其实有插件去帮助实现）  - 压力算大吗（经典话语）  - 实习时长（希望越久越好）  - 面试有什么需要改进的地方（还可以，主要是有自己的特色）