Назад

gt-next@6.12.0

Ernest McCarter avatarErnest McCarter
gt-nextv6.12.0declareStaticdeclareVardecodeVarstranslationi18nstring functionssentence fragmentation

Обзор

В gt-next@6.8.0 мы представили компонент <Static>, чтобы решить проблему фрагментации предложений и повторного использования кода в JSX‑контенте. Компонент позволяет вызывать статические функции напрямую внутри переводов, при этом сохраняя согласование слов, спряжение и порядок слов между языками. Однако для строковых переводов с использованием gt() и msg() оставался пробел. Как и в случае с JSX, многие приложения сильно зависят от создания строк через utility‑функции, особенно в зрелых кодовых базах, где переводимый контент разбросан по сервисам, утилитам и бизнес‑логике.

gt-next 6.12.0 закрывает этот пробел, добавляя declareStatic() — строковый эквивалент компонента <Static> — вместе с поддерживающими функциями declareVar() и decodeVars().

Основные возможности

declareStatic()

Работает аналогично <Static>, но применяется к строковым функциям. Интерфейс командной строки (CLI) анализирует все возможные пути выполнения и создаёт отдельные записи перевода для каждого результата.

const getDisplayName = (name) => {
  return name ? declareVar(name) : 'Someone';
};

gt(`${declareStatic(getDisplayName(name))} says hello.`);

declareVar()

Строковый эквивалент <Var> — помечает динамический контент внутри функций declareStatic(), который должен быть исключён из вычисления хэша и обрабатываться как переменные во время выполнения. Это делается путём оборачивания динамического контента в совместимое с ICU выражение select, которое при интерполяции разрешается в исходный динамический контент.

const greeting = "Hello, " + declareVar(name);
// "Hello, {_gt_, select, other {name}}"

decodeVars()

Поскольку declareVar() добавляет в исходный текст маркеры, совместимые с ICU, использование одного только declareVar() может вызвать проблемы с существующей логикой обработки строк. Чтобы получить исходное значение, просто оберните исходную строку в decodeVars().

const greeting = "Hello, " + declareVar("Brian");
// "Hello, {_gt_, select, other {Brian}}"
const decodedGreeting = decodeVars(greeting);
// "Hello, Brian"

Дополнительные улучшения

Улучшенные строковые функции

Функции gt() и msg() теперь поддерживают объединение только статических строк:

gt("Hello " + "world");
msg("Welcome, " + "Brian");

Расширенная поддержка <Static>

Ранее компонент <Static> поддерживал только вызовы функций в качестве дочерних элементов. Теперь он поддерживает любые JSX‑выражения, вычисляемые на этапе сборки, такие как вложенный JSX‑текст, тернарные операторы, условные конструкции и вызовы функций.

function getDisplayName(name) {
  return name ? <Var>{name}</Var> : 'Кто-то';
};
...
<T>
  <Static>
    Привет, {getDisplayName("Brian")}!
    {
      isFriend ? " Как дела?" : " Как дела?"
    }
  </Static>
</T>

Рекомендации по производительности

Как и <Static>, declareStatic() увеличивает количество записей перевода. Каждый вызов функции с несколькими вариантами создает отдельные переводы, а несколько вызовов declareStatic() в одной и той же строке экспоненциально увеличивают общее число записей. Используйте этот механизм взвешенно и отдавайте предпочтение конструкциям ICU select, когда фактор умножения становится чрезмерным.