# General Translation Changelog: gt-next 6.10.0: 実験的なキャッシュコンポーネントのサポート
URL: https://generaltranslation.com/ja/blog/gt-next_v6_10_0.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 
Authors: Ernest McCarter
Published: 2025-12-03

## 概要

**gt-next 6.10.0** では、キャッシュコンポーネントの実験的サポートが `experimentalLocaleResolution` とともに導入され、同時に gt-next@6.9 の従来の静的リクエスト関数は非推奨となりました。

* `experimentalLocaleResolution` による**キャッシュコンポーネントの実験的サポート**を追加
* `gt-next@6.9` の**従来の静的リクエスト関数**を非推奨化

***

## キャッシュコンポーネント

キャッシュコンポーネントのサポートを有効にするには、gt-next の設定に `experimentalLocaleResolution: true` を追加し、[Next.js の Cache Components ガイド](https://nextjs.org/docs/app/getting-started/cache-components)に従ってください。翻訳可能なコンテンツを含むキャッシュコンポーネントを使用する場合は、ロケールごとにキャッシュが正しく無効化されるよう、`locale` をパラメータとして渡す必要があります。

次のようなアプリケーション構成を考えてみましょう。

```tsx title="page.tsx"
import { Suspense } from "react";
import { getLocale, getLocales } from "gt-next/server";

export const generateStaticParams = () => {
  return getLocales().map(locale => ({ locale }))
}

async function CachedContent({locale: _locale}: {locale: string}) {
  "use cache"
  return (
    <div>
      <T><h1>Cached Content</h1></T>
    </div>
  )
}
export default async function Home() {
  const locale = await getLocale()
  return (
    <div>
      <CachedContent locale={locale} />
    </div>
  );
}
```


### `locale` パラメータの要件

キャッシュコンポーネントは、パラメータをキャッシュキーとして使用します。そのため、翻訳可能なコンテンツを含むキャッシュコンポーネントが、ユーザーのロケール変更時に更新されるようにするには、`locale` パラメータを受け取る必要があります。たとえば、`CachedContent` はロケールごとに個別のキャッシュエントリを作成するため、`locale` パラメータを受け取る必要があります。このパラメータがないと、ユーザーのロケールに関係なく、コンポーネントは常に同じキャッシュ済みコンテンツを返します。

### 設定に関する注意

`experimentalLocaleResolution` が有効な場合:

* ロケール解決を機能させるには、I18n プロキシを有効にする必要があります ([I18n Proxy](/docs/react/nextjs/app-router-middleware) を参照)
* カスタムの [`getLocale`](/docs/react/nextjs/reference/functions/get-locale) 関数はすべて無視されます (ロケール解決は URL パスを読み取ります)
* [`getRegion`](/docs/react/nextjs/reference/functions/get-region) 関数と `getDomain` 関数は無効化されます
* 非推奨の `experimentalEnableSSG` 設定と競合するため、同時に有効にできるのはどちらか 1 つだけです
* `experimentalLocaleResolutionParam` を使ってロケールパラメータ名をカスタマイズできます (デフォルトは `'locale'` です)

```js
export default withGTConfig(nextConfig, {
  experimentalLocaleResolution: true,
  // パラメータ名を任意でカスタマイズ
  experimentalLocaleResolutionParam: 'lang',
})
```

***

## 従来の静的リクエスト関数の非推奨化

gt-next@6.9 で静的レンダリングのサポートが導入されたことを受け、従来の静的リクエスト関数 (`getStaticLocale`、`getStaticRegion`、`getStaticDomain`) は、標準のリクエスト関数 ([`getLocale`](/docs/react/nextjs/reference/functions/get-locale)、[`getRegion`](/docs/react/nextjs/reference/functions/get-region)、`getDomain`) へ移行する形で非推奨となります。

この変更は、機能を完全に維持したまま API を簡素化するという方針に沿ったものです。従来の静的関数は引き続き利用できますが、非推奨警告が表示されます。一貫性を保つため、[標準のリクエスト関数への移行](#migration-guide)を推奨します。

***

## 移行ガイド

### レガシー SSG

非推奨の静的リクエスト関数を置き換えます：

```js title="next.config.js"
// 変更前（非推奨）
export default withGTConfig(nextConfig, {
  experimentalEnableSSG: true,
})

// 変更後  
export default withGTConfig(nextConfig, {
  // デフォルトで利用可能
})
```

カスタムの `getStaticLocale`、`getStaticRegion`、`getStaticDomain` 関数は削除し、代わりに [`getLocale`](/docs/react/nextjs/reference/functions/get-locale)、[`getRegion`](/docs/react/nextjs/reference/functions/get-region)、`getDomain` のカスタム関数を使用してください。カスタムの [`getLocale`](/docs/react/nextjs/reference/functions/get-locale) 関数を追加し、[`getRegion`](/docs/react/nextjs/reference/functions/get-region) 関数は無効にする必要があります。詳細は、[SSG ガイド](/docs/react/nextjs/app-router-static-site-generation)を参照してください。

```ts title="getLocale.ts"
import { locale } from "next/root-params";

export default async function getLocale() {
  return await locale();
}
```

```ts title="getRegion.ts"
export default async function getRegion() {
  return undefined;
}
```

### キャッシュコンポーネント向け

実験的なロケール解決を有効にし、キャッシュコンポーネントにロケールパラメータが渡されるようにします。

```js
const nextConfig = {
  cacheComponents: true,
}

// 設定
export default withGTConfig(nextConfig, {
  experimentalLocaleResolution: true,
})
```

```tsx
// コンポーネントの実装
async function MyCachedComponent({locale}: {locale: string}) {
  "use cache"
  // 国際化されたコンテンツをここに記述
  return <T>Content for <Var>{locale}</Var></T>
}

// 使用例
export default async function Page() {
  const locale = await getLocale()
  return <MyCachedComponent locale={locale} />
}
```

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.