ユースケース
多言語の静的サイト
Astro で作っていて、10 言語が欲しく、そのために重いランタイムは入れたくない。
課題
- クライアント側の i18n は重さと、初回描画のちらつきをもたらします。
- 10 本のファイルツリーを手で揃え続けるのは、それ自体がひとつの仕事になります。
- 文言をひとつ直すたびに、ビルドとデプロイをまるごとやり直すことになります。
Sonenta が変えること
@sonenta/astroがビルド時にバンドルを取得し、静的 HTML に埋め込みます。クライアント JavaScript はゼロです。- 仮想モジュール
sonenta:i18nがカタログを提供し、ソース言語にフォールバックします。 - 画面ごとのバリアントは CDN のオーバーレイとして届きます。二本目のツリーを持つ必要はありません。
このページ自体が証拠です。sonenta.com はこれで動いていて、13 言語あります。いま読んでいるテキストは、ビルド時に CDN から取得されたものです。
始め方
// astro.config.mjs
import sonenta from "@sonenta/astro";
export default defineConfig({
integrations: [
sonenta({ project: "proj_xxx", version: "main",
locales: ["fr","en","es"], defaultLocale: "fr" }),
],
});
// dans un composant : zéro JavaScript client
import { getT } from "sonenta:i18n";既知の制限
- バンドルはビルド時に固定されます。後から翻訳を公開するには静的サイトを再ビルドする必要があり、実行時に読み込むアプリとはそこが違います。
- フォントのサブセット化と文字体系ごとの調整はあなたの担当のままです。Sonenta が届けるのはテキストであって、タイポグラフィではありません。