面了一次字节前端岗，我才知道何为“造火箭”的极致！

大厂是每个前端开发奋斗的最高理想，也是每一个程序员的至高殿堂，应该没有那个程序员是不想去大厂的，然而大厂的难度也不是轻松可以通过的，今年的金九银十，身边朋友也是有很多人以大厂为目标去面试，但是通过的往往是寥寥无几，我也是其中之一

具体面经如下：

1、vue2 vue3区别

setup生命周期都做了哪些事情

minix为什么有污染问题minix的生命周期和组件生命周期哪个先执行minix的原理

vue3的大vue实例

改写数组原型的方法有几种方式

为什么vue2中不能监听到对象的添加和删除

2、浏览器的事件循环和node事件循环的区别

3、vite和webpack webpack怎么做多进程打包

模块化的规范和发展历程

import和requie的区别代码中如果引入不存在的文件哪个构建时会报错（编译时import会报错）

require运行时会报错

4、继承的几种方式extend中怎么调用父类构造函数

5、render和jsx的差别vue怎么写jsx

6、浏览器一帧会有哪些工作

都哪个流程可以优化

缓存有哪几种怎么设置etag是怎么生成的什么时候改变

http1.1和http2区别http2每个连接都要重新握手吗

http3有什么改变

react和vue区别react是mvvm吗

ts和js浏览器支持ts吗node支持ts吗编译过程使用过哪些node中间件

node服务端部署流程

jenkins工作流部署时配置了哪些工具如果有个性化配置怎么做

说项目重点难点

做过哪些优化方面的工作性能优化架构优化流程优化

说说一些前端规范如果老项目新规范怎么统一校验

大数据的渲染虚拟滚动最多支持多少数据大数据滚动卡顿怎么解决cavans可视区绘制用什么api

视频流的格式有哪几种视频流怎么做回放

服务端推送数据到前端的几种方式

普通socket和websocket区别

qiankun隔离原理iframe通信方式

sentry的错误收集的原理能收集到跨域吗

使用过哪些AI工具有写过mcp吗

反问环节

https://github.com/encode-studio-fe/natural_traffic/wiki/scan_material5

以上就是面经的整理

面试八股及原理

JavaScript 面试题

相比于npm和yarn，pnpm的优势是什么？
如果使用Math.random() 计算中奖概率会有什么问题吗？
怎么使用js实现拖拽功能？
举例说明你对尾递归的理解，以及有哪些应用场景
说说你对 Iterator,Generator 和Async/Await 的理解
前端跨页面通信，你知道哪些方法？
说说你对模块化方案的理解，比如CommonJS、AMD、CMD、ESModule分别是什么？
JavaScript脚本延迟加载的方式有哪些？
怎么理解ES6中Generator的？使用场景有哪些？
导致页面加载白屏时间长的原因有哪些，怎么进行优化？
微前端中的应用隔离是什么，一般是怎么实现的？
JavaScript对象的底层数据结构是什么？
浏览器和Node中的事件循环有什么区别？
版本号排序
哪些原因会导致js里this指向混乱？
怎么实现大型文件上传？
说说你的ES6-ES12的了解
Promise的 finally怎么实现的?
怎么使用js动态生成海报？
异步编程有哪些实现方式？
AST语法树是什么?
JS内存泄露的问题该如何排查？
实现mergePromise函数
async、await实现原理
使用Promise实现：限制异步操作的并发个数，并尽可能快的完成全部
怎么实现一个扫描二维码登录PC网站的需求?
说说你对pnpm的了解
js中的倒计时，怎么实现纠正偏差？
深拷贝浅拷贝有什么区别？怎么实现深拷贝?
说说sourcemap的原理？
JavaScript中的sort方法是怎么实现的?
什么是PWA?
写出一个函数trans，将数字转换成汉语的输出，输入为不超过10000亿的数字。
你是怎么理解ES6中Proxy的？使用场景有哪些？
Promise中的值穿透是什么?
你是怎么理解ES6中Decorator的？使用场景有哪些？

React.js 面试题

fiber架构的工作原理？

React Reconciler 为何要采用 fiber 架构?

useState是如何实现的?

React Fiber是什么?

简单介绍下React中的 diff 算法

如何让 useEffect 支持 async/await?

React 中怎么实现状态自动保存(KeepAlive)?

React Fiber 是如何实现更新过程可控?

react中懒加载的实现原理是什么?

React有哪些性能优化的方法?

不同版本的 React 都做过哪些优化?

React19新特性

说说你对 React Hook的闭包陷阱的理解有哪些解决方案?

React 中，怎么给 children 添加额外的属性?

Fiber 为什么是 React 性能的一个飞跃?

Vue.js 面试题

Vue 模板是如何编译的
vue3 相比较于 vue2，在编译阶段有哪些改进?
说说Vue 页面渲染流程
Vue 项目中，你做过哪些性能优化?
如果使用Vue3.0实现一个 Modal，你会怎么进行设计?
Vue3.0里为什么要用 Proxy API替代defineProperty APl ?
Vue 有了数据响应式，为何还要 diff ?
说说 vue3 中的响应式设计原理
说说 Vue 中 css scoped 的原理
vue3 的响应式库是独立出来的，如果单独使用是什么样的效果?
手写 vue 的双向绑定
什么是虚拟DOM?如何实现一个虚拟DOM?说说你的思路
说下Vite的原理

Node.js 面试题

