@intlayer/docs 5.8.0-canary.0 → 5.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (223) hide show
  1. package/blog/ar/intlayer_with_next-i18next.md +2 -2
  2. package/blog/ar/next-i18next_vs_next-intl_vs_intlayer.md +96 -219
  3. package/blog/ar/react-i18next_vs_react-intl_vs_intlayer.md +88 -129
  4. package/blog/ar/vue-i18n_vs_intlayer.md +268 -0
  5. package/blog/de/intlayer_with_next-i18next.md +2 -2
  6. package/blog/de/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  7. package/blog/de/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  8. package/blog/de/vue-i18n_vs_intlayer.md +268 -0
  9. package/blog/en/intlayer_with_next-i18next.md +2 -2
  10. package/blog/en/next-i18next_vs_next-intl_vs_intlayer.md +89 -220
  11. package/blog/en/react-i18next_vs_react-intl_vs_intlayer.md +85 -123
  12. package/blog/en/vue-i18n_vs_intlayer.md +268 -0
  13. package/blog/en-GB/intlayer_with_next-i18next.md +2 -2
  14. package/blog/en-GB/next-i18next_vs_next-intl_vs_intlayer.md +85 -218
  15. package/blog/en-GB/react-i18next_vs_react-intl_vs_intlayer.md +80 -130
  16. package/blog/en-GB/vue-i18n_vs_intlayer.md +258 -0
  17. package/blog/es/intlayer_with_next-i18next.md +2 -2
  18. package/blog/es/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  19. package/blog/es/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  20. package/blog/es/vue-i18n_vs_intlayer.md +268 -0
  21. package/blog/fr/intlayer_with_next-i18next.md +2 -2
  22. package/blog/fr/next-i18next_vs_next-intl_vs_intlayer.md +91 -214
  23. package/blog/fr/react-i18next_vs_react-intl_vs_intlayer.md +86 -127
  24. package/blog/fr/vue-i18n_vs_intlayer.md +269 -0
  25. package/blog/hi/intlayer_with_next-i18next.md +2 -2
  26. package/blog/hi/next-i18next_vs_next-intl_vs_intlayer.md +97 -220
  27. package/blog/hi/react-i18next_vs_react-intl_vs_intlayer.md +89 -130
  28. package/blog/hi/vue-i18n_vs_intlayer.md +268 -0
  29. package/blog/it/intlayer_with_next-i18next.md +2 -2
  30. package/blog/it/next-i18next_vs_next-intl_vs_intlayer.md +91 -214
  31. package/blog/it/react-i18next_vs_react-intl_vs_intlayer.md +86 -127
  32. package/blog/it/vue-i18n_vs_intlayer.md +268 -0
  33. package/blog/ja/intlayer_with_next-i18next.md +2 -2
  34. package/blog/ja/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  35. package/blog/ja/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  36. package/blog/ja/vue-i18n_vs_intlayer.md +268 -0
  37. package/blog/ko/intlayer_with_next-i18next.md +2 -2
  38. package/blog/ko/next-i18next_vs_next-intl_vs_intlayer.md +95 -217
  39. package/blog/ko/react-i18next_vs_react-intl_vs_intlayer.md +89 -130
  40. package/blog/ko/vue-i18n_vs_intlayer.md +268 -0
  41. package/blog/pt/intlayer_with_next-i18next.md +2 -2
  42. package/blog/pt/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  43. package/blog/pt/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  44. package/blog/pt/vue-i18n_vs_intlayer.md +268 -0
  45. package/blog/ru/intlayer_with_next-i18next.md +2 -2
  46. package/blog/ru/next-i18next_vs_next-intl_vs_intlayer.md +94 -217
  47. package/blog/ru/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  48. package/blog/ru/vue-i18n_vs_intlayer.md +268 -0
  49. package/blog/zh/intlayer_with_next-i18next.md +2 -2
  50. package/blog/zh/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  51. package/blog/zh/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  52. package/blog/zh/vue-i18n_vs_intlayer.md +269 -0
  53. package/dist/cjs/generated/blog.entry.cjs +41 -0
  54. package/dist/cjs/generated/blog.entry.cjs.map +1 -1
  55. package/dist/esm/generated/blog.entry.mjs +41 -0
  56. package/dist/esm/generated/blog.entry.mjs.map +1 -1
  57. package/dist/types/generated/blog.entry.d.ts +1 -0
  58. package/dist/types/generated/blog.entry.d.ts.map +1 -1
  59. package/docs/ar/formatters.md +417 -31
  60. package/docs/ar/how_works_intlayer.md +2 -4
  61. package/docs/ar/interest_of_intlayer.md +7 -10
  62. package/docs/ar/intlayer_CMS.md +2 -3
  63. package/docs/ar/intlayer_visual_editor.md +2 -3
  64. package/docs/ar/intlayer_with_tanstack.md +1 -1
  65. package/docs/ar/introduction.md +4 -4
  66. package/docs/de/formatters.md +444 -34
  67. package/docs/de/introduction.md +2 -2
  68. package/docs/en/dictionary/enumeration.md +2 -2
  69. package/docs/en/dictionary/function_fetching.md +2 -2
  70. package/docs/en/dictionary/get_started.md +2 -2
  71. package/docs/en/dictionary/translation.md +2 -2
  72. package/docs/en/formatters.md +383 -15
  73. package/docs/en/how_works_intlayer.md +2 -4
  74. package/docs/en/interest_of_intlayer.md +40 -29
  75. package/docs/en/intlayer_CMS.md +2 -3
  76. package/docs/en/intlayer_visual_editor.md +2 -3
  77. package/docs/en/intlayer_with_create_react_app.md +2 -2
  78. package/docs/en/intlayer_with_express.md +2 -2
  79. package/docs/en/intlayer_with_tanstack.md +1 -1
  80. package/docs/en/introduction.md +4 -4
  81. package/docs/en/packages/express-intlayer/index.md +2 -2
  82. package/docs/en/packages/intlayer/getConfiguration.md +2 -3
  83. package/docs/en/packages/intlayer/getEnumeration.md +2 -7
  84. package/docs/en/packages/intlayer/getHTMLTextDir.md +2 -4
  85. package/docs/en/packages/intlayer/getLocaleLang.md +2 -4
  86. package/docs/en/packages/intlayer/getLocaleName.md +2 -3
  87. package/docs/en/packages/intlayer/getLocalizedUrl.md +2 -8
  88. package/docs/en/packages/intlayer/getMultilingualUrls.md +2 -7
  89. package/docs/en/packages/intlayer/getPathWithoutLocale.md +2 -3
  90. package/docs/en/packages/intlayer/getTranslation.md +2 -4
  91. package/docs/en/packages/intlayer/index.md +2 -2
  92. package/docs/en/packages/next-intlayer/index.md +2 -2
  93. package/docs/en/packages/next-intlayer/t.md +2 -2
  94. package/docs/en/packages/next-intlayer/useDictionary.md +2 -2
  95. package/docs/en/packages/next-intlayer/useIntlayer.md +2 -2
  96. package/docs/en/packages/next-intlayer/useLocale.md +2 -2
  97. package/docs/en/packages/react-intlayer/index.md +2 -2
  98. package/docs/en/packages/react-intlayer/t.md +2 -2
  99. package/docs/en/packages/react-intlayer/useI18n.md +2 -2
  100. package/docs/en/packages/react-intlayer/useIntlayer.md +2 -2
  101. package/docs/en/packages/react-intlayer/useLocale.md +2 -2
  102. package/docs/en/packages/react-scripts-intlayer/index.md +2 -2
  103. package/docs/en/packages/solid-intlayer/index.md +2 -2
  104. package/docs/en/packages/vite-intlayer/index.md +2 -2
  105. package/docs/en-GB/formatters.md +402 -16
  106. package/docs/en-GB/how_works_intlayer.md +2 -4
  107. package/docs/en-GB/interest_of_intlayer.md +7 -10
  108. package/docs/en-GB/intlayer_with_tanstack.md +1 -1
  109. package/docs/en-GB/introduction.md +2 -2
  110. package/docs/es/formatters.md +438 -28
  111. package/docs/es/how_works_intlayer.md +2 -4
  112. package/docs/es/interest_of_intlayer.md +7 -10
  113. package/docs/es/intlayer_with_tanstack.md +1 -1
  114. package/docs/es/introduction.md +2 -2
  115. package/docs/fr/formatters.md +438 -28
  116. package/docs/fr/how_works_intlayer.md +2 -4
  117. package/docs/fr/interest_of_intlayer.md +7 -10
  118. package/docs/fr/intlayer_with_tanstack.md +1 -1
  119. package/docs/fr/introduction.md +2 -2
  120. package/docs/hi/formatters.md +430 -39
  121. package/docs/hi/how_works_intlayer.md +2 -4
  122. package/docs/hi/interest_of_intlayer.md +7 -10
  123. package/docs/hi/intlayer_with_tanstack.md +1 -1
  124. package/docs/hi/introduction.md +2 -2
  125. package/docs/it/formatters.md +438 -30
  126. package/docs/it/how_works_intlayer.md +2 -4
  127. package/docs/it/interest_of_intlayer.md +7 -10
  128. package/docs/it/intlayer_with_tanstack.md +1 -1
  129. package/docs/it/introduction.md +2 -2
  130. package/docs/ja/formatters.md +435 -47
  131. package/docs/ja/how_works_intlayer.md +2 -4
  132. package/docs/ja/interest_of_intlayer.md +7 -10
  133. package/docs/ja/intlayer_with_tanstack.md +1 -1
  134. package/docs/ja/introduction.md +2 -2
  135. package/docs/ko/formatters.md +432 -41
  136. package/docs/ko/how_works_intlayer.md +2 -4
  137. package/docs/ko/interest_of_intlayer.md +7 -10
  138. package/docs/ko/intlayer_with_tanstack.md +1 -1
  139. package/docs/ko/introduction.md +2 -2
  140. package/docs/pt/formatters.md +416 -30
  141. package/docs/pt/how_works_intlayer.md +2 -4
  142. package/docs/pt/intlayer_with_tanstack.md +1 -1
  143. package/docs/pt/introduction.md +2 -2
  144. package/docs/ru/autoFill.md +2 -2
  145. package/docs/ru/configuration.md +1 -40
  146. package/docs/ru/formatters.md +438 -28
  147. package/docs/ru/how_works_intlayer.md +5 -7
  148. package/docs/ru/index.md +1 -1
  149. package/docs/ru/interest_of_intlayer.md +8 -11
  150. package/docs/ru/intlayer_CMS.md +7 -8
  151. package/docs/ru/intlayer_cli.md +4 -7
  152. package/docs/ru/intlayer_visual_editor.md +5 -6
  153. package/docs/ru/intlayer_with_angular.md +1 -1
  154. package/docs/ru/intlayer_with_create_react_app.md +5 -5
  155. package/docs/ru/intlayer_with_lynx+react.md +1 -1
  156. package/docs/ru/intlayer_with_nextjs_15.md +3 -3
  157. package/docs/ru/intlayer_with_nextjs_page_router.md +2 -2
  158. package/docs/ru/intlayer_with_nuxt.md +1 -1
  159. package/docs/ru/intlayer_with_react_native+expo.md +2 -2
  160. package/docs/ru/intlayer_with_tanstack.md +3 -3
  161. package/docs/ru/intlayer_with_vite+preact.md +3 -3
  162. package/docs/ru/intlayer_with_vite+react.md +3 -3
  163. package/docs/ru/intlayer_with_vite+solid.md +1 -1
  164. package/docs/ru/intlayer_with_vite+svelte.md +1 -1
  165. package/docs/ru/intlayer_with_vite+vue.md +2 -2
  166. package/docs/ru/introduction.md +5 -5
  167. package/docs/ru/locale_mapper.md +1 -1
  168. package/docs/ru/packages/@intlayer/api/index.md +2 -2
  169. package/docs/ru/packages/@intlayer/chokidar/index.md +1 -1
  170. package/docs/ru/packages/@intlayer/cli/index.md +2 -2
  171. package/docs/ru/packages/@intlayer/config/index.md +2 -2
  172. package/docs/ru/packages/@intlayer/core/index.md +2 -2
  173. package/docs/ru/packages/@intlayer/design-system/index.md +2 -2
  174. package/docs/ru/packages/@intlayer/dictionary-entry/index.md +2 -2
  175. package/docs/ru/packages/@intlayer/editor/index.md +1 -1
  176. package/docs/ru/packages/@intlayer/editor-react/index.md +1 -1
  177. package/docs/ru/packages/@intlayer/webpack/index.md +1 -1
  178. package/docs/ru/packages/angular-intlayer/index.md +1 -1
  179. package/docs/ru/packages/express-intlayer/index.md +3 -3
  180. package/docs/ru/packages/express-intlayer/t.md +1 -1
  181. package/docs/ru/packages/intlayer/getEnumeration.md +3 -8
  182. package/docs/ru/packages/intlayer/getTranslation.md +3 -5
  183. package/docs/ru/packages/intlayer/getTranslationContent.md +1 -3
  184. package/docs/ru/packages/intlayer/index.md +3 -3
  185. package/docs/ru/packages/intlayer-cli/index.md +1 -1
  186. package/docs/ru/packages/intlayer-editor/index.md +2 -2
  187. package/docs/ru/packages/lynx-intlayer/index.md +1 -1
  188. package/docs/ru/packages/next-intlayer/index.md +4 -4
  189. package/docs/ru/packages/next-intlayer/t.md +4 -4
  190. package/docs/ru/packages/next-intlayer/useLocale.md +3 -3
  191. package/docs/ru/packages/nuxt-intlayer/index.md +1 -1
  192. package/docs/ru/packages/preact-intlayer/index.md +1 -1
  193. package/docs/ru/packages/react-intlayer/index.md +4 -4
  194. package/docs/ru/packages/react-intlayer/t.md +4 -4
  195. package/docs/ru/packages/react-native-intlayer/index.md +1 -1
  196. package/docs/ru/packages/react-scripts-intlayer/index.md +3 -3
  197. package/docs/ru/packages/solid-intlayer/index.md +3 -3
  198. package/docs/ru/packages/svelte-intlayer/index.md +1 -1
  199. package/docs/ru/packages/vite-intlayer/index.md +3 -3
  200. package/docs/ru/packages/vue-intlayer/index.md +1 -1
  201. package/docs/ru/per_locale_file.md +1 -1
  202. package/docs/ru/roadmap.md +3 -5
  203. package/docs/ru/vs_code_extension.md +1 -1
  204. package/docs/zh/formatters.md +446 -38
  205. package/docs/zh/how_works_intlayer.md +2 -4
  206. package/docs/zh/interest_of_intlayer.md +7 -10
  207. package/docs/zh/intlayer_with_tanstack.md +1 -1
  208. package/docs/zh/introduction.md +2 -2
  209. package/frequent_questions/ar/domain_routing.md +1 -1
  210. package/frequent_questions/en/domain_routing.md +1 -1
  211. package/frequent_questions/en-GB/domain_routing.md +1 -1
  212. package/frequent_questions/es/domain_routing.md +1 -1
  213. package/frequent_questions/fr/domain_routing.md +1 -1
  214. package/frequent_questions/hi/domain_routing.md +1 -1
  215. package/frequent_questions/it/domain_routing.md +1 -1
  216. package/frequent_questions/ko/domain_routing.md +1 -1
  217. package/frequent_questions/pt/domain_routing.md +1 -1
  218. package/frequent_questions/ru/domain_routing.md +1 -1
  219. package/frequent_questions/ru/get_locale_cookie.md +4 -4
  220. package/frequent_questions/ru/static_rendering.md +1 -2
  221. package/frequent_questions/zh/domain_routing.md +1 -1
  222. package/package.json +7 -7
  223. package/src/generated/blog.entry.ts +41 -0
