性能优化

前端性能优化

1.
动画最小时间间隔

手写动画时的最小时间间隔及其原因

2.
AJAX 请求缓存策略

实现 AJAX 请求缓存,避免重复获取数据

3.
浏览器渲染性能优化

减少重排重绘、GPU 加速、requestAnimationFrame 的使用

4.
CDN 上 JS 运行时错误捕获

解决跨域脚本 Script error 问题,获取完整错误信息

5.
Chrome Timing 性能优化

根据 Chrome DevTools Timing 指标分析和优化页面性能

6.
编码阶段优化

前端性能优化在编码阶段的常用策略和实践

7.
CSS 性能优化

CSS 性能优化的常用方法和实践技巧

8.
CSS 渲染层合成与创建

理解浏览器渲染层合成机制及触发条件

9.
代码编码优化

前端 JavaScript 代码性能优化的常用技巧

10.
DNS 预解析与资源预加载

dns-prefetch、preload、prefetch 的区别与使用场景

11.
高效 DOM 操作

减少重排重绘、批量更新、事件委托等 DOM 优化技巧

12.
错误上报方式

前端错误上报的两种常用方式:Image Beacon 和 sendBeacon

13.
文件优化策略

前端项目中常用的文件优化方法

14.
首屏加载优化

懒加载、预加载、SSR、代码拆分、资源压缩、CDN 等优化方案

15.
HTTP/1 多图片加载优化

解决 HTTP/1.1 下多图片并发加载受限的问题

16.
高性能 JavaScript 编写

JavaScript 性能优化的实用技巧和代码示例

17.
图片格式选择

PNG、GIF、JPG 的区别及使用场景

18.
图片优化策略

WebP、雪碧图、Base64、懒加载、响应式图片的使用场景和实现

19.
大数据列表处理

使用虚拟滚动和时间分片处理十万条数据渲染

20.
jQuery 性能优化

jQuery 常用的性能优化技巧和最佳实践

21.
移动端性能优化

移动端 Web 应用的性能优化策略和实践方法

22.
多域名部署的优势

前端资源使用多域名部署的原因和好处

23.
多域名资源部署

使用多个域名存储网站资源的优势和实践

24.
其他优化方案

前端性能优化的其他实用方案

25.
前端性能优化方向

前端性能优化的主要方向和具体措施

26.
页面基础优化

前端页面性能优化的常用方法和实践

27.
性能优化 API

浏览器提供的性能监控与优化相关 API

28.
性能优化总览

前端性能优化的常用手段和实践方案

29.
性能优化方向指南

前端性能优化的主要方向和实践方案

30.
性能检测工具

前端常用的性能检测工具和使用方法

31.
减少 CORS 预请求次数

通过简单请求和缓存策略减少 CORS 预检请求

32.
预渲染优化

前端预渲染技术及实现方式

33.
脚本加载优化

defer、async 和动态创建 script 的区别与使用场景

34.
SEO 优化

前端 SEO 优化的常用方法和实践

35.
用户体验优化

前端常见的用户体验优化技术与实现

36.
长列表虚拟滚动

虚拟列表和时间分片两种长列表优化方案

37.
Vue 项目优化实践

Vue 项目中常用的性能优化方法和代码示例

38.
1x1 透明 GIF 埋点请求

为什么数据埋点常用 1x1 像素透明 GIF 图片

39.
Webpack 构建优化

Webpack 构建速度与打包体积优化方案

40.
前端性能指标

FCP、LCP、TTI、CLS、FID 等 Web Vitals 指标的含义与测量

41.
网页卡顿排查

使用 Chrome Performance 和 Memory 面板定位性能问题

42.
白屏时间监控

计算和监控页面白屏时间的几种方案