入职宇树Web前端开发，30K双休有点爽

投稿：

第一轮技术面（JavaScript 核心 + 浏览器原理 + 前端框架底层）

本环节重点考察 JavaScript 语言特性、浏览器渲染机制、框架原理等深度知识，是社招筛选的核心门槛

1.JavaScript 闭包的形成原理、应用场景与内存泄漏防范

2.
Event Loop 机制（宏任务/微任务）与 async/await 的底层实现

3.ES6+
常用特性（
Promise、Generator
、Proxy 等）的实现原理与应用场景

4.JavaScript 内存管理机制（标记清除、引用计数）与垃圾回收策略

5.this 指向的四种绑定规则及手写 call/apply/bind 实现

6.原型与原型链的本质，Class 语法糖的底层原理

7.跨域问题的多种解决方案（
CORS、
JSONP、postMessage 等）与安全考量

8.浏览器渲染流程（
DOM 树构建、
CSSOM、
布局、
绘制、合成
）与重排/重绘优化

9.前端模块化演进（
CommonJS、AMD
、ES Module
）与打包工具原理

10.TypeScript 类型系统设计、泛型应用与工程化实践

11.Vue 3 响应式原理（Proxy 与 Reflect）与 Composition API 设计思想

12.
React Hooks 的实现机制与自定义 Hook 设计原则

第二轮技术面（工程化 + 性能优化 + 架构设计 + 编码题）

本环节侧重考察前端工程化、性能优化、架构设计和编码能力，大厂中高级岗位必测

1.前端性能监控指标（FP、FCP、LCP 等）与性能优化全景方案

2.Webpack 构建原理、插件开发与构建速度优化策略

3.前端微前端架构实现方案（qiankun 原理、模块联邦应用）

4.前端安全防护（XSS、CSRF、点击劫持等）与应对策略

5.PWA 核心技术（Service Worker、Cache API）与离线化实践

6.前端 CI/CD 流程设计（自动化测试、镜像构建、灰度发布）

7.组件库设计原则（主题定制、无障碍访问、按需加载）

8.移动端适配方案（REM、vw/vh、响应式布局）与高清屏优化

9.前端数据流管理方案（Redux、Mobx、Vuex 对比）与状态设计模式

10.Serverless 在前端的应用场景与实践案例

• 编码题：手写 Promise（符合 Promises/A+ 规范）
• 编码题：实现双向数据绑定（基于 Proxy 或 Object.defineProperty）
• 编码题：实现一个带缓存的请求函数（支持并发控制与缓存过期）
• 编码题：实现虚拟列表（大数据量渲染优化）
• 编码题：二叉树层序遍历与 Zigzag 遍历

设计题：设计一个前端灰度发布系统（支持用户标识、流量分组、回滚机制）

为了准备这次面试刷了很多面试题，并且做了一个整理，分了HTML、CSS、JavaScript、React、Vue、浏览器、服务端与网络、算法等等.....可以说这次能拿下宇树offer全靠它

总览：

因为篇幅原因，下面就只能截图部分内容展示了，全： https://github.com/encode-studio-fe/natural_traffic/wiki/scan_material1

一、Vue面试题

1. 说说vue动态权限绑定渲染列表〔权限列表渲染)
2. Vue用的哪种设计模式
3. 说说vue操作真实dom性能瓶颈
4. Vue中如何获取dom、操作dom、更新dom
5. Vue的双向数据绑定原理是什么
6. mvvm框架是什么
7. 谈谈Vue的token存储
8. 知道nextTick的作用吗，谈谈对它的理解，是什么，怎么用
9. nextTick和setTimeout区别
10. vue中为什么用虚拟dom而不操作真实dom
11. Vue如何进行组件传值
12. 说说vue里面的父子通信
13. 谈谈如何实现vue组件通信和传值方式(两个问题为同一个答案问法不一样)
14. 说说vue中Key值的作用
15. 说说vue中的虚拟dom和diff算法
16. vue3.0有了解过吗，你觉得vue3.0好吗，好在哪
17. VUE组件如何与iframe通信问题

