Contenu dynamique
Bref aperçu de l’utilisation du contenu dynamique dans GT.
Vue d’ensemble
Le contenu dynamique désigne généralement tout contenu susceptible de changer selon l’utilisateur, le contexte, l’environnement, etc. À l’inverse, le contenu statique reste identique quel que soit l’utilisateur, le contexte, l’environnement, etc.
« Tx ou pas Tx »
Parfois, nous voulons traduire du contenu dynamique, et d’autres fois nous préférons qu’il reste tel quel.
Un bon exemple serait l’adresse e‑mail ou le nom d’un utilisateur. Un autre exemple pourrait être le solde d’un compte bancaire ou le numéro de sécurité sociale d’un utilisateur. Ces éléments (1) n’ont vraisemblablement pas besoin d’être traduits lorsque votre application s’affiche dans une autre langue et (2) peuvent varier (ici, d’un utilisateur à l’autre).
Exemple
import { T, Var } from 'gt-next'
export default function Greeting(name) {
return (
<T id='greeting'>
Bonjour, <Var>{name}</Var> !
</T>
);
}En matière de traduction, cela présente deux avantages :
- Vous n’avez pas à créer une traduction pour chaque nom possible.
- En utilisant
<Var>, nous ne générons qu’une seule traduction qui ressemblerait essentiellement à ceci :¡Hola, ${name}!
- Si nous n’utilisons pas
<Var>, nous devrions effectuer une on-demand translation pour chaque nom unique :- « ¡Hola, Alice! », « ¡Hola, Bob! », « ¡Hola, Charlie! », « ¡Hola, David! », ...
- En utilisant
- Vous n’avez pas non plus à craindre que les noms eux-mêmes soient convertis en une forme traduite de leur nom (p. ex. « ¡Hola, Alicia! », « ¡Hola, Roberto! », ...).
Comme vous pouvez le voir, le composant <Var> doit être utilisé pour encapsuler tout contenu qui doit rester identique, quel que soit le locale.
Ainsi, nous évitons d’avoir à créer des traductions pour chaque valeur possible du contenu dynamique.
En encapsulant des informations privées dans un composant <Var>, vous vous assurez que ces informations ne sont pas envoyées à l’API General Translation.
Exceptions
Les exceptions à l’énoncé ci-dessus sont (1) le cas d’un composant <T> imbriqué utilisé à l’intérieur d’un composant <Var> (c.-à-d. que les children du composant <T> imbriqué seront traduits)
ou (2) lorsque des données sont intentionnellement transmises à notre API par un autre moyen au sein d’un enfant du composant <Var> (p. ex. un appel fetch).
Cependant, ce n’est pas l’utilisation prévue du composant <Var> ni de l’API General Translation et cela peut nuire aux temps de chargement et aux performances.
Que pensez-vous de ce guide ?