Layabox的2d精靈的性能優化

在使用Layabox的2d精靈時,我們會需要很多渲染圖片的需求,那麼,如果做到使用最小的代價實現圖片的渲染呢。

合併圖集

爲什麼要合併圖集呢。如果你一個圖片是由多張圖片組成的,正常情況,在webgl模式下,渲染一張圖片,就是一次drawcall,但是呢,如果紋理沒有切換,只是切換渲染的位置,Layabox會自動給你合批,你相當於一次drawcall就實現了整張圖片的渲染。
在這裏插入圖片描述

這個問題發現是我之前測試過官網的瓦塊圖時,發現設置cacheAs爲normal時,它的drawcall只需要一次。而我自己設置的瓦塊圖,需要渲染多少個瓦塊,就有多少drawcall。後來就發現了這個,如果當前的瓦塊都屬於一張圖集,那麼,自動合批,會一次性給你渲染出來。
所以,如果都是一個精靈使用的,而且圖片還不大,可以合併成一張圖片使用,可以降低性能損耗。

設置cacheAs

如果出現多個單個圖片,或者無法合併成圖集的情況。我們還要想辦法降低性能。那就是用到cacheAs方法,這個屬性有三個值,'none’就是默認,不緩存。‘normal’就是正常緩存,會把你的精靈渲染的內容,生成graphics的命令模式,但是性能降低不是很多,多張圖片切換,還是有很多的drawcall。‘bitmap’直接將渲染完成的紋理緩存起來,這種會增加內存和緩存的佔用,如果你的一張精靈就幾千次drawcall渲染出來,使用這種方式你可以節省幾千次的drawcall。
那麼,如果地圖過大的話,我們就要靈活使用,即不能佔用太大的內存和緩存,還能減少drawcall的方法。
我的實現方式,是增加地圖塊對象,每個地圖塊固定寬高,把整個地圖分成多張地圖塊。根據當前地圖顯示範圍進行顯示隱藏。顯示,設置精靈的cacheAs爲’bitmap’,並渲染一次即可。而無法顯示的瓦塊,我們可以把cacheAs設置爲’none’,並且將其graphics調用clear事件清空畫布。

希望我總結的經驗,能讓大家有些收穫。

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