# gt-next: General Translation Next.js SDK: Cache Components
URL: https://generaltranslation.com/it/docs/next/guides/cache-components.mdx
---
title: Cache Components
description: Configurare i Cache Components in gt-next
---

Questa guida mostra come usare gt-next con i Cache Components di Next.js per ottimizzare le applicazioni internazionalizzate.

***

## Setup

Se non l'hai ancora fatto, segui la [guida ai Cache Components di Next.js](https://nextjs.org/docs/app/getting-started/cache-components) per configurare i Cache Components nel tuo progetto.

<Steps>
  <Step>
    ### Abilita il supporto per i Cache Components nella configurazione di gt-next:

    ```js title="next.config.js"
    const nextConfig = {
      cacheComponents: true,
    };

    export default withGTConfig(nextConfig, {
      experimentalLocaleResolution: true,
    });
    ```
  </Step>

  <Step>
    ### Abilita il middleware

    Consulta la guida completa al middleware [qui](/docs/next/guides/middleware).

    ```ts
    import { createNextMiddleware } from 'gt-next/middleware';

    export default createNextMiddleware();

    export const config = {
    // Corrisponde a tutti i percorsi tranne le route API, i file statici e gli elementi interni di Next.js
    matcher: ['/((?!api|static|.*\\..*|_next).*)']
    };

    ```
  </Step>

  <Step>
    ### Aggiungi il parametro `locale` ai Cache Components con contenuti traducibili

    Quando usi Cache Components con contenuti traducibili, devi passare `locale` come parametro. In questo modo, ogni impostazione regionale avrà una voce di cache dedicata.

    ```tsx
    import { getLocale } from "gt-next/server"

    async function CachedContent({locale}: {locale: string}) {
      "use cache"
      return <T>Hello World</T>
    }

    export default async function Page() {
      const locale = await getLocale()
      return <CachedContent locale={locale} />
    }
    ```
  </Step>
</Steps>

## Note sulla configurazione

* Le funzioni `getLocale` personalizzate vengono sovrascritte
* Le funzioni `getRegion` e `getDomain` sono disabilitate
* Puoi personalizzare il nome del parametro dell&#39;impostazione regionale usato per la risoluzione con `experimentalLocaleResolutionParam` (il valore predefinito è `'locale'`)

```js title="next.config.js"
export default withGTConfig(nextConfig, {
  experimentalLocaleResolution: true,
  experimentalLocaleResolutionParam: 'lang', // Personalizzazione opzionale
});
```

***


## Passaggi successivi

* Leggi le note di rilascio di questa funzionalità, [gt-next@6.10.0](/devlog/gt-next_v6_10_0), per ulteriori informazioni.