@@ -1,14 +1,14 @@
1
1
  ---
2
- createdAt: 2024-08-11
3
- updatedAt: 2025-06-29
4
- title: next-i18next vs next-intl vs Intlayer
5
- description: Сравнить next-i18next с next-intl и Intlayer для интернационализации (i18n) приложения Next.js
2
+ createdAt: 2025-08-23
3
+ updatedAt: 2025-08-23
4
+ title: next-i18next против next-intl и Intlayer
5
+ description: Сравнение next-i18next с next-intl и Intlayer для интернационализации (i18n) приложения Next.js
6
6
  keywords:
7
7
  - next-intl
8
8
  - next-i18next
9
9
  - Intlayer
10
10
  - Интернационализация
11
- - Документация
11
+ - Блог
12
12
  - Next.js
13
13
  - JavaScript
14
14
  - React
@@ -17,269 +17,146 @@ slugs:
17
17
  - next-i18next-vs-next-intl-vs-intlayer
18
18
  ---
19
19
 
20
- # next-i18next VS next-intl VS Intlayer | Internationalization (i18n) на Next.js
20
+ # next-i18next ПРОТИВ next-intl ПРОТИВ intlayer | Интернационализация (i18n) Next.js
21
21
 
22
- Ниже представлено краткое сравнение **трех популярных библиотек** для интернационализации (i18n) приложения на Next.js: **next-intl**, **next-i18next** и **Intlayer**.
22
+ Это руководство сравнивает три широко используемых варианта i18n для **Next.js**: **next-intl**, **next-i18next** и **Intlayer**.
23
+ Мы сосредотачиваемся на **Next.js 13+ App Router** (с **React Server Components**) и оцениваем:
23
24
 
