2023 面经

小红书一面

面试官之前是在腾讯文档工作的，所以算是懂文档领域，聊的比较来

1. 在实习期间都做了哪些事情？
2. 聊渲染引擎的落地场景
3. 如果我是一个技术 Owner，在开展项目前，我会做哪些准备？
4. 聊腾讯文档 Canvas 化的路程
5. 如果限制让我来解决文档的性能瓶颈，我会怎么做，怎么调研？
6. 文档领域是非常有挑战性的，为什么想要来小红书呢？
7. 有了解过微前端吗 qiankun？
8. Vue 和 React 都引入了 Hooks，Hooks 带了哪些好处呢？
9. 有用过 RN 吗？
10. 你知道 Koa 的中间件是怎么运作的吗？
11. 来上海可以吗，实习时间？

反问：

1. 面试评价
2. 怎么跳出文档领域的怪圈
3. 小红书公司文化
4. 给我一些面试下一轮的建议

小红书二面

电商 leader 面

1. 在工作室做的是什么项目？
2. 看到你有配置 lint 的规则，主要有哪些呢？
3. 封装了 axios 为统一请求函数，具体封装了哪些呢，还能做哪些封装
4. JWT 的原理？鉴权系统是怎么设计的？
5. 懒加载是怎么做的，有没有做统一的 loading？
6. 虚拟列表是怎么做的？
7. 看到你有用过 webpack，webpack 有哪些配置？
8. loader 和 plugins 有什么区别？
9. 用过哪些 plugins？
10. 发包的时候 webpack 都做了什么，生成 dist 都做了什么？
11. 在实习期间做了什么工作？
12. 为什么要用 canvas，canvas 有什么好处吗
13. canvas 能比 dom 好多少的 benchmark
14. dsl 和 dom 的有什么区别
15. devtools 的检查功能实现，是全文更新吗
16. 我自己扯的 react diff 的缺点 和 我们 O1 的 diff
17. 滚动卡顿 canvas 是怎么解决的
18. 想要做哪部分的工作
19. 算法题 翻转二叉树

反问：

1. 问了组织架构

小红书 HR 面

1. 现在是已经离职了吗？
2. 聊了一下大学规划，学习？
3. 在字节这么久了，为什么想出来？
4. 工作主要做什么
5. 从入职到正式做项目花了多长时间
6. 工作中遇到最大的挑战是什么
7. 压力最大的时候是什么？
8. 聊了负责的项目啥的？
9. 让你觉得最印象深刻的事？
10. 你觉得你的优点是啥
11. 那缺点呢 说话直接，口无遮拦
12. 那这个具体会怎么体现体现呢？
13. 在工作中会有影响吗？
14. 还有面试其他的公司吗？
15. 如果小红书给你发 offer 你会直接来吗？ 不会
16. 会继续面试吗？ 会

反问：

1. 你的角度觉得小红书公司怎么样？

腾讯小游戏一面

1. 为什么要用自研的 DSL 呢？主要为了解决什么问题呢？
2. 能举例一个原语吗？它带来的一些优化？
3. 在做自建 DSL 的时候，有没有了解过业内的一些相关的实现呢？
4. devtools 状态回滚和重放的能力，可以说一下这个模块具体的实现细节吗？
5. 有个业务，它在线上也有一些问题，会怎么去追溯这些问题？
6. electron 开发遇到的难点？
7. electron 的进程模型？
8. 有没有对比过飞书文档的渲染性能和腾讯文档或其他业界渲染性能的比较？
9. debug 通过哪些方式？
10. 在列表渲染上遇到的性能问题是怎么样的？
11. 如何衡量长列表的性能，用什么指标？
12. 你平常浏览一个网站的时候会不会觉得体验不好，从哪个方向感知呢？
13. 前端在渲染耗时上的优化，有什么方案呢？
14. 浏览器渲染流程
15. 优化首屏渲染速度 会从哪些方向实现？那网络上有哪些优化的吗？
16. canvas 怎么做 SSR?
17. websocket 整个的握手过程？
18. http2 和 http3 特点和区别?
19. rollup 和 webpack 的区别?
20. 哪些方式优化项目的构建速度?
21. monorepo 和 ployrepo 的区别？
22. ChatGPT 给工作生活带来了什么变化？
23. 你感觉现在的团队怎么样，比较喜欢哪一点？
24. 为什么学习前端，不学客户端，后台？
25. http 为什么慢 udp 握手 怎么做的？
26. 哪些方式优化 网络耗时？
27. 前端网页加载流程？

