前端性能优化知识点汇总

ChanceWong 发布于2019-08-26 11:48 / 590人阅读

摘要：面试必谈的前端性能优化为什么做优化提供给用户最佳体验有哪些差的体验白屏好久才显示内容浪费用户流量优化方案大概分为以下几种降低请求数量减少获取数据的接口数初始数据尽量通过一个接口返回减少的数量提取公共利用缓存减少后续加载访问。

面试必谈的--前端性能优化 为什么做优化

提供给用户最佳体验

#有哪些差的体验
- 白屏好久才显示内容
- h5浪费用户流量

优化方案大概分为以下几种：

1、降低请求数量
    a、减少获取数据的接口数（初始数据尽量通过一个接口返回）
    b、减少js、css的数量（提取公共js、css利用缓存、减少后续加载访问。有些代码直接注入页面无需外链形式访问加载。）
    c、图片懒加载
2、降低文件大小
    a、图片压缩以及使用webp
    b、压缩js、css
    c、gzip（设置content-encoding:gzip）
    d、icon或者svg绘制图标
3、加快请求速度
    a、[DNS预解析][1] 
    b、减少域名数量(页面、js、css、image、接口域名、同种类型文本请求尽量同域名。)
    c、静态资源cdn分发
    d、提前加载（提前加载一部分可能被用户访问的图片或者数据信息）
4、缓存
    a、http协议缓存
    b、离线数据缓存localStorage
5、渲染
    a、js、css优化(按照规范来写--google规范)
    b、服务器渲染

DNS预解析
google规范

云服务器 GPU云服务器前端性能优化前端开发性能优化优化知识前端知识

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/107613.html

前端性能优化知识点汇总

摘要：面试必谈的前端性能优化为什么做优化提供给用户最佳体验有哪些差的体验白屏好久才显示内容浪费用户流量优化方案大概分为以下几种降低请求数量减少获取数据的接口数初始数据尽量通过一个接口返回减少的数量提取公共利用缓存减少后续加载访问。面试必谈的--前端性能优化为什么做优化提供给用户最佳体验 #有哪些差的体验 - 白屏好久才显示内容 - h5浪费用户流量优化方案大概分为以下几种： 1、降低...

quietin 2019-08-30 13:59 评论0 收藏0
前端性能优化知识点汇总

摘要：面试必谈的前端性能优化为什么做优化提供给用户最佳体验有哪些差的体验白屏好久才显示内容浪费用户流量优化方案大概分为以下几种降低请求数量减少获取数据的接口数初始数据尽量通过一个接口返回减少的数量提取公共利用缓存减少后续加载访问。面试必谈的--前端性能优化为什么做优化提供给用户最佳体验 #有哪些差的体验 - 白屏好久才显示内容 - h5浪费用户流量优化方案大概分为以下几种： 1、降低...

CarterLi 2019-08-01 18:38 评论0 收藏0
前端资源系列（4）-前端学习资源分享&前端面试资源汇总

摘要：特意对前端学习资源做一个汇总，方便自己学习查阅参考，和好友们共同进步。特意对前端学习资源做一个汇总，方便自己学习查阅参考，和好友们共同进步。本以为自己收藏的站点多，可以很快搞定，没想到一入汇总深似海。还有很多不足&遗漏的地方，欢迎补充。有错误的地方，还请斧正... 托管: welcome to git，欢迎交流，感谢star 有好友反应和斧正，会及时更新，平时业务工作时也会不定期更...

princekin 2019-08-20 11:28 评论0 收藏0
2018大厂高级前端面试题汇总

摘要：面试的公司分别是阿里网易滴滴今日头条有赞挖财沪江饿了么携程喜马拉雅兑吧微医寺库宝宝树海康威视蘑菇街酷家乐百分点和海风教育。（关注福利，关注本公众号回复[资料]领取优质前端视频，包括Vue、React、Node源码和实战、面试指导）本人于7-8月开始准备面试，过五关斩六将，最终抱得网易归，深深感受到高级前端面试的套路。以下是自己整理的面试题汇总，不敢藏私，统统贡献出来。面试的公司分...

zzir 2019-08-23 12:38 评论0 收藏0