🔧 阿川の電商水電行
微信游戲小遊戲包體限制4M，一個字體就11.24M，怎麼玩？
引言
哈囉大家好，很多時候，我們的遊戲專案為了美觀和保證風格的統一，會用到外部字體庫。
但是，外部字體庫通常是完整的字庫，體積非常的大，例如完整的simkai字體庫就達到了11.24MB。
要知道，現在的微信小遊戲限制主包的大小不能超過4M，即使你把字體放在分包，占去近50%的程式包大小，想想也不太合適。
因此，如果我們想要能夠順利地在遊戲中使用漂亮的字體，那我們得想辦法將字庫瘦下來。
言歸正傳，本期將帶小夥伴們一起看看，如何將我們想用的字庫從11.24M瘦到不到1M。
本文源工程可在文末獲取，小夥伴們自行前往。
精簡字庫原理
據了解，一個完整的字庫估計有3~4萬個漢字，但實際上我們遊戲專案需要用到的可能只占10%~20%，甚至更少，像其中的一些漢字囧、烎、嫑、勥、忈、巭、怹、颪、氼、兲，別說用，筆者連讀都不會讀。（會讀的小夥伴請打在評論區，我給你點讚）
遊戲專案中，用到文字的地方通常包含下面幾個：
-
遊戲配置(*.json)，一般配置裡的中文最多。
-
預制體(*.prefab)，有些靜態的文字通常就在預制體的
Label裡。
-
場景(.scene、.fire)同上。
-
程式碼(*.ts)，寫死在程式碼裡的。
因此，要瘦身字體，按照以下2個步驟即可：
- 透過工具將上述地方的文字提取出來。
- 透過工具從字庫中保留我們提取到的文字，其餘的刪除。
精簡字庫實例
1. 提取中文字
要提取中文字，我們只需要按照上面的原理，遍歷我們遊戲專案中的遊戲配置、預制體、場景和程式碼進行匹配即可。
其中遍歷文件，筆者使用的是glob。
匹配中文字的正則表達式是/[\u4e00-\u9fff]/g。
2. 精簡字庫
這裡我們使用百度出品的字體子集化工具Fontmin。可以直接透過npm install fontmin進行安裝。
工具的使用也非常簡單，透過傳入原字體、保留的字符和字體輸出目錄，最後透過fontmin.run這個API生成即可。
3. 效果演示
透過node font-minifier.js --project=C:\Users\Administrator\Desktop\demo --source=C:\Users\Administrator\Desktop\simkai.ttf傳入工程目錄和原字體路徑即可。
執行結果可以看到掃描的所有文件。
提取到的所有中文字。
生成的文件及其大小。
精簡後的字體大小為802K。
更進一步
除去我們遍歷出來的遊戲設定的中文字，其實還有一部分中文字我們是不確定的，那就是用戶自定義的內容，例如名字和聊天文字。
想要處理這一部分文字，我們只能透過預設，猜到用戶會自定義的內容，從而預設保留，可以透過網路上分享的常用內容來完成。
此外工具可以集成到插件或者打包系統裡面去，這樣後續就不用考慮相關問題，自動生成所需字庫即可。
逗句
透過上述方法，可以將字庫大幅度精簡到能夠使用的狀態，但也會有一定的瑕疵。
不知道小夥伴們有沒有更完美的辦法呢？
本文源工程可透過私訊發送 fontminifier 獲取。
我是"億元程序員"，一位有著8年遊戲行業經驗的主程。在遊戲開發中，希望能給到您幫助, 也希望透過您能幫助到大家。
AD:筆者線上的小遊戲《打螺絲闖關》《貪吃蛇掌機經典》《重力迷宮球》《填色之旅》《方塊掌機經典》大家可以自行點擊搜尋體驗。
實不相瞞，想要個讚和愛心！請把該文章分享給你覺得有需要的其他小夥伴。謝謝！
推薦專欄：
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式