B 站一面

1. 纯 Canvas 做的吗？没有用什么第三方的库吗？
2. 有遇到什么比较麻烦，比较难的问题吗？
3. 介绍 Devtools 的一些功能
4. 为什么要用 WebSocket 进行 devtools 和浏览器内核通信呢？
5. 为什么要实现一个 Electron 终端应用？
6. 项目是自己搭建的吗？
7. 封装 Axios 做了哪些事情？
8. token 存到哪里？
9. 登录是你做的吗？为什么选择 JWT，而不是 Cookie 这些呢？
10. JWT 和 Cookie 有什么区别？
11. JWT 做的登录的话？退出登录怎么实现？
12. JWT 的生成规则是怎么样的？
13. 列表页面打开详情，是会跳到新窗口还是在当前页面打开？
14. 如果在当前页面直接打开详情页，再回退回来列表页，还能定位到原来的位置吗？
15. 如果分页了的话，怎么定位到原来的位置？
16. 虚拟列表是怎么实现的？
17. 如果是虚拟列表的话，那怎么回到原来的位置呢？
18. 如果说滚动很快的话，会怎么样呢？
19. 这里的滚动白屏有做什么操作吗？
20. 采用了懒加载，是哪些地方用到了懒加载？
21. 常用的 React Hooks 有哪些？
22. useEffect 和 useLayoutEffect 有什么区别？
23. useLayoutEffect 能获取到 DOM 节点吗？
24. useLayoutEffect 有什么应用场景？
25. useMemo 和 useCallback 什么时候会用？
26. 如果 useMemo 的计算只依赖了对象的其中一项，依赖项数组要写什么？
27. Promise 的状态有哪些？
28. Promise 的状态流向是怎么样的？调完 resolve 再调 reject 会怎么样？
29. Promise.all 和 Promise.allSettled 有用过吗？它们有什么区别
30. reduce 一般在什么地方用的比较多？
31. forEach 可以终止吗？如果想终止的话，怎么做？
32. 三层 for 循环，怎么从最内层跳到最外层？
33. React 的 useMemo 的对比依赖项，是怎么判断的，内部逻辑是怎么样的？
34. 内部有什么样的规则，来做前置判断
35. 在 Diff 的时候，判断这个标签能不能复用，这个判断逻辑是怎么样的？
36. props 是如何判断相不相同？如果是你，你会怎么来判断 props 相不相同？
37. key 一样就一定会复用吗？
38. 协商缓存由哪些头去做这些事的呢？
39. 强缓存呢？
40. 304 是什么？
41. 来上海愿意吗？计划什么时候来？
42. TS 有用过吗？熟悉吗？
43. 对 Electron 有什么了解吗？

反问：

1. 企业效率做的是什么呢？
2. 自我介绍一下？你刚刚没介绍

欢聚一面

体验很差，面试官一上来就丢几道题让我做，而且面试官的提问很没有水平，问的很不专业

1. Flex 布局的宽度计算，涉及到的是 flex-grow flex-shrink
2. 箭头函数和普通函数，作用域相关的题目

const a = 13;
const obj = {
  a: 10,
  b: () => {
    console.log(this.a);
  },
  c: function () {
    console.log(this.a);
    this.b();
  },
};
obj.b();
obj.c();

3. promise then 的链式调用，输出什么

Promise.resolve("a").then("b").then(Promise.resolve("c")).then(console.log);

4. TS 的题，把下面这个函数改正确

function getProperty<T, K>(obj: T, key: K) {
  return obj[key];
}

一边解释题目一边问相关的问题