二、 React面试题

1. 说说React中onClick绑定后的工作原理
2. 说说react里面bind与箭头函数
3. 说说react中的性能优化
4. 高阶组件和高阶函数是什么
5. setState和repalceState的区别
6. redux中核心组件有哪些,reducer的作用
7. 什么是受控组件
8. hooks+context和redux你是怎么选择的，都在什么场景下使用
9. useffect模拟生命周期
10. setsate更新之后和usestate的区别
11. react父组件props变化的时候子组件怎么监听
12. usememo在react中怎么使用
13. React Hooks各种函数介绍
14. React Component和Purecomponent区别
15. hooks相对于class的优化
16. hooks父组件怎么调用子组件的方法
17. 讲一下react中的通信
18. react通过什么方法修改参数
19. 说你对react native的了解
20. redux的实现原理

三、小程序面试题

1. 简单谈谈微信小程序
2. 小程序的原生组件有哪些
3. 小程序的安卓版和ios版是怎么开发出来
4. uni-app弹窗被覆盖怎么解决
5. 小程序生命周期
6. 小程序路由跳转
7. 小程序的兼容问题有哪些
8. 小程序框架都学握哪一些,uniapp都会哪一些，平时开发遇到的困难
9. 小程序怎么获取手机号
10. 小程序的登录流程
11. 小程序如果版本更新了怎么通知用户
12. 小程序嵌入H5页面怎么做
13. 小程序的生命周期函数有哪些?分别有什么作用?

四、Webpack面试题

1. webpack了解吗，讲一讲原理，怎么压缩代码
2. webpack怎么配置
3. webpack怎么打包
4. vue打包内存过大，怎么使用webpack来进行优化
5. webpack打包用过什么插件
6. 说说gulp和webpack的区别

五、TypeScript面试题

1. 了解过TS吗?
2. 使用ts写一个对象属性约束
3. 说一下typescript中的泛型
4. 如何在TS中对函数的返回值进行类型约束
5. ts和js相比有什么区别
6. RX了解吗?

六、Node.JS面试题

1. 说说对nodejs的了解
2. nodejs如何写接口，返回参数如何处理，有多少种方法
3. websocket和http的区别
4. 常见的 HTTP Method有哪些?GET/POST区别?
5. 说一说Tcp三次握手，四次挥手
6. 阐述一下http1.O与http2.0的区别,及http和https区别
7. node.js如何导出页面数据形成报表
8. 协商缓存和强缓存
9. 强缓存
10. Expires
11. Cache-Control
12. 协商缓存
13. Etag和If-None-Match
14. Last-Modify/lf-Modify-Since
15. 为什么要有Etag
16. http常用状态码有哪一些，说—说他们的作用
17. 网络攻击方案有哪些，自己有写过什么安全性方面的东西吗?
18. 静态资源部署到哪?
19. 说说你对nodejs的了解

七、GIT面试题

1. git经常用哪些指令
2. git出现代码冲突怎么解决
3. 你们团队是怎么管理git分支的
4. 如何实现Git的免密操作

八、其它面试题

1. loadsh了解过吗?
2. 是否用过混合APP开发
3. 项目中的组件是如何使用的
4. hash和histoty的原理
5. window.location.href和history.push的区别
6. 商城项目中有写到调用微信，支付宝支付，简单讲述—下
7. 这个支付与后台对接的过程，微信支付的原理
8. 混合开发知道吗?你是怎么理解混合开发的,在项目中用到过混合开发吗?
9. 平时工作中有是香有接触linux系统?说说常用到linux命令?
10. echarts是什么，怎么用
11. Hash和history的区别
12. 谈谈宏任务与微任务的理解，举一个宏任务与微任务的api
13. 对Event loop的了解?

有想要的： https://github.com/encode-studio-fe/natural_traffic/wiki/scan_material1​​​​​​​