Magic Translate vs. next-intl

next-intl jest najczęściej używaną biblioteką i18n dla Next.js. Współpracuje z routerem aplikacji i komponentami React Server i jest zbudowany wokół plików wiadomości z kluczem dla każdej wiadomości. Magic Translate renderuje również w pełni przetłumaczone strony na serwerze, ale piszesz tekst bezpośrednio w swoich komponentach, a tłumaczenia są tworzone dla Ciebie.

Na pierwszy rzut oka

	Magic Translate	next-intl
Jak piszesz tekst	Twoje własne słowa, owinięte w `<T>`	Klucz do każdej wiadomości, taki jak `t('title')`
Tłumaczenia	Tłumaczenie AI, tworzone automatycznie	Ty lub Twoi tłumacze piszesz je
Pliki wiadomości	Żaden	Jeden plik JSON na język
Nowe języki	Dodaj ustawienia regionalne do listy	Przetłumacz każdą wiadomość na nowy język
Renderowanie serwera	Komponenty serwera React, w pełni przetłumaczone HTML	Komponenty serwera React, w pełni przetłumaczone HTML
Lokalne routing	Użyj segmentu `[locale]`	Wbudowane routing i oprogramowanie pośrednie
Cena	Bezpłatny plan, następnie plany miesięczne oparte na użyciu	Otwarte źródło i za darmo

Czym różni się kod

W next-intl przechowujesz plik wiadomości dla każdego języka i odnosisz się do każdej wiadomości za pomocą klucza:

// messages/en.json
{ "HomePage": { "title": "Welcome to our website" } }

// app/[locale]/page.tsx
import { getTranslations } from 'next-intl/server';

export default async function HomePage() {
  const t = await getTranslations('HomePage');
  return <h1>{t('title')}</h1>;
}

Z Magic Translate tekst pozostaje na stronie:

// app/[locale]/page.tsx
import { createLocalizedT } from '@magic-translate/react-ssr';
import { translate } from '@/lib/translate';

export default async function HomePage({
  params
}: {
  params: Promise<{ locale: string }>;
}) {
  const { locale } = await params;
  const { T } = createLocalizedT(translate, locale);

  return (
    <h1>
      <T>Welcome to our website</T>
    </h1>
  );
}

Przewodnik Next.js pokazuje pełną konfigurację.

Kiedy wybrać Magic Translate

Chcesz mieć witrynę Next.js w wielu językach bez utrzymywania plików wiadomości.
Twój tekst często się zmienia, i chcesz, aby każdy język był na bieżąco.
Nie masz tłumaczy lub chcesz wydawać aktualizacje bez czekania na tłumaczenia.

Kiedy wybrać next-intl

Cały tekst musi zostać przetłumaczony lub sprawdzony przez osobę.
Potrzebujesz dokładnej kontroli nad liczbami liczbowymi, datami i liczbami dzięki wiadomościom ICU.
Potrzebujesz bezpłatnej biblioteki typu open source bez zewnętrznej usługi.

Korzystanie z obu

Możesz zachować next-intl dla trasowania i formatowania ustawień regionalnych, a dla tekstu użyć Magic Translate. Przekaż ustawienia regionalne z next-intl do createLocalizedT i zamień klucze na <T> jedną stronę na raz.

Gotowy do wypróbowania? Postępuj zgodnie z instrukcjami dotyczącymi rozpoczę cia pracy, aby przetłumaczyć pierwszy komponent w pięć minut.