2024年前端最新2 年前端面试心路历程（字节跳动、YY、虎牙、BIGO），前端基础开发

JavaScript 和 ES6

在这个过程你会发现，有很多 JS 知识点你并不能更好的理解为什么这么设计，以及这样设计的好处是什么，这就逼着让你去学习这单个知识点的来龙去脉，去哪学？第一，书籍，我知道你不喜欢看，我最近通过刷大厂面试题整理了一份前端核心知识笔记，比较书籍更精简，一句废话都没有，这份笔记也让我通过跳槽从8k涨成20k。

如果你觉得对你有帮助，可以戳这里获取：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

2 面

• 图片编辑器做的性能优化（以上）

• redux-saga 和 mobx 的比较

• • saga 还是遵循 mvc 模型，mobx 是接近 mvvm 模型

• 介绍项目为何要使用 mobx 更合适

• 由于是直播相关的 electron 项目，存在音视频流，和一些底层 OS 操作，那么我们是否可以以麦克风视图开关对于音频流的处理为例子，把 OS 的一些操作与数据做一个映射层，就像数据和视图存在映射关系一样，那么数据的流动就是 view -> 触发action -> 数据改变 -> 改变视图 -> 进行 os 操作

• 然后说了一下 mobx 大概实现的原理，如数据劫持，发布订阅。

• https 有了解吗

• • 简单讲了一下非对称加密的握手过程

• 证书签名过程和如何防止被串改

• 跨域有了解过吗

• • webpack-dev-server 原理和如何处理跨域

• nginx 转发

• CROS 中的简单请求和非简单请求

• 非简单请求下发起的 options

• localstorage、sessionStorage 和 cookie 的区别

• cookie 跨域时候要如何处理

然后就开始做题：

• 70. 爬楼梯

技术征文图

（又是 5 分钟写完）

• 面试官：那我们改编一下题目，改成 746. 使用最小花费爬楼梯。

技术征文图

• 我：修改一下之前的答案，很快做出来。

• 面试官：还有点时间，我们再做一题稍微难一点的 72. 编辑距离

技术征文图

我：这题居然说稍微难点？？？还好之前做过，那方法真的不是一般人想得出来。然后又做出来了。

面试结束了，感觉都是在做题。

3 面

• 自我介绍

• 介绍项目

• electron 的主进程，渲染进程之间区别和他们通信手段

• • ipcMain、ipcRenderer

• localStorage

• webView 和 Iframe 区别

• • webView 应用和嵌入内容之间的交互全部都是异步的

• 应用和嵌入内容之间的交互全部都是异步的

• 你这个 PC 应用做了哪些优化

• • 录屏优化

• 大型文件上传优化

• 用 mobx 重写之前的 redux-saga，引入 os 层概念

• electron-update 失效紧急处理办法

• 大型文件上传

• • 文件切片

• 用 web-work 单独线程计算文件的 hash 值

• 上传由于和其他接口同一域名，所以要做并发数处理

• 进度条

• 对于已经传过的文件进行跳过秒传，对于失败做失败重传处理

• 然后有说了一下感觉还能改进的地方

• 要发挥 electron 能使用 node 的优势，文件切片，hash 计算和上传都可以用 node 实现，并且开不同的进程处理。由于上传是用 node 模块，不会有浏览器同一域名下 6 个连接的限制。为何没做，因为在写别的更加紧急的东西。。。。

• 录屏优化

• • 需要对整个屏幕进行录制

• 对比了 FFmpeg 和 mediaSource 的性能差异，如 CPU 和内存消耗

• 又对比一下 mediaSource 的各种编码性能差异 vp8、daala、h264、opus 和 mpeg

• 一开始是把视频流写在一个变量里面，这样会造成很大的性能问题

• 解决办法是每个 10s 把流用 node 的 file 写在硬盘里面，然后结束录制时候，把每个 10s 的小视频片段用 FFmpeg 合成一个大的文件

开始做题，做了一题比较偏冷的题目，看概念我都要理解几分钟的。