tp6接入cos对象存储
背景
自己开发的微信小程序,因为考虑到流量不大的缘故,一直使用的单服务器的架构,这样做的好处是能将运维成本维持在一个很低的价格。但是随着业务迭代以及用户数量的积累,慢慢开始出现性能不足的情况。
问题
小程序首次热启动的情况下,页面加载缓慢,拿活动页举例从点击跳转开始到渲染完成耗时在5秒以上,这导致用户在使用的时候体验极差,有时会主动要求转为线下支付,所以在这种场景下,一个优化方案应运而生。
分析
首先在使用cos之前也试过其他方案:
微信小程序 image 元素自带的 lazy-load 功能,但是效果并不明显,因为懒加载是对当前页面3~4屏外的内容施行懒加载的策略,而实际的场景连当前这一屏的内容渲染都很吃力。
缩小图片分辨率,这个方式确实是有效果的,但是优化限度非常有限,因为降低分辨率的前提必须保证图片的可读性,当大图出现小字的时候优化限度基本为0。
连续试了两个方法效果都不理想,只能重新想办法了,前面说了这个项目是单服务器的架构,所有的静态资源也都保存在服务器上,需要时直接访问地址即可。但是当我们点开首页的时候需要同时加载十几张图片,其中不乏1~2m的图片,以服务器4m的带宽来说压力太大,所以考虑将本地的静态资源存储到云,以此减轻服务器压力,从而达到提升性能的目的。
综上所述,能不花钱的方案基本都试了一下,效果不尽如人意,所以最后还是决定将本地存储的静态资源(图片为主)迁移到cos上去。
计划
安装cos的sdk
本地开发的话composer直接引入依赖即可,需要注意的是正式环境部署的时候如果你vendor包内的东西一起上传了,需要执行一下
否则composer无法检测到新装的依赖。如果没有上传vendor的就进终端直接require一下就好了。
另外cos官方文档还提供另外两种安装方式:https://cloud.tencent.com/document/product/436/12266
2.根据sdk开发
目前来看没有碰到什么坑,可能是业务逻辑比较窄的关系,sdk这块只用一个upload的功能,只是说cos这边上传对象的时候仅支持本地文件上传,所以后端服务器这边要将上传的图片先保存在本地,确认上传cos成功后,将本地的资源删除,这里可能需要一个重试机制,后面考虑加下吧
效果
可以说提升明显吧,目前只是将各页面的大图上传到了cos,整体的渲染时间缩短到了1~2秒,可以说提升很大了,后面看具体的使用情况如果还是嫌慢的话,考虑用下cdn吧

