遊戲開發優化篇之合併圖集

對於性能來講，不少狀況都是用空間換時間。
而後在儘可能減小空間的佔用，在二者之間作抉擇。

首先咱們瞭解一下性能指標

1. 幀率：每秒遊戲循環執行的次數，即每秒多少幀 越高越好
2. drawcall： 一幀中游戲調用gpu繪製圖形次數，越少越好
   3 . cpu性能： cpu執行速度，越快越好
   4 . gpu性能： gpu執行速度，越快越好
   5 . 內存： 遊戲資源佔用的運行時空間， 越低越好
   6 . 網絡請求數： 請求網絡下載資源，越少越好
   7 . 加載速度： 將硬盤中的資源加載到內存中，越快越好
   8 . 包體大小： 遊戲包大小，越小越好
   9 . 節點數量： 遊戲中存在的節點數量，越少越好

合併圖集：

這是一個地球人都知道的手段。那爲何要合併圖集？也只是將給初級開發者聽聽而已。
來一個cocoscreator的連接：https://docs.cocos.com/creator/manual/zh/asset-workflow/atlas.html

首先咱們要了解，xxgl 的繪圖過程都作了什麼？

1. 啓用對應的着色器程序

this.gl.useProgram(this.program);

2. 綁定紋理

this.gl.bindTexture(gl.TEXTURE_2D, batchNode.getTexture().getTexture());

3.傳遞頂點數據

let n = indexList.length;
    let indices = new Uint8Array(indexList);
    //放入緩衝區
    let buffer = this.buffer.initBuffers(vertices, 'vertices');
    let persize = vertices.BYTES_PER_ELEMENT;
    // 設置數據 這裏能夠優化
    let pointer = program.setPointer('a_Position', 3, gl.FLOAT, false, persize * count, 0);
    let texPointer = program.setPointer('a_TexCoord', 2, gl.FLOAT, false, persize * count, persize * 3);
    this.buffer.initBuffers(indices, 'indices', this.gl.ELEMENT_ARRAY_BUFFER);

4. 執行繪製

let u_Sampler = program.getUniformLocation('u_Sampler');
    if (!u_Sampler) {
      console.log('Failed to get the storage location of u_Sampler');
      return false;
    }
    gl.uniform1i(u_Sampler, 0);
    //調用一次drawcall加一
    gl.drawElements(gl.TRIANGLES, n, gl.UNSIGNED_BYTE, 0);

合併圖集的做用在哪裏？

在着色器程序不變的狀況下，若是咱們不少sprite 使用的都是一張紋理上的碎圖，只是紋理座標不一樣，那咱們就能夠在第3步傳遞數據的時候作文章，其餘幾步就能夠不動，而後讓繪製一次完成。相反的，若是有兩個sprite使用了不一樣的紋理，那麼就須要綁定兩次紋理。這些步驟就須要再執行一次。drawcall也就變成了2。
顯然合併圖集已經影響了幀率和drawcall。

對內存和包體的影響

1. 這裏先說明紋理所佔內存的計算公式：長x寬x一個像素點的字節數。
2. 若是碎圖有白邊的話合成圖集會省去一部份內存，這個cocos官方已經說了；
3. 其次，不管是png仍是jpg格式，每張圖片都會有頭部信息，若是合併圖集，也就是說若是有兩張圖片就少了一張圖片的頭部信息，若是多張呢？天然是省了內存又減少包體。
4. 雖然合併圖集會產生一個plist配置文件，增大了一些內存和包體的佔用，可是對於減小的量來講是能夠忽略的。
5. 若是圖集包含的碎圖越多，節省的空間就越多。若是隻是那麼三五張圖篇，打成圖集可能沒有省出多少空間。因此對於單張很大的背景圖就不建議使用了。畢竟尺寸的限制是2048*2048，合併不了幾張還產生了plist文件。
6. 若是圖集使用不當，模塊使用的資源劃分的不是很標準，也會出現一個圖集利用率的問題。也能夠理解爲內存的浪費，例如打開的一個界面中就用到了圖集中的幾張碎圖。因此使用圖集的時候要注意圖片資源的劃分狀況。

對網絡請求次數的影響

這個是顯而易見的，十張圖請求十次，合成圖集就請求兩次（由於多出一個plist文件）。省了不少網絡連接的過程。可是要注意圖集的大小和體積，過大的圖集也會形成不良影響。

對加載速度的影響

首先咱們要看看文件讀寫的步驟：

1. 首先創建通道。
2. 而後創建數據存儲空間。
3. 而後開始讀寫數據。
4. 關閉流。
   合併圖集確定會減小流的開啓和關閉的次數，天然省去了很多加載時間。

結語

整體來看，合併圖集的好處真是太多了，沒有理由不用啊！
歡迎掃碼關注公衆號《微笑遊戲》，瀏覽更多內容。

本文由博客羣發一文多發等運營工具平臺 OpenWrite 發佈