24
- Этот документ подчеркивает ключевые критерии:
25
+ 1. **Архитектуру и организацию контента**
26
+ 2. **TypeScript и безопасность**
27
+ 3. **Обработку отсутствующих переводов**
28
+ 4. **Маршрутизация и промежуточное ПО**
29
+ 5. **Производительность и поведение загрузки**
30
+ 6. **Опыт разработчика (DX), инструменты и сопровождение**
31
+ 7. **SEO и масштабируемость для крупных проектов**
25
32
 
26
- 1. **Архитектура** (сохранение переводов рядом с компонентами)
27
- 2. **Поддержка TypeScript**
28
- 3. **Управление отсутствующими переводами**
29
- 4. **Поддержка серверных компонентов**
30
- 5. **Улучшенный роутинг и промежуточное ПО** для Next.js
31
- 6. **Простота настройки**
32
-
33
- Руководство также предлагает **углубленный обзор Intlayer**, показывая, почему это может быть сильным выбором, особенно для Next.js 13+, включая **App Router** и **Server Components**.
33
+ > **кратко**: Все три решения могут локализовать приложение Next.js. Если вам нужен **контент, ограниченный компонентом**, **строгая типизация TypeScript**, **проверки отсутствующих ключей на этапе сборки**, **дерево-стряхиваемые словари** и **первоклассная поддержка App Router и SEO**, то **Intlayer** - самый полный и современный выбор.
34
34
 