浏览器和 Node 中的事件循环有什么区别?
如何实现jwt鉴权机制?说说你的思路
怎么进行 Node 服务的内存优化?
为什么Node在使用es module时必须加上文件扩展名?
说说Node中的EventEmitter？如何实现一---个EventEmitter?
说说Node文件查找的优先级以及Require方法的文件查找策略？
两个 Node.js 进程如何通信?
pm2守护进程的原理是什么?
单线程的 nodejs 是如何充分利用计算机CPU 资源的呢?
body-parser 这个中间件是做什么用的?
说说对中间件概念的理解，如何封装 node中间件?

Typescript 面试题

什么是TypeScript Declare关键字?
Typescript 中的 getter/setter 是什么?你如何使用它们?
unknown 是什么类型?
never 是什么类型，详细讲一下
如何在TypeScript中实现继承?
说-说Typescript中的类及其特性。
请实现下面的 sleep 方法
Typescript中的方法重写是什么?
typescript 中的 is 关键字有什么用?
什么是Typescript映射文件?
Typescript中的类型有哪些?
Typescript中interface 和 type 的差别是什么?

编程题面试题

实现深拷贝
请手写"堆排序"
虚拟 dom 原理是什么，手写一个简单的虚拟 dom 实现
请在不使用 setTimeout 的前提下，实现setinterval
实现JSONP
实现一个类，其实例可以链式调用，它有一个sleep 方法，可以sleep一段时间后再...
编写一个vue组件，组件内部使用插槽接收 外部内容，v-model双向绑定，实现折叠...
版本号排序
Promise 的 finally 怎么实现的?
实现 Promise
字符串解析问题

工程化面试题

说说你对前端工程化的理解
webpack loader 和 plugin 实现原理
为什么 webpack 可以通过文件打包，让浏览器可以支持 CommonJs 规范?
webpack tree-shaking 在什么情况下会失 效?
微前端中的路由加载流程是怎么样的?
说下Vite的原理
说说你对 source Map 的了解
说说webpack的构建流程?
ES6 代码转成 ES5 代码的实现思路是什么?
webpack的module、bundle、chunk分别指的是什么?
webpack treeshaking机制的原理是什么?
为什么 SPA 应用都会提供一个 hash 路由好处是什么?

项目细节难点

60.你做的项目中都使用过哪些中间件呢？

61.你在开发过程中有什么因难点（或者使用了什么技术）

62.会写接口吗？项目你负责什么？

63.你之前做过小程序吗？主要包括哪些功能？

64.这个小程序的具体设计逻辑是怎么样的？有几个人开发？周期多长？在你离职时，这个小程序项目是否还在开发？或者你离职时，你们公司在开发什么？

65.你说你负责支付环节，那么微信支付的流程是否可以简单说一下?

66.那好，既然流程说完了，那么，我问你，你这个项目涉及到了mb，它在用户点击支付之后的逻辑关系和表关系你是怎么理解的？有多少张表？表关系？

67.你觉得这个小程序项目的细节之处有哪些?

68.如何自定义tabbar?

69.你刚才提到了异步，在这个项目中你是否被异步坑过，最后又是如何解决的？

70.你能描述一下渐进增强和优雅降级之间的不同吗？

71.为什么利用多个域名来存储网站资源会更有效？

72.一个页面上有大量的图片（大型电商网站），加载很慢，你有哪些方法优化这些图片的加载，给用户更好的体验。

73.一个页面从输入URL到页面加载显示完成，这个过程中都发生了什么？

74.前端如何进行登录身份的判断

75.电商项目跟其它项目有什么不同？

76.实践题

77.项目开发中有遇到什么挑战没？

78.项目研发流程中作为前端开发一般扮演的啥角色？

79.现在有的项目中觉得哪些项目可以继续优化，为啥没有优化？

80.平时写项目总结么，一般总结哪些东西？

场景面试题

怎么在前端页面中添加水印？
如何封装一个请求，让其多次调用的时候，实际只发起一个请求的时候，返回同一份结果
web网页如何禁止别人移除水印
react中怎么实现下拉菜单场景，要求点击区域外能关闭下拉组件
React 如何实现vue 中 keep-alive 的功能?
如何监控前端页面的崩溃？
如何搭建一套灰度系统？
如何在前端团队快速落地代码规范
前端如何实现即时通讯？
用户访问页面白屏了，原因是啥，如何排查？
如何给自己团队的大型前端项目设计单元测试?
如何做一个前端项目工程的自动化部署，有哪些规范和流程设计？
你参与过哪些前端基建方面的建设？
假如让你负责一个商城系统的开发，现在需要统计商品的点击量，你有什么样设计与...
前端怎么做错误监控？
token过期后，页面如何实现无感刷新？
如何解决页面请求接口大规模并发问题
web应用中如何对静态资源加载失败的场景做降级处理？
什么是单点登录，以及如何进行实现？
SPA首屏加载速度慢的怎么解决
站点一键换肤的实现方式有哪些？
实现table header 吸顶，有哪些实现方式？
怎么实现扫码登录？
如果用户说web应用感觉很反应慢或者卡顿，该如何排查？
如何设计一套统计全站请求耗时的工具
你是怎么理解前端架构的？
怎么分析页面加载慢的原因？
为什么在技术选型中选择了webpack?
如果想在小程序中嵌入markdown的文档，你有什么思路？
前端如何实现截图？