1. 箭头函数和普通函数区别
2. new 的时候发生了什么？
3. 箭头函数可以被 new 吗？
4. 如果被 new 的这个函数，里有 return，那么 new 返回的是什么？
5. promise.then 的参数，如果是一个定制，会被跳过吗？
6. promise.then 这个方法接收什么参数？
7. 你可以讲讲 Promise.then 这个方法吗？？？？
8. 讲讲你对它的理解，如果让你自己写一个的话，你会怎么写？
9. 富文本渲染引擎，这个东西是做什么的？？（我无语了，你问的什么东西，切图仔）
10. 那你负责哪块工作呢？（我说完，它说了个 OK）
11. 用过 React 是吧？你可以讲一下 React Fiber 是什么吗？
12. 它是怎么实现时间切片的？
13. 你可以讲一下大概的流程吗？
14. 你们自研的 Devtools 工具和 Chrome 的 Devtools 有什么区别？怎么模拟 netWork，怎么模拟元素选择？
15. 如果有几个元素叠在一起的话，那你会怎么选？
16. 还有其他功能？
17. 为什么要选择离开飞书？
18. 你接触前端多久了？

反问：

1. 这边大概是做什么方向的工作的？
2. 我去的话，大概会做什么样的工作呢？

腾讯计费一面

刚面完欢聚，腾讯就又把我捞起来了，面完一个星期都没结果，估计寄了，但面试感觉非常好

1. 你怎么回事，大二就开始实习吗？学习怎么兼顾？在校远程还是什么？有没有挂科？
2. 怎么接触到前端的呢？怎么学习的呢？
3. 主要在哪个社区上写文章呢？有 github 的项目吗？
4. 聊了一下做过的项目？
5. 你可以举个例子说说你在这个项目中遇到的比较大的挑战点是什么，后面是怎么解决的？
6. 你刚刚有讲到性能优化，比如长列表渲染的虚拟滚动你是怎么做的？
7. 如果让你来搭建一个项目的话，你会做怎么样的工程化？
8. 举例说一下你写的 node 脚本，怎么提高工作效率？
9. 写题：data 输出对应的格式
10. 写题：大数相乘，说思路

反问：

1. 可以介绍一下这个部门吗？
2. 实习生有哪些技术挑战的地方吗？
3. 这边的技术栈是怎么样的？

发现才问了几个问题咦，面试了 45 分钟左右吧

欢聚二面

1. 为什么想找新的实习工作？
2. 挑个你做过的项目，简单介绍一下
3. 做的这个工具是给谁用的？
4. 这个工具做了多久，有多少个人用？
5. 开发的过程中有碰到什么技术难题吗？
6. 这个工具代码量有多大？你写的有多少？
7. 这么多代码怎么保证它的质量？有测试吗？
8. 问项目经历里的，前端一般登录怎么做？
9. JWT 的原理，登录状态是怎么维持的？
10. 和 cookie 相比，有什么优缺点吗？
11. 2 个域名，怎么实现登录状态的维持？
12. 你做的前端项目是部署在什么服务器上的？
13. 有没有用过 CDN，CDN 部署需要注意什么东西？
14. 有一部分资源在 CDN 有部分不在，怎么保证同步？
15. Web 方面会有什么安全性的问题？
16. 域名劫持怎么解决？
17. 你了解 https 的加密流程吗？
18. 前端什么时候开始学习的？

反向：

1. 主要是做什么项目的？
2. 给一点面试经验

cider 一面

面试官很可爱，很聊的来

1. 解析一下 颗粒化实时更新 的功能，怎么实现的？
2. 说一下你对 JS 是一个单线程语言的理解吧？
3. 异步和同步的概念是什么？
4. Promise 是为了解决什么样的问题的？
5. 输出顺序的题目
6. 说说你用过的 hooks
7. useLayoutEffect 和 useEffect 的区别
8. 回调在什么时候执行？
9. 代码题。sku 转换

反问：

1. 这边的业务是做什么的呢？
2. 有考虑做 app 吗？
3. 近仓退货的流程是怎么样的？

cider 二面

1. 现在是在职吗？为什么想出来换一下？
2. 前端团队大概有多少人？
3. 为什么学习前端？
4. TCP 协议是如何保证它的可靠性的？
5. 自己负责的项目或者是开源项目里面，你觉得印象比较深的部分？
6. 介绍一下富文本渲染引擎是什么？
7. 你自己做了哪块东西？
8. 写题：写个天气预报的组件，接口自己找

反问：

1. 主要是做什么的呢？

cider CTO 面