35
35
  ---
36
36
 
37
- ## Обзор каждой библиотеки
38
-
39
- ### 1. next-intl
37
+ ## Общее позиционирование
40
38
 
41
- **Основное внимание**: Быстрая и простая настройка с легким подходом к локализации.
39
+ - **next-intl** - Легковесное, простое форматирование сообщений с надежной поддержкой Next.js. Централизованные каталоги распространены; опыт разработчика (DX) простой, но безопасность и сопровождение крупных проектов в основном остаются вашей ответственностью.
40
+ - **next-i18next** - i18next в обертке Next.js. Зрелая экосистема и функции через плагины (например, ICU), но конфигурация может быть многословной, а каталоги имеют тенденцию к централизации по мере роста проектов.
41
+ - **Intlayer** - Контентная модель, ориентированная на компоненты для Next.js, **строгая типизация TS**, **проверки на этапе сборки**, **дерево-стряхивание**, **встроенное промежуточное ПО и SEO помощники**, опциональный **Визуальный редактор/CMS** и **переводы с помощью ИИ**.
42
42
 
43
- - **Архитектура**: Предлагает расположение переводов в одной папке (например, `locales/`), но также допускает несколько стратегий. Не строго требует архитектуры «перевод на компонент».
44
- - **Поддержка TypeScript**: Базовая интеграция TypeScript. Некоторые определения типов существуют, но они не сильно ориентированы на авто-генерацию определений TypeScript из файлов перевода.
45
- - **Отсутствующие переводы**: Базовый механизм резервного копирования. По умолчанию возвращает ключ или строку локали по умолчанию. Нет надежных инструментов «из коробки» для проверки отсутствующих переводов.
46
- - **Поддержка серверных компонентов**: Работает с Next.js 13+ в общем плане, но шаблон менее специализирован для глубокого серверного использования (например, серверные компоненты с комплексным динамическим роутингом).
47
- - **Роутинг и промежуточное ПО**: Поддержка промежуточного ПО возможна, но ограничена. Обычно полагается на `Middleware` Next.js для определения локали или ручную настройку для переписывания локальных путей.
48
- - **Простота настройки**: Очень просто. Минимальный шаблон необходим.
43
+ ---
49
44
 
