Cesium+Vue 数据拦截引起的卡顿

原因

Cesium + Vue开发中当把Cesium的对象放入到 store、data、computed中,会引起Cesium帧率严重下降的问题。
特别是再加载离子系统时,帧率会降到0,好恐怖。
主要原因是因为Vue的双向绑定机制,放在data里面的Cesium对象被监控拦截。

区分情况

一般情况只加载简单地址可以忽略这问题,基本不会影像使用。
但是当做光照阴影显示、离子效果等这种很炫酷的效果,会发现帧率掉的很严重,甚至卡死。

办法

解决办法也很简单粗暴,就是避免将Cesium的任何对象放入data、store中。
将对象放到window对象中,这样子也方便使用。

后续

最开始开发系统时候,听说过这个问题,但是没注意。知道离子系统加载发现必须修改。
导致重构了很多代码,所以再做这类开发还是提早考虑为好,免得重构心态崩。

TIM截图20200101170031

  • 1
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值