一定要坚持下去的前端面试题--性能优化

115 阅读1分钟

一、 图片优化

1. 图片转为base64优缺点?

优点:

  • 减少网络请求
  • base64编码的字符串,更适合不同平台、不同语言的传输 缺点:
  • base64格式的文本内容较多,转换后html/css大小增加(css体积增大后,会导致渲染阻塞。图片文件的加载是不会堵塞html和css加载的)
  • base64无法缓存,只能缓存包含base64的文件,比如js或者css(base64图一般存在于css中,那么就可以随着css被缓存而实现间接缓存。如果直接写在html中,一般html改动比较频繁,所以等同于得不到缓存效益),这比直接缓存图片要差很多。

2. 雪碧图优缺点

优点:

  • 减少网络请求

缺点:

  • 有几个小图标更换时就需要换整张图