Cesium+Vue 數據攔截引起的卡頓

原因

Cesium + Vue開發中當把Cesium的對象放入到 store、data、computed中,會引起Cesium幀率嚴重下降的問題。
特別是再加載離子系統時,幀率會降到0,好恐怖。
主要原因是因爲Vue的雙向綁定機制,放在data裏面的Cesium對象被監控攔截。

區分情況

一般情況只加載簡單地址可以忽略這問題,基本不會影像使用。
但是當做光照陰影顯示、離子效果等這種很炫酷的效果,會發現幀率掉的很嚴重,甚至卡死。

辦法

解決辦法也很簡單粗暴,就是避免將Cesium的任何對象放入data、store中。
將對象放到window對象中,這樣子也方便使用。

後續

最開始開發系統時候,聽說過這個問題,但是沒注意。知道離子系統加載發現必須修改。
導致重構了很多代碼,所以再做這類開發還是提早考慮爲好,免得重構心態崩。

TIM截圖20200101170031

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章