50
- **Используйте, когда**: Вам нужен более простой подход или вы комфортно управляете переводами более традиционными способами (например, одна папка с файлами локалей JSON).
45
+ ## Сравнение функций бок о бокфокусом на Next.js)
46
+
47
+ | Особенность | `next-intlayer` (Intlayer) | `next-intl` | `next-i18next` |
48
+ | --------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- |
49
+ | **Переводы рядом с компонентами** | ✅ Да, контент расположен рядом с каждым компонентом | ❌ Нет | ❌ Нет |
50
+ | **Интеграция с TypeScript** | ✅ Продвинутая, автоматически сгенерированные строгие типы | ✅ Хорошая | ⚠️ Базовая |
51
+ | **Обнаружение отсутствующих переводов** | ✅ Подсветка ошибок TypeScript и ошибки/предупреждения во время сборки | ⚠️ Запасной вариант во время выполнения | ⚠️ Запасной вариант во время выполнения |
52
+ | **Богатый контент (JSX/Markdown/компоненты)** | ✅ Прямая поддержка | ❌ Не предназначено для сложных узлов | ⚠️ Ограничено |
53
+ | **Перевод с использованием ИИ** | ✅ Да, поддерживает нескольких поставщиков ИИ. Используется с вашими собственными API-ключами. Учитывает контекст вашего приложения и объем контента | ❌ Нет | ❌ Нет |
54
+ | **Визуальный редактор** | ✅ Да, локальный визуальный редактор + опциональная CMS; может выносить содержимое кодовой базы; встраиваемый | ❌ Нет / доступно через внешние платформы локализации | ❌ Нет / доступно через внешние платформы локализации |
55
+ | **Локализованная маршрутизация** | ✅ Да, поддерживает локализованные пути из коробки (работает с Next.js и Vite) | ✅ Встроенная, App Router поддерживает сегмент `[locale]` | ✅ Встроенная |
56
+ | **Динамическая генерация маршрутов** | ✅ Да | ✅ Да | ✅ Да |
57
+ | **Множественное число** | ✅ Шаблоны на основе перечислений | ✅ Хорошо | ✅ Хорошо |
58
+ | **Форматирование (даты, числа, валюты)** | ✅ Оптимизированные форматтеры (Intl под капотом) | ✅ Хорошо (помощники Intl) | ✅ Хорошо (помощники Intl) |
59
+ | **Формат контента** | ✅ .tsx, .ts, .js, .json, .md, .txt, (.yaml в разработке) | ✅ .json, .js, .ts | ⚠️ .json |
60
+ | **Поддержка ICU** | ⚠️ В разработке | ✅ Да | ⚠️ Через плагин (`i18next-icu`) |
61
+ | **SEO помощники (hreflang, sitemap)** | ✅ Встроенные инструменты: помощники для sitemap, robots.txt, метаданных | ✅ Хорошо | ✅ Хорошо |
62
+ | **Экосистема / Сообщество** | ⚠️ Меньше, но быстро растет и активно развивается | ✅ Среднего размера, ориентировано на Next.js | ✅ Среднего размера, ориентировано на Next.js |
63
+ | **Серверный рендеринг и серверные компоненты** | ✅ Да, оптимизировано для SSR / React Server Components | ⚠️ Поддерживается на уровне страницы, но необходимо передавать t-функции в дерево компонентов для дочерних серверных компонентов | ⚠️ Поддерживается на уровне страницы, но необходимо передавать t-функции в дерево компонентов для дочерних серверных компонентов |
64
+ | **Tree-shaking (загрузка только используемого контента)** | ✅ Да, по компонентам во время сборки через плагины Babel/SWC | ⚠️ Частично | ⚠️ Частично |
65
+ | **Отложенная загрузка** | ✅ Да, по локали / по словарю | ✅ Да (по маршруту/по локали), требуется управление пространствами имён | ✅ Да (по маршруту/по локали), требуется управление пространствами имён |
66
+ | **Удаление неиспользуемого контента** | ✅ Да, по словарю во время сборки | ❌ Нет, можно управлять вручную с помощью управления пространствами имён | ❌ Нет, можно управлять вручную с помощью управления пространствами имён |
67
+ | **Управление крупными проектами** | ✅ Поощряет модульность, подходит для дизайн-систем | ✅ Модульный с настройкой | ✅ Модульный с настройкой |
51
68
 
52
69
  ---
53
70
 
54
- ### 2. next-i18next
71
+ ## Подробное сравнение
55
72
 
56
- **Основное внимание**: Проверенное временем решение, использующее `i18next` под капотом, широко принято для проектов на Next.js.
73
+ ### 1) Архитектура и масштабируемость
57
74
 
58
- - **Архитектура**: Обычно организует переводы в папке `public/locales`. Не специально разработано для сохранения переводов «рядом» с каждым компонентом, хотя вы можете вручную принять другую структуру.
59
- - **Поддержка TypeScript**: Разумное покрытие TypeScript, но требует пользовательской настройки для типизированных переводов и типизированных хуков.
60
- - **Отсутствующие переводы**: i18next предлагает интерполяцию/резервные копии. Однако определение отсутствующих переводов обычно требует дополнительной настройки или сторонних плагинов.
61
- - **Поддержка серверных компонентов**: Документировано базовое использование с Next.js 13, но расширенное использование (например, глубокая интеграция с серверными компонентами, генерация динамических маршрутов) может быть затруднительным.
62
- - **Роутинг и промежуточное ПО**: В значительной степени полагается на `Middleware` Next.js и переписывания для подмаршрутов локали. Для более сложных настроек, возможно, вам нужно будет углубиться в продвинутую конфигурацию i18next.
63
- - **Простота настройки**: Знакомый подход для тех, кто привык к i18next. Однако он может стать более громоздким, когда требуются продвинутые функции i18n (пространства имен, несколько локалей по умолчанию и т. д.).
75
+ - **next-intl / next-i18next**: По умолчанию используют **централизованные каталоги** по локалям (плюс **пространства имён** в i18next). Хорошо работает на начальном этапе, но часто становится большой общей областью с ростом связанности и изменчивости ключей.
76
+ - **Intlayer**: Поощряет использование словарей **на уровне компонентов** (или функций), **расположенных рядом** с кодом, который они обслуживают. Это снижает когнитивную нагрузку, облегчает дублирование/миграцию элементов интерфейса и уменьшает конфликты между командами. Неиспользуемый контент естественным образом легче обнаружить и удалить.
64
77
 
65
- **Используйте, когда**: Вы уже привержены экосистеме `i18next` или имеете существующие переводы на основе i18next.
78
+ **Почему это важно:** В больших кодовых базах или при настройке дизайн-систем **модульный контент** масштабируется лучше, чем монолитные каталоги.
66
79
 
