Skip to main content

Command Palette

Search for a command to run...

知識閱讀 - Meta 如何處理 APP 本地化語言

Published

Facebook 約有 57% Android 和 49% iOS 的使用者使用非英語之外的語言,意味著有相當多不同的語言的語法、名詞、複數等語句需要處理。使用語言包的方式,讓 iOS APP 減少了約 16.6MB 的大小。

Why do we need language packs?

Android 和 iOS 原生平台提供的本地化框架存在兩個問題

翻譯的精確性

兩個原生平台只能提供簡單的文本翻譯,很難再沒有樣板程式碼的情況下建立符合語意的翻譯。為此開發了自己的 API 和框架-- FBT,此框架目前支援 PHP、Hack、JavaScript 和 React Native。

FBT API

fbt(
   'Write on ' +
     fbt.pronoun('possessive', gender) +
     ' timeline...',
   'Placeholder text for inline composer',
 )

Android

 <string name="title_male" description="Placeholder text for inline composer">Write on his timeline...</string>
 <string name="title_female" description="Placeholder text for inline composer">Write on her timeline...</string>
 <string name="title_other" description="Placeholder text for inline composer">Write on their timeline...</string>

iOS

if (gender == Male) {
  FBLocalizedString("Write on his timeline...", "Placeholder text for inline composer");
} else if (gender == Female) {
  FBLocalizedString("Write on her timeline...", "Placeholder text for inline composer");
} else {
  FBLocalizedString("Write on their timeline...", "Placeholder text for inline composer");
}

語言支援和應用程式大小

在送審應用程式到平台商店前,所有字串都應翻譯成適當的格式並內建在應用程式中。但是隨著支援的語言越多其容量也越大,這對於許多不是待在有足夠網路服務的地方,會造成人們不願意升級版本。而從應用程式中剔除掉這些翻譯文件,發現到可以節省 16.6 MB 的大小。所以最初在 Android 上改換成下載語言包的方式。

End-to-end flow

語言包框架有兩大階段:分別發生在 mobile build 發布之前和之後。

在構建應用程式二進製檔案時,為構建中使用的 FBT 字串構建語言包。要採用新的字串和最近的翻譯更新,每個發布版本必須在提交到應用商店之前與我們雲端儲存空間中的語言包相關聯。當發布版本發佈在應用商店中時,語言包將從雲存儲下載或在本地化初始化期間從磁盤載入,作為應用啟動的一部分。客戶端將訪問語言包並將翻譯資料下載到記憶體中。之後,每當調用字串 API 時,都會從解析的資料中找尋它的翻譯。

LangPack_1.webp

建立語言包

每天都會在每個 Meta 應用程式的程式碼庫中建立或修改許多本機字串。我們構建了一個自動化系統來提取字串、從資料庫中收集翻譯並將它們捆綁在一起。對於每個發布的版本,都有一個構建步驟,用於根據最新版本中的字串為所有受支援的語言環境構建語言包,並將語言包上傳到雲端儲存空間。

LangPack_2.webp

建立 FBT 字串

FBT 是一個開源本地化框架,它提供了一種更有效的方式來定義內容以實現靈活和高品質的本地化。這是一個簡單的函數包裝器,原本是英文文本。該框架旨在便於工程師使用。

Example: simple text

fbt('Hello, World', 'a simple example', {project:"foo"})

// Translation: "Hello, World"

Example: complex string

fbt("View " +
     fbt.name('user', shortName, gender) +
       "'s Timeline - " +
       fbt.plural('follower', count, {many: 'followers', showCount: 'yes'}),
     'In user composer, gives details about the person to who the post is directed.',
   )

// Translation: "View Lu's timeline - 1 follower"
// Translation: "View Lu's timeline - 5 follower"

Extraction 提取

搭配以下兩個:

  • id:由 text + description + relevant metadata 組成的雜湊鍵
  • text_or_table:多層級查詢表,每個級別都根據 FBT 定義查找值 callsite

Example: extracted object of complex string in above section

[
  {
    "description": "In user composer, gives details about the person to who the post is directed.",
    "id": "4sIjkwerw",
    "text_or_table": {
      "UNKNOWN": {
        "ONE": "View {user}'s Timeline - 1 follower",
        "OTHER": "View {user}'s Timeline - {number} followers"
      }
    },
    "variations": [
      {
        "type": "GENDER",
        "token": "user"
      },
      {
        "type": "NUMBER",
        "token": "number"
      }
    ],
    "tokens": {
      "name": "%1$@",
      "number": "%2$ld"
    }
  }
]

後續的改進

對於無法下載語言包或網路不穩定的人,會進行兩項改進

  • 在新版本安裝完成之前,在現有的 Client 端中提取已下載的語言包
  • 因為大多數的翻譯不會常常需要變動,在本地初始化中,如果目標的語言包不能用,會載入一個較舊的版本。

Reference

Software development

Part 15 of 50

A series about software engineering

Up next

網頁渲染技術整理

SSR SSG CSR ISR DPR

More from this blog

如何開始入門軟體工程領域 - 名詞解釋(長期更新)

現在應該開始有很多人想要踏入軟體工程的領域,但在進入這個領域之前,覺得先了解一些名詞,可以在入門時更有方向也更知道要用什麼關鍵字去找尋有用的資訊。這篇文章就是想要幫助想要入門的人理解一些軟體工程裡的專有名詞。 作業系統 這一區塊主要解釋跟作業系統層面相關的名詞 英文中文解釋 Operation system 簡稱 OS | 作業系統 | 就是電腦的作業系統,是三大作業系統分別是:Linux、Windows、macOS | | Linux | | 自由和開放原始碼的 UNI...

May 10, 2023

我的 MacBook Pro (Apple Silicon) 設定

現在開始因為 ChatGPT 的出現,各種 AI 助手的功能都跑出來了。想想自己用了許久的環境設定也應該要來重新審視和建立新的開發環境了,僅此紀錄我個人的環境配置步驟和設定。 環境前置步驟 還原 MacBook Pro 至全新環境 macOS(全部資料刪除) 設定好初始設定後,登入 Apple ID 進入 App Store 確定 macOS 版本和預設 APP 都更新到最新 macOS 版本 到系統設定調整所有設定至個人習慣的設定 三指拖移 觸控板手勢開啟 防火牆開啟 輸入法設定...

Apr 25, 2023

ChatGPT 下的發展預想

從 ChatGPT 問世到現在,有許許多多的文章和討論出來。先從最早的 Google 要完蛋了,到後來的工作要被取代了,工程師失業了。 我就比較沒有想要馬上出來評論一下,我喜歡讓子彈飛一會兒。跟討論一下我自己比較在意的討論點。 Google 為什麼慢了? 結論:因為他需要更小心 很多人說 Google 怎麼被微軟搶先了一步。剛開始 Bing 說要加上 AI 的時候大家都在說 Google 怎麼慢了。我就馬上跑去看 OpenAI 的網站,靠北呀啊就 Azure 贊助的。那當然在正式上線 ChatG...

Mar 23, 2023

不工程的攻城獅

223 posts

I am not a programmer because I am not good at programming. But I do programming. Love to learn new things. An animal lover and a dancer. My oshi is 潤羽るしあ.