来面试的前端简历写着“精通Vue和性能优化”，结果几个基础问题直接露馅。
问：Vue组件间通信有哪些方式？
Vuex和EventBus
分别适用于什么场景？
他答：“父子用props，还有$emit...Vuex就是全局状态，EventBus也能传数据。”
专业拆解
核心：8种方式，props/$emit、provide/inject、$attrs/$listeners、Vuex、
Pinia、EventBus、全局变量、mitt等
场景对比：Vuex用于中大型项目跨组件状态同步，EventBus适合简单场景但易导致事件混乱
关键细节：Vue3推荐Pinia替代Vuex，EventBus需注意事件销毁，否则易内存泄漏💡
问：Vue的
nextTick是什么原理？什么时候会用到？
他答：“等DOM更新后执行...好像用微任务实现的？”
底层真相
原理：Vue异步更新队列，nextTick将回调延迟到下次DOM更新循环后执行
实现：优先使用Promise.then，降级到MutationObserver、setImmediate、setTimeout
使用场景：数据变化后操作更新后的DOM，如获取最新列表高度、基于新状态的DOM操作🔥
问：前端页面白屏可能有哪些原因？怎么快速定位？
他懵了：“可能是JS报错吧...打开控制台看看？”
救火四板斧
1.检查Console报错：JS语法错误、资源加载失败
2.Network查看资源状态：JS/CSS是否返回404或阻塞
3.路由或框架初始化失败：VueRouter配置错误、Vue实例未挂载
4.性能监控：首屏资源过大、
Webpack分包不当、渲染超时🚀
问：Webpack的loader和plugin有什么区别？
他猜：“loader处理文件，plugin...做更多事？”
本质区别：
loader是转换器（如less→css），针对单个文件，链式执行
plugin是扩展器，通过hooks干预打包流程，如生成HTML、压缩代码
经典例子：
style-loader与HtmlWebpackPlugin分工明确💪
以下是根据25年全年前端面试总结的高频面试八股文，为明年春招提前做准备吧！有需要的直接嗱去看看！
JavaScript面试题323题：
1.不会冒泡的事件有哪些?
2.mouseEnter 和 mouseOver 有什么区别?
3.MessageChannel 是什么，有什么使用场景?
4.async、await 实现原理
5.Proxy 能够监听到对象中的对象的引用吗?
6.如何让 var [a, b]={a:1,b: 2}解构赋值成功?
7.下面代码会输出什么?
8.描述下列代码的执行结果
。。。。。
HTML面试题57题：
1.什么是 DOM 和 BOM?
2.简单描述从输入网址到页面显示的过程
3.一台设备的dpr，是否是可变的?
4.前端该如何选择图片的格式?
5.前端跨页面通信，你知道哪些方法?
6.说说你对 Dom 树的理解
7.行内元素有哪些?块级元素有哪些? 空(void)元素有那些?
8.html和css中的图片加载与渲染规则是什么样的?
。。。。。
React面试题83题：
1.下面代码中，点击“+3”按钮后，age 的值是什么?
2.
React Portals 有什么用?
3. react 和 react-dom 是什么关系?
4.React 中为什么不直接使用
requestIdleCallback?
5.为什么 react 需要 fiber 架构
，而 Vue 却不需要?
6.子组件是一个 Portal，发生点击事件能冒泡到父组件吗？
8.说说React render方法的原理?在什么时候会被触发?
。。。。。
Vue面试题80题：
1. Vue 有了数据响应式，为何还要 diff ?
2.vue3 为什么不需要时间分片?
3.vue3 为什么要引入 Composition API
?
4.谈谈 Vue 事件机制，并手写$on、$off、$emit、$once
5.computed 计算值为什么还可以依赖另外一个 computed 计算值?
7. 怎么在 Vue 中定义全局方法?
8.Vue 中父组件怎么监听到子组件的生命周期?
。。。。。
计算机网络面试题71题：
1.简单描述从输入网址到页面显示的过程
2.说说WebSocket和HTTP的区别
3.说说 https 的握手过程
4.HTTP2中，多路复用的原理是什么?
5.说说你对"三次握手"、“四次挥手”的理解
6.为什么推荐将静态资源放到cdn上?
7.什么是DNS劫持?
8. TLS 1.3 做了哪些改进?
。。。。。
Node.js面试题27题：
1.common.js和es6中模块引入的区别?
2.为什么Node在使用es module时必须加上文件扩展名?
3.浏览器和 Node 中的事件循环有什么区别?
4.Node性能如何进行监控以及优化?
5.如果让你来设计一个分页功能,你会怎么设计?前后端如何交互?
6.如何实现文件上传?说说你的思路
7.如何实现iwt鉴权机制?说说你的思路
8.说说对中间件概念的理解，如何封装 node 中间件?
。。。。。
性能优化面试题25题：
1.script标签放在header里和放在body底部里有什么区别?
2.前端性能优化指标有哪些?怎么进行性能检测?
3.SPA(单页应用)首屏加载速度慢怎么解决?
4.如果使用CSS提高贞面性能?
5.怎么进行站点内的图片性能优化?
6.虚拟DOM一定更快吗?
7.有些框架不用虚拟dom，但是他们的性能也不错是为什么?
8.如果某个页面有几百个函数需要执行，可以怎么优化页面的性能?
。。。。。
好了，本文就写到这了，《2025前端最新面试攻略》我都整理成PDF了
完整： https://github.com/encode-studio-fe/natural_traffic/wiki/scan_material1
