言語への長い道のり
私はかなり前から、面白くてやりがいのあるアイデアを思いついています。最小限のメンテナンスでWebアプリの多言語サポートを実現するには、何が必要でしょうか。また、コストを主な制約として考慮します（このサイトは広告を配信せず、追跡もまったく使用しないため、ここでは収益はありません）、有効なソリューションはどのようになりますか？
計画
すべては、使用する翻訳エンジンで開始および終了します。毎日のドライバーの1つとしてUbuntuを使用したおかげで、アプリストアで「Argostranslate」という素敵な小さなアプリを見つけました。これは、DeepLを強化するものと同様の最新のMLモデルに基づいて構築されたオープンソースの翻訳エンジンです。 。 DeepLをご存じない場合は、ウェブサイトで無料で使用できる優れた翻訳者です。
しかし、アルゴスに話を戻しましょう。関連するリポジトリを調べたところ、OSS python-libも利用可能であり、セルフホスト環境にうまく適合していることがわかりました。少しの間いじった後、SaaSオファーを介していくつかの翻訳者を調べることにしました。これは、argos translateの分割払いプロセス全体が、思ったほどうまく機能しなかったためです。
そのため、私は別のサービスであるGCPのCloud Translationsを設定しました。このサービスは、月額500,000文字を無料で提供し、1,000,000ごとにいくらかの料金を請求します。
キャッシングがすべてです
Next.jsとISG（インクリメンタルサイト生成）のセットアップのおかげで、各ページの翻訳をオンデマンドで呼び出すことができます。これにより、すべての翻訳を一度に実行する必要がないため、計画が非常に簡単になります。
それでも、翻訳された文字列のキャッシュを処理する方法については確信が持てませんでした。確かに、Vercelのエッジネットワーク（このPWAがホストされている場所）は、このタスクを完全に活用できます。しかし、私は展開が翻訳から独立していることを望みました。これが、同じくGCPでホストされている単純なFirestoreインスタンスを介してキャッシュの1つの追加レイヤーを作成した理由です。
最大の課題は、すべての記事のブロックコンテンツの解析と置換でした。わからない場合。ブロックコンテンツは、CMSで私が作成した記事の実際の本文を説明します。翻訳時には、これらのブロックはプレーンテキストではなく、セマンティック情報またはメタデータの保存を可能にするために、それぞれが特別なデータ構造に埋め込まれています。関連する文字列のみを確実に検出して翻訳することは、この実装の大きな部分の1つでした。
一人の男、12以上の言語
（現在）サポートされている言語は次のとおりです。
- 「en」：英語
- 「de」：ドイツ語
- 「fr」：フランス語
- 「es」：スペイン語
- 「eo」：エスペラント
- 「el」：ギリシャ語
- 「ja」：日本語
- 「ru」：ロシア語
- 「こんにちは」：ヒンディー語
- 「彼」：ヘブライ語
- 「tr」：トルコ語
- 「af」：アフリカーンス語
- 「ar」：アラビア語
- 「ko」：韓国語
さまざまなバリアントをテストするには、ベースURLの後に言語コードを配置するだけです。例：「https://flaming.codes/fr」。以上です！
私の実装を要約すると、セットアップは次のようになります。
- 各ページは、少なくとも4時間ごとに静的に構築されますが、オンデマンドでのみ構築されます。これは、特定のサイトで最大4時間ごとに新しい翻訳ジョブが実行されることを意味します
- 翻訳自体は最初にFirestoreから読み込まれます。利用可能なものがない場合にのみ、文字列は翻訳され、Firestoreにキャッシュされます
この設定は非常にうまく機能するため、従来の方法で翻訳を使用することはありません。 key-values-pairsを保持するjsonファイルを手動で作成します。国際化が必要なすべてのものにCloudTranslation APIを使用して、完全に動的にします。これらの変更のおかげで、PWAは執筆時点で約430ページあります。
各ページは英語から他の13の言語に翻訳されます。これらの言語は、最も話されている言語と、その間にある世界中の言語を表しています。それがどのように進化するか見てみましょう！
- Tom