1. 这一年中你解决过印象最深的一个 Bug 是什么？或者是印象最深的一个问题是什么？
2. 为什么选择做前端工程师？
3. 在实习工作中，哪些是和你预想一样的，哪些是不一样的？
4. 那为什么现在考虑想要再找一个其他的实习呢？
5. 你对我们了解多少，为什么想要加入我们？

腾讯计费二面

1. 你能说一下做渲染引擎这件事情，对一个前端工程师这个项目有什么亮点吗？
2. 做渲染引擎用的是什么技术栈？
3. 做这样一件事情的目的是为什么呀？先说说为什么要做渲染引擎，再说说为什么要做自定义原语？
4. 刚刚说到了对 W3C 规范的裁剪，来提升文档场景的性能，文档场景到底是遇到了什么性能问题？
5. 虚拟滚动是怎么实现的，具体的技术原理是什么？
6. 你觉得浏览器渲染引擎需要有哪些模块呀？
7. 这些都是你做的吗，你都有实践过吗？（这个问题很奇怪）
8. 说说 compute 部分你是如何实现的，如何达到你说的效果？
9. 你觉得做这样的 Devtools 工具，它的难点在哪里呀？（这个问题需要好好总结一下）
10. 说了 Devtools 的很多功能的实现，面试官打断问了一些问题
    1. 自定义 hooks 的展示是如何实现的
    2. tracing 是如何实现的？
11. 业界内有其他方法吗？说了 Chrome 的，你有用过吗，你有了解过它的实现吗？
12. 为什么要做自定义的 DSL
13. superlist 是如何实现到 O（1）的？
14. 你参与到原语的完善工作，能不能举个例子？（面试官觉得举的例子的复杂度不高，后续还要琢磨一下）
15. 你有做过前后端交互的项目吗？
16. 做前后端请求的时候，怎么调试的？
17. 对一个 HTTP 请求来说，你会关注哪些东西？
18. 缓存有什么要关心的？
19. 哪些东西需要做缓存？
20. 怎么衡量一个网站的性能？
21. 加载速度怎么衡量？
22. 怎么计算 JS 加载的时间？
23. 对于复杂的交互，做性能提升的话，要怎么做？
24. 来一个系统设计的题目？
25. 微信扫码登录的全流程设计？
26. 怎么知道是某个用户登录的？
27. 怎么保证二维码的唯一性？
28. 如果你遇到一些这样不懂的问题，你会去怎么解决它呢？

反问：

1. 先让面试官自我介绍了一下
2. 了解了一下业务

腾讯计费三面

是个女的面试官，人很好

1. 自我介绍（4 分钟）？
2. 框架代表性的 issue 问题是如何解决的？
3. 讲了 border 绘制的方式？
4. border 绘制异常的问题是怎么发现的？（e2e 和开发 outline）
5. e2e 实现的方案是什么？e2e 可以检测到样式吗？e2e 的用例有多少？
6. 还有一些是用户操作导致的变化，这种测试怎么做？（说了 cypress 然后说了 我们会模拟一套 querySelector api）
7. e2e 测试用例和单元测试用例的区别，什么时候用 e2e 什么时候用单元测试？
8. 还接触过哪些比较前列的测试方式呢？录屏测试有了解过吗？
9. 绘制一个矩形，绘制一个 a - b 的线段，用 canvas 怎么绘制？
10. canvas 是如何用到这些原生 API 的方法的？
11. 你对 DSL 的理解，为什么需要有这个 DSL？
12. DSL 的用户是谁，谁在用你们？怎么解决用户学习成本的问题？
13. 可以说说 Devtools 工具产生的原因，和你具体在里面做的事情吗？（5分钟）
14. 说说 Devtools 的节点是什么？
15. 采用了 Websocket 实现的具体场景是什么呢？从 Extension 到 CDP 到 electron 说了一遍
16. 是我们用的框架限制了 Websocket 还是说选型选了 websocket
17. 再深入的讲一下 websocket 和 http 本质的区别
18. 前面 35 分钟，后面开始做题了
19. 第一题：快慢指针，（2分钟）
20. 第二题：promise 执行顺序（没有思考）
21. 第三题：改写 ts，keyof typeof k，限制 key 值（5 分钟）
22. 第四题：基础的设计模式有没有了解，发布订阅怎么实现