Nuxt I18n Micro

Nuxt I18n Micro は、Nuxt向けの高速でシンプル、軽量な国際化（i18n）モジュールです。コンパクトなサイズにもかかわらず、大規模プロジェクトを念頭に設計されており、nuxt-i18nなどの従来のi18nソリューションと比べて大幅なパフォーマンス向上を実現します。このモジュールは、ビルド時間の最小化、サーバー負荷の軽減、バンドルサイズの縮小に重点を置いて、高度な効率性を追求してゼロから構築されました。

Nuxt I18n Microを選ぶ理由

Nuxt I18n Microモジュールは、特にトラフィックの高い環境や大規模な翻訳ファイルを使用するプロジェクトにおいて、元のnuxt-i18nモジュールに見つかった重大なパフォーマンスの問題に対処するために作成されました。nuxt-i18nの主な問題は次のとおりです。

高メモリ消費：ビルド時と実行時の両方で大量のメモリを消費し、パフォーマンスのボトルネックになります。
低速なパフォーマンス：特に大規模な翻訳ファイルでは、ビルド時間とサーバーレスポンスの顕著な遅延を引き起こします。
大きなバンドルサイズ：大きなバンドルを生成し、アプリケーションのパフォーマンスに悪影響を及ぼします。
メモリリークとバグ：高負荷下でのメモリリークや予測できない動作が知られています。

パフォーマンス比較

Nuxt I18n Microの効率性を示すために、同一条件下でテストを行いました。両方のモジュールは、同じハードウェアで10MBの翻訳ファイルを使用してテストされました。

ビルド時間とリソース消費

Nuxt I18n:

合計サイズ：54.7 MB（3.31 MB gzip）
最大CPU使用率: 391.4%
最大メモリ使用量：8305 MB
経過時間：0時間1分31秒

Nuxt I18n Micro:

合計サイズ：1.93 MB（473 kB gzip）— 96％削減
最大CPU使用率：220.1％— 44％低下
最大メモリ使用量：655 MB— 92％メモリ削減
経過時間：0時間0分5秒— 94％高速化

サーバーパフォーマンス（1万リクエスト）

Nuxt I18n:

1秒あたりのリクエスト数：49.05 #/秒（平均）
リクエストあたりの時間：611.599 ms（平均）
最大メモリ使用量：703.73 MB

Nuxt I18n Micro:

1秒あたりのリクエスト数：61.18 #/秒（平均）— 1秒あたりのリクエスト数が25％増加
リクエストあたりの時間：490.379 ms（平均）— 20％高速化
最大メモリ使用量：323.00 MB— メモリ使用量が54％削減

これらの結果は、Nuxt I18n Microがすべての重要な領域で元のモジュールを大幅に上回っていることを明確に示しています。

主な機能

🌐 コンパクトでありながら強力：小さなサイズにもかかわらず、Nuxt I18n Microは大規模プロジェクト向けに設計されており、パフォーマンスと効率性を重視しています。
⚡ 最適化されたビルドとランタイム：ビルド時間、メモリ使用量、サーバー負荷を削減し、トラフィックの高いアプリケーションに最適です。
🛠 ミニマリスト設計：このモジュールはわずか5つのコンポーネント（1つのモジュールと4つのプラグイン）で構成されているため、理解、拡張、保守が容易です。
📏 効率的なルーティング：ロケールの数に関係なく、動的な正規表現ベースのルーティングのおかげで、2つのルートしか生成しません。これは、各ロケールに個別のルートを生成する他のi18nモジュールとは異なります。
🗂 合理化された翻訳の読み込み：JSONファイルのみがサポートされ、翻訳は共通のテキスト（例：メニュー）用のグローバルファイルと、ページ固有のファイル（存在しない場合は開発モードで自動生成されます）に分割されます。

クイックセットアップ

Nuxtアプリケーションにモジュールをインストールするには、

npm install nuxt-i18n-micro

次に、nuxt.config.tsに追加します。

export default defineNuxtConfig({
  modules: [
    'nuxt-i18n-micro',
  ],
  i18n: {
    locales: [
      { code: 'en', iso: 'en-US', dir: 'ltr' },
      { code: 'fr', iso: 'fr-FR', dir: 'ltr' },
      { code: 'ar', iso: 'ar-SA', dir: 'rtl' },
    ],
    defaultLocale: 'en',
    translationDir: 'locales',
    meta: true,
  },
})