紋理最佳化:讓你的紋理也 “瘦” 下來
在上一期《紋理優化:不僅僅是一張圖片那麼簡單》中,我們針對紋理相關的優化,挑選了部分知識點分析。無論是大家在開發時的疏忽,還是對相關知識點的理解不足,這些問題的積累最終都會反映到專案的效能表現上。為此,我們將這些規則列出,並且以一個個知識點的形式向大家逐一解讀。
本文,我們繼續聚焦紋理方面,以UWA本地資源檢測中的檢測規則:“開啟Mipmap選項的Sprite紋理”、“用非壓縮格式的紋理”和“Wrap模式為Repeat的紋理”為大家簡單講解相關的知識點。我們將力圖以淺顯易懂的表達,讓職場萌新或優化萌新深入理解。
1、開啟Mipmap選項的Sprite紋理
對紋理而言,在Import Settings中開啟Generate Mip Maps後,Unity就會預生成一系列長寬以2為倍數縮小的紋理序列,一直生成到解析度為 1*1,在取樣紋理時會根據圖形的大小自動選擇相近等級的Mipmap進行取樣。
在3D場景中,由於距離問題,物體的紋理需要經常被縮放、拉伸,所以使用Mipmap會減小執行過程中的計算量,提升GPU效率。
需要注意的是,開啟Mipmap選項後,生成的多個小解析度紋理會使得總體記憶體佔用比原來多出1/3。在UI中,由於不存在元素相對於相機的位置不斷變化的需求,一般情況下也不需要頻繁縮放圖片(特殊需求除外),所以對UI而言Mipmap的存在對效能提升其實是沒有意義的。
本條規則的主角——Sprite型別的紋理,就是應用在2D遊戲或者UI當中的,所以我們不建議開啟Mipmap,以避免造成記憶體上的浪費。
2、使用非壓縮格式的紋理
首先我們要區分圖片檔案格式和引擎中支援的紋理格式。對圖片而言,諸如JPG、JPEG和PNG等多種檔案格式是為了儲存影像資訊而使用的、對資訊的特殊編碼方式,它儲存在磁碟中或者記憶體中。
但圖片的這些格式,對於以向量計算見長的GPU來講就有種面對陌生外語時的“無能為力”了。3D圖形硬體不支援原始的圖片檔案格式,原始圖片需要經過CPU轉換成圖形硬體支援的格式才能在實時渲染中使用。而這些可以被GPU識別的格式,就是我們要說的紋理格式。
我們可以在Format裡設定紋理的格式。不同的裝置與平臺具有各自專有的支援的格式。RGB32/RGBA32/RGBA24/RGB24為非壓縮的格式,能適用於多個平臺和環境。這些格式顯示效果較好,但記憶體佔用較大,效率不高。因此我們建議在對影像質量要求不是特別高的情況下,儘量使用硬體支援的壓縮格式。
這條規則會過濾出所有采用非壓縮格式的紋理,開發團隊需要基於相關紋理的實際使用需求和在相關平臺上表現效果的考量,來決定是否需要進行壓縮。
目前Unity支援的紋理壓縮格式有ETC、ASTC、PVRTC和DXT等,各有不同的適用環境,在壓縮的大小和保真度上也各有所長。對於壓縮格式的使用,可以參考UWA問答上的帖子:https://answer.uwa4d.com/question/58d2943ae00cc20065a42597。
3、Wrap模式為Repeat的紋理
一般而言,我們使用UV座標構建起模型表面在紋理上的對應取樣關係,UV座標的取樣範圍在0~1之間。但實際開發過程中,有時會遇到“在UV座標0~1以外的範圍進行取樣”的情況。
Wrap Mode 選項就是用來確定當紋理座標(UV座標)超出0~1範圍時如何取樣的。形象點來講,這種情況有點像是在畫框裡放入了一張尺寸比框小的畫作,WrapMode決定了以何種方式去填充畫作與畫框間的部分。我們將在這裡介紹常用的兩種方式:Repeat和Clamp。
在Unity中,Texture的Wrap Mode預設是Repeat。該方法以平鋪的方式填滿“畫框”的剩餘部分。對於如下圖所示的一張紋理:
Repeat模式的實際顯示效果如下:
而對於Clamp模式,它會以“畫作”邊緣那一圈去取樣填充滿“畫框”中剩餘的部分。從UV座標的角度而言,該模式會將大於1.0的數值設定為1.0,將小於0.0的數值設定為0.0。其顯示效果如下:
那麼我們為什麼要將Repeat模式的紋理檢測出來呢?因為在實現方法上,當UV座標超出0~1範圍時,Repeat模式會忽略紋理座標的整數部分,並將紋理圖的拷貝貼上在物體表面上。這就要求在紋理頂部的紋理單元應與底部的紋理單元相匹配,在紋理左側的紋理單元也應與右側的紋理單元相匹配,這樣才能做到無縫連線。若無法滿足兩側無縫銜接的要求,在最終顯示的影像邊緣會出現雜色,如下圖所示:
所以從表現效果上講,Repeat模式有可能會使得紋理邊緣看起來更不自然。所以在篩選出WrapMode中選擇了Repeat模式的紋理後,開發團隊要根據紋理的實際展示效果去選擇合適的WrapMode模式。
希望以上這些知識點能在實際的開發過程中為大家帶來幫助。需要說明的是,每一項檢測規則的閾值都可以由開發團隊依據自身專案的實際需求去設定合適的閾值範圍,這也是本地資源檢測的一大特點。同時,也歡迎大家來使用UWA推出的本地資源檢測服務,可幫助大家儘早對專案建立科學的美術規範。
我們已支援Luacheck功能啦~
我們已支援粒子特效檢測~
這麼多實用貼心的功能
你們還沒用起來嗎?
萬行程式碼屹立不倒,全靠基礎掌握得好!
效能黑榜相關閱讀
《那些年給效能埋過的坑,你跳了嗎?》
《那些年給效能埋過的坑,你跳了嗎?(第二彈)》
《掌握了這些規則,你已經戰勝了80%的對手!》
相關文章
- Webgl 紋理Web
- 圖形學之紋理後續/WebGL多紋理處理Web
- 法線紋理
- android下vulkan與opengles紋理互通Android
- OpenGL 紋理詳解
- 【譯】建立紋理文字的技巧
- 解密影片魔法:將ExternalOES紋理轉化為TEXTURE_2D紋理解密
- Unity安卓共享紋理Unity安卓
- WebGL 紋理顏色原理Web
- OpenGL ES 壓縮紋理
- 材質最佳化:如何正確處理紋理和材質的關係
- 效能優化:紋理檔案優化
- 影像特徵計算——紋理特徵特徵
- OpenGL/OpenGL ES入門: 紋理應用 - 紋理座標及案例解析(金字塔)
- 4.QOpenGLWidget-對三角形進行紋理貼圖、紋理疊加
- 第四個OpenGL程式,texture 紋理
- CUDA一維紋理記憶體記憶體
- 圖形學_opengl紋理對映
- blender紋理繪製克隆工具使用
- 試試二維紋理對映
- 萬萬沒想到——flutter這樣外接紋理Flutter
- three.js 著色器材質之紋理JS
- Unity iOS 使用 ASTC 格式紋理實踐UnityiOSAST
- threejs紋理平鋪實現地面效果JS
- SDL3 入門(5):紋理渲染
- 紋理是怎樣顯示在模型上的模型
- 簡單的 OpenGL 紋理貼圖不起作用?
- Processing 網格紋理製作(棋盤格)
- OpenGL ES 高階進階:紋理陣列陣列
- ThreeJs-05紋理材質高階操作JS
- ThreeJs-04詳解材質與紋理JS
- WebGPU[4] 紋理三角形WebGPU
- pixi.js 影像資源(svg)轉紋理JSSVG
- [OpenGL]未來視覺6-靜態圖片紋理載入視覺
- 【光能蝸牛的圖形學之旅】Unity紋理初步Unity
- canvas-座標系、圓角矩形、紋理、剪裁Canvas
- OpenGL Android課程六:介紹紋理過濾Android
- OpenGL/OpenGL ES入門:紋理初探 - 常用API解析API