67
80
  ---
68
81
 
69
- ### 3. Intlayer
70
-
71
- **Основное внимание**: Современная, открытая библиотека i18n, специально адаптированная для Next.js **App Router** (12, 13, 14 и 15) с встроенной поддержкой **Server Components** и **Turbopack**.
82
+ ### 2) TypeScript и безопасность
72
83
 
73
- #### Ключевые преимущества
84
+ - **next-intl**: Надежная поддержка TypeScript, но **ключи по умолчанию не строго типизированы**; вам придется самостоятельно поддерживать паттерны безопасности.
85
+ - **next-i18next**: Базовые типы для хуков; **строгая типизация ключей требует дополнительного инструментария/конфигурации**.
86
+ - **Intlayer**: **Генерирует строгие типы** из вашего контента. **Автодополнение в IDE** и **ошибки на этапе компиляции** ловят опечатки и отсутствующие ключи до деплоя.
74
87
 
75
- 1. **Архитектура**
88
+ **Почему это важно:** Сильная типизация сдвигает ошибки **налево** (CI/сборка), а не **направо** (время выполнения).
76
89
 
77
- - Поощряет размещение **переводов прямо рядом с их компонентами**. Каждая страница или компонент может иметь свой собственный файл `.content.ts` (или JSON), никакого более копания в гигантской папке с переводами.
78
- - Это делает ваш код более **модульным и поддерживаемым**, особенно в больших кодовых базах.
79
-
80
- 2. **Поддержка TypeScript**
81
-
82
- - **Авто-генерируемые определения типов**: В момент, когда вы определяете свой контент, Intlayer генерирует типы, которые обеспечивают автозаполнение и ловят ошибки перевода.
83
- - Минимизирует ошибки выполнения, такие как отсутствующие ключи, и предлагает расширенное **автозаполнение** прямо в вашей IDE.
84
-
85
- 3. **Управление отсутствующими переводами**
90
+ ---
86
91
 
87
- - Во время сборки Intlayer может **обнаружить отсутствующие ключи перевода** и выдать предупреждения или ошибки.
88
- - Это обеспечивает, чтобы вы никогда случайно не отправляли язык с отсутствующим текстом.
92
+ ### 3) Обработка отсутствующих переводов
89
93
 
90
- 4. **Оптимизирован для серверных компонентов**
94
+ - **next-intl / next-i18next**: Полагаются на **запасные варианты во время выполнения** (например, показывают ключ или локаль по умолчанию). Сборка не падает.
95
+ - **Intlayer**: **Обнаружение на этапе сборки** с **предупреждениями/ошибками** для отсутствующих локалей или ключей.
91
96
 
92
- - Полностью совместим с **App Router** Next.js и новым парадигмой **Server Components**.
93
- - Предоставляет специализированные провайдеры (`IntlayerServerProvider`, `IntlayerClientProvider`), чтобы **изолировать серверный контекст** (что важно при работе с Next.js 13+).
97
+ **Почему это важно:** Выявление пробелов во время сборки предотвращает появление «загадочных строк» в продакшене и соответствует строгим требованиям к релизу.
94
98
 
95
- 5. **Улучшенный роутинг и промежуточное ПО**
99
+ ---
96
100
 
97
- - Включает специальное [**`intlayerMiddleware`**](#) для **автоматического определения локали** (через cookies или заголовки браузера) и расширенной генерации маршрутов.
98
- - Динамически обрабатывает локализованные пути (например, `/en-US/about` против `/fr/about`) с минимальной конфигурацией.
99
- - Предлагает вспомогательные методы, такие как `getMultilingualUrls` для генерации альтернативных языковых ссылок (отлично для **SEO**).
101
+ ### 4) Маршрутизация, middleware и стратегия URL
100
102
 
101
- 6. **Упрощенная настройка**
102
- - Один конфигурационный файл (`intlayer.config.ts`), чтобы определить ваши локали, локаль по умолчанию и предпочтения интеграции.
103
- - Плагин-обертка `withIntlayer(nextConfig)`, который **внедряет** все переменные окружения и наблюдатели за вашим контентом.
104
- - **Нет больших конфигураций по умолчанию**, система построена так, чтобы «просто работать» с минимальным трением.
103
+ - Все три работают с **локализованной маршрутизацией Next.js** на App Router.
104
+ - **Intlayer** идет дальше с **i18n middleware** (определение локали через заголовки/куки) и **хелперами** для генерации локализованных URL и тегов `<link rel="alternate" hreflang="…">`.
105
105
 
106
- > **В конце концов**: Intlayer является современным решением, которое стремится **продвигать лучшие практики**: от **сохранения переводов рядом** с каждым компонентом React до предложений **надежной поддержки TS** и **легкого серверного** использования, в то время как **значительно уменьшает количество шаблонного кода**.
106
+ **Почему это важно:** Меньше кастомных прослоек; **последовательный UX** и **чистое SEO** для всех локалей.
107
107
 
108
108
  ---
109
109
 
110
- ## Сравнение функций бок о бок
111
-
112
- | **Функция** | **next-intl** | **next-i18next** | **Intlayer** |
113
- | --------------------------------------------- | --------------------------------------------- | -------------------------------------------------------------------- | -------------------------------------------------------- |
114
- | **Сохранение переводов рядом с компонентами** | Частично – обычно одна папка локалей | Не по умолчанию – часто в `public/locales` | **Да – рекомендуется и просто** |
115
- | **Авто-генерация TypeScript** | Базовые определения TS | Базовая поддержка TS | **Да – продвинутая «из коробки»** |
116
- | **Обнаружение отсутствующих переводов** | В основном строки резервных копий | В основном строки резервных копий | **Да – проверки на этапе сборки** |
117
- | **Поддержка серверных компонентов** | Работает, но не специализирован | Поддерживается, но может быть многословно | **Полная поддержка с специализированными провайдерами** |
118
- | **Роутинг и промежуточное ПО** | Интегрируется вручную с промежуточным ПО Next | Предоставляется с помощью конфигурации переписывания | **Специальное i18n промежуточное ПО + продвинутые хуки** |
119
- | **Сложность настройки** | Простой, минимальная конфигурация | Традиционный, может быть многословным для продвинутого использования | **Один файл конфигурации и плагин** |
120
-
121
- ---
110
+ ### 5) Совместимость с серверными компонентами (RSC)
122
111
 
123
- ## Почему Intlayer?
112
+ - **Все** поддерживают Next.js 13+.
113
+ - **Intlayer** упрощает **границу между сервером и клиентом** с помощью единого API и провайдеров, разработанных для RSC, чтобы вам не приходилось передавать форматтеры или функции t через дерево компонентов.
124
114
 
125
- Для команд, переходящих на или строящих на основе **Next.js App Router** (версии 13, 14 или 15) с **Server Components**, Intlayer предоставляет:
115
+ **Почему это важно:** Более чистая модель мышления и меньше крайних случаев в гибридных деревьях.
126
116
 
127
- 1. **Упрощенная архитектура**
117
+ ---
128
118
 
129
- - Каждый маршрут или компонент содержит свои переводы. Это способствует ясности и поддерживаемости.
119
+ ### 6) Производительность и поведение загрузки
130
120
 
131
- 2. **Мощная интеграция TypeScript**
121
+ - **next-intl / next-i18next**: Частичный контроль через **пространства имён** и **разделение по маршрутам**; существует риск включения в сборку неиспользуемых строк, если не соблюдать дисциплину.
122
+ - **Intlayer**: Выполняет **tree-shaking** на этапе сборки и **ленивую загрузку по словарям/локалям**. Неиспользуемый контент не попадает в сборку.
132
123
 
133
- - Вы получаете безопасность на уровне компилятора, избегая «ошибок-описок» или отсутствующих ключей перевода.
124
+ **Почему это важно:** Меньшие размеры бандлов и более быстрая загрузка, особенно на сайтах с несколькими локалями.
134
125
 
135
- 3. **Реальные предупреждения о отсутствующих переводах**
126
+ ---
136
127
 
137
- - Если вы забудете ключ или перевод языка, вы будете предупреждены на этапе сборки (а не отправляя неполный UI).
128
+ ### 7) Опыт разработчика (DX), инструменты и сопровождение
138
129
 
139
- 4. **Встроенный продвинутый роутинг**
130
+ - **next-intl / next-i18next**: Обычно вы подключаете внешние платформы для переводов и редакционных процессов.
131
+ - **Intlayer**: В комплекте поставляется **бесплатный визуальный редактор** и **опциональная CMS** (дружелюбная к Git или внешняя). Плюс **расширение для VSCode** для создания контента и **переводы с помощью ИИ** с использованием ваших собственных ключей провайдера.
140
132
 
141
- - Автоматическое определение локали, генерация динамических маршрутов и легкое управление локализованными URL включены.
142
- - Стандартное `intlayerMiddleware` не требует глубоких пользовательских переписываний.
133
+ **Почему это важно:** Снижает операционные затраты и сокращает цикл взаимодействия между разработчиками и авторами контента.
143
134
 
144
- 5. **Упрощенная настройка**
135
+ ---
145
136
 
146
- - Минимальное количество шаблона: просто определите ваш `intlayer.config.ts`, оберните `next.config` с `withIntlayer` и добавьте официальное промежуточное ПО.
147
- - Четкое и простое использование как для **серверных**, так и для **клиентских** компонентов через `IntlayerServerProvider` и `IntlayerClientProvider`.
137
+ ## Когда что выбирать?
148
138
 
149
- 6. **Дружественный к SEO**
150
- - Встроенные вспомогательные функции (`getMultilingualUrls`, атрибуты `hrefLang` и т. д.) облегчают создание страниц и карт сайтов, соответствующих требованиям SEO.
139
+ - **Выбирайте next-intl**, если вам нужно **минималистичное** решение, вы комфортно работаете с централизованными каталогами, и ваше приложение **малое или среднего размера**.
140
+ - **Выбирайте next-i18next**, если вам нужна **экосистема плагинов i18next** (например, расширенные правила ICU через плагины), и ваша команда уже знакома с i18next, готовая принять **больше конфигурации** ради гибкости.
141
+ - **Выбирайте Intlayer**, если вы цените **контент, привязанный к компонентам**, **строгий TypeScript**, **гарантии на этапе сборки**, **tree-shaking** и **встроенные инструменты** для маршрутизации/SEO/редактирования - особенно для **Next.js App Router** и **больших, модульных кодовых баз**.
151
142
 
152
143
  ---
153
144
 
154
- ## Пример: Intlayer в действии
155
-
156
- Ниже приведен _очень_ сокращенный фрагмент, иллюстрирующий, как использовать Intlayer в проекте на Next.js 15. Для получения всех деталей и примеров кода, [посмотрите полное руководство Intlayer](#).
157
-
158
- <details>
159
- <summary>Пошаговый пример</summary>
160
-
161
- 1. **Установка и настройка**
162
-
163
- ```bash
164
- npm install intlayer next-intlayer
165
- ```
166
-
167
- ```ts
168
- // intlayer.config.ts
169
- import { Locales, type IntlayerConfig } from "intlayer";
170
-
171
- const config: IntlayerConfig = {
172
- internationalization: {
173
- locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
174
- defaultLocale: Locales.ENGLISH,
175
- },
176
- };
177
- export default config;
178
- ```
179
-
180
- 2. **Используйте плагин**
181
-
182
- ```ts
183
- // next.config.mjs
184
- import { withIntlayer } from "next-intlayer/server";
185
-
186
- /** @type {import('next').NextConfig} */
187
- const nextConfig = {};
188
-
189
- export default withIntlayer(nextConfig);
190
- ```
191
-
192
- 3. **Добавьте промежуточное ПО**
193
-
194
- ```ts
195
- // src/middleware.ts
196
- export { intlayerMiddleware as middleware } from "next-intlayer/middleware";
197
-
198
- export const config = {
199
- matcher:
200
- "/((?!api|static|assets|robots|sitemap|sw|service-worker|manifest|.*\\..*|_next).*)",
201
- };
202
- ```
203
-
204
- 4. **Создайте локализованный макет**
205
-
206
- ```tsx
207
- // src/app/[locale]/layout.tsx
208
- import { getHTMLTextDir } from "intlayer";
209
- import { NextLayoutIntlayer } from "next-intlayer";
210
-
211
- const LocaleLayout: NextLayoutIntlayer = async ({ children, params }) => {
212
- const { locale } = params;
213
- return (
214
- <html lang={locale} dir={getHTMLTextDir(locale)}>
215
- <body>{children}</body>
216
- </html>
217
- );
218
- };
219
-
220
- export { generateStaticParams } from "next-intlayer";
221
- export default LocaleLayout;
222
- ```
223
-
224
- 5. **Объявите и используйте контент**
225
-
226
- ```tsx
227
- // src/app/[locale]/page.content.ts
228
- import { t } from "intlayer";
229
-
230
- export default {
231
- key: "page",
232
- content: {
233
- getStarted: {
234
- main: t({
235
- en: "Get started by editing",
236
- fr: "Commencez par éditer",
237
- es: "Comience por editar",
238
- }),
239
- pageLink: "src/app/page.tsx",
240
- },
241
- },
242
- };
243
- ```
244
-
245
- ```tsx
246
- // src/app/[locale]/page.tsx
247
- import { IntlayerServerProvider } from "next-intlayer/server";
248
- import { IntlayerClientProvider, useIntlayer } from "next-intlayer";
249
-
250
- const PageContent = () => {
251
- const { content } = useIntlayer("page");
252
- return (
253
- <>
254
- <p>{content.getStarted.main}</p>
255
- <code>{content.getStarted.pageLink}</code>
256
- </>
257
- );
258
- };
259
-
260
- export default function Page({ params }) {
261
- return (
262
- <IntlayerServerProvider locale={params.locale}>
263
- <IntlayerClientProvider locale={params.locale}>
264
- <PageContent />
265
- </IntlayerClientProvider>
266
- </IntlayerServerProvider>
267
- );
268
- }
269
- ```
270
-
271
- </details>
145
+ ## Практические заметки по миграции (next-intl / next-i18next → Intlayer)
146
+
147
+ - **Начинайте по функциям**: Переносите по одному маршруту или компоненту за раз в **локальные словари**.
148
+ - **Сохраняйте старые каталоги параллельно**: Используйте мост во время миграции; избегайте большого «взрыва» изменений.
149
+ - **Включайте строгие проверки**: Позвольте обнаружению на этапе сборки выявлять пробелы на раннем этапе.
150
+ - **Используйте middleware и вспомогательные функции**: Стандартизируйте определение локали и SEO-теги по всему сайту.
151
+ - **Измеряйте размер бандлов**: Ожидайте **сокращения размера бандлов** по мере удаления неиспользуемого контента.
272
152
 
273
153
  ---
274
154
 
275
155
  ## Заключение
276
156
 
277
- Каждое решение, **next-intl**, **next-i18next** и **Intlayer**, оказалось эффективным для многоязычных проектов на Next.js. Однако **Intlayer** идет дальше, предлагая:
157
+ Все три библиотеки успешно справляются с основной локализацией. Разница в том, **сколько работы вам придется выполнить**, чтобы добиться надежной и масштабируемой настройки в **современном Next.js**:
278
158
 
279
- - **Сильное поощрение архитектуры перевода на уровне компонентов**
280
- - Бесшовную интеграцию с **Next.js 13+ и Server Components**
281
- - Предложения **мощного авто-генерации TypeScript** для безопасного кода
282
- - Обработку **отсутствующих переводов** на этапе сборки
283
- - Предоставление **упрощенного, единого подхода к конфигурации** с расширенным роутингом и промежуточным ПО
159
+ - С **Intlayer** **модульный контент**, **строгая типизация TS**, **безопасность на этапе сборки**, **оптимизация бандлов с tree-shaking** и **первоклассный App Router + SEO-инструменты** являются **стандартом**, а не рутиной.
160
+ - Если ваша команда ценит **поддерживаемость и скорость** в многоязычном приложении, построенном на компонентах, Intlayer предлагает сегодня **самый полный** опыт.
284
161
 
285
- Если вы хотите **современные** функции i18n, адаптированные к Next.js App Router, и ищете **полностью типизированный** опыт без ручного настройки логики резервного копирования, переписывания маршрутов или сложных шагов сборки, **Intlayer** является убедительным выбором. Он не только сокращает время настройки, но и обеспечивает более поддерживаемый, масштабируемый подход к переводам для вашей команды.
162
+ Обратитесь к документу ['Почему Intlayer?'](https://intlayer.org/doc/why) для получения дополнительной информации.