[三分钟笔记]性能优化小笔记

1、图片   雪碧图(多张类似或大小统一的图片合成一张大的图片,通过绝对定位background的相关属性设置展示的区域)
                懒加载 
                缩略图 (我们一般用把图片上传在oss,有一个单独的域名,图片的域名跟展示项目是在不用域名下,分担了资源请求)
                              ?x-oss-process=image/auto-orient,1/resize,m_lfit,w_200/quality,q_100 然后再图片后面带上这串参数,调了图片大小和图片的资料,实际获取到的资源size是小了很多,根据情况使用

2、打包压缩 

善用打包工具webpack,把静态资源(图片、js、html、css)打包合并成一个js资源 (节约服务器带宽资源、减少http请求)

3、接口

a、多个接口合并成一个接口,只请求一次(当页面有多个接口的时候比较适用,或者是服务端渲染的时候)

b、本地缓存(几乎所有的移动端项目都会用)版本号缓存(针对具体需求)

4、使用服务端渲染

5、DNS轮询(后端去配置处理的后端服务器的动态ip地址访问的),排队机制(前端去处理,通过跟后端协商接口返回指定字段是否可以访问来判断是否发起其它接口,目的是在限制在高并发时,大量的请求击垮服务器的带宽的问题)

     动态域名跳转 (前端根据接口返回的域名,分为入口页和落地页,入口页是固定的域名,落地页的域名根据入口页的接口返回的进行动态跳转,也能达到分发到不同服务器的压力)

6、页面缓存、组件缓存,字体图标,尽量减少层级的嵌套

 


                      

 

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值