网站性能优化面试题及详细答案（实战版）.docxVIP

网站性能优化面试题及详细答案（实战版）

一、基础认知类（初级必问）

1.你日常开发中，网站性能差主要体现在哪些现象？

参考答案：

实际项目里性能差的直观表现主要有这几种：

1）页面白屏时间长，输入网址后很久才看到内容；

2）首屏加载慢，滚动页面前核心内容迟迟渲染不出来；

3）页面交互卡顿，点击、滑动、输入有明显延迟；

4）资源加载超时、大文件加载慢，图片、视频、字体迟迟不显示；

5）页面切换、路由跳转卡顿，甚至短时卡死；

6）手机低端设备、弱网环境下体验极差。

2.说说你对前端性能优化的整体思路？

参考答案：

我一般按照「加载阶段、渲染阶段、交互阶段、运行阶段」四个维度做优化，核心思路就是减少资源、缩短耗时、减少计算、避免阻塞。

1）加载优化：让资源更少、更小、更快抵达浏览器；

2）渲染优化：减少重排重绘，提升页面渲染效率；

3）脚本优化：减少主线程阻塞，避免长任务；

4）体验优化：通过骨架屏、懒加载、预加载提升用户感知速度；

5）监控兜底：线上做性能监控，发现问题持续迭代优化。

3.常用的前端性能指标有哪些？分别代表什么含义？

参考答案：

现在面试和企业监控最看重的是WebVitals核心指标：

1）LCP（最大内容绘制）：页面最大元素渲染完成的时间，代表首屏加载速度，标准2.5s以内优秀；

2）FID（首次输入延迟）/INP（交互响应时间）：用户第一次操作到浏览器响