@intlayer/docs 9.0.0-canary.2 → 9.0.0-canary.20

package/docs/uk/formatters.md

@@ -116,10 +116,6 @@ pluralRules.select(1); // "one"
 pluralRules.select(2); // "інше"
 ```
 
-## Додаткові утиліти Intl
-
-Окрім допоміжних форматерів, ви також можете безпосередньо використовувати кешований обгорток Intl для інших можливостей Intl:
-
 ### `Intl.DisplayNames`
 
 Для локалізованих назв мов, регіонів, валют та писемностей:
@@ -182,20 +178,6 @@ getLocaleName("de", "es"); // іспанською: "alemán"
 - **displayLocale**: Локаль, для якої потрібно отримати назву
 - **targetLocale**: Локаль, в якій відображається назва (за замовчуванням displayLocale)
 
-### `getLocaleLang(locale?)`
-
-Витягує код мови з рядка локалі:
-
-```ts
-import { getLocaleLang } from "intlayer";
-
-getLocaleLang("en-US"); // "en"
-getLocaleLang("fr-CA"); // "fr"
-getLocaleLang("de"); // "de"
-```
-
-- **locale**: Локаль, з якої потрібно витягти код мови (за замовчуванням поточна локаль)
-
 ### `getLocaleFromPath(inputUrl)`
 
 Витягує сегмент локалі з URL або шляху:
@@ -212,22 +194,6 @@ getLocaleFromPath("https://example.com/es/about"); // "es"
 - **inputUrl**: Повний рядок URL або шлях (pathname) для обробки
 - **returns**: Виявлена локаль або локаль за замовчуванням, якщо локаль не знайдена
 
-### `getPathWithoutLocale(inputUrl, locales?)`
-
-Видаляє сегмент локалі з URL або шляху (pathname):
-
-```ts
-import { getPathWithoutLocale } from "intlayer";
-
-getPathWithoutLocale("/en/dashboard"); // "/dashboard"
-getPathWithoutLocale("/fr/dashboard"); // "/dashboard"
-getPathWithoutLocale("https://example.com/en/about"); // "https://example.com/about"
-```
-
-- **inputUrl**: Повний рядок URL або шлях (pathname) для обробки
-- **locales**: Необов'язковий масив підтримуваних локалей (за замовчуванням використовується сконфігурований список локалей)
-- **returns**: URL без сегменту локалі
-
 ### `getLocalizedUrl(url, currentLocale, locales?, defaultLocale?, prefixDefault?)`
 
 Генерує локалізований URL для поточної локалі:
@@ -261,8 +227,6 @@ getHTMLTextDir("he"); // повертає "rtl"
 - **locale**: Локаль, для якої потрібно отримати напрямок тексту (за замовчуванням, поточна локаль)
 - **повертає**: `"ltr"`, `"rtl"`, або `"auto"`
 
-## Утиліти обробки контенту
-
 ### `getContent(node, nodeProps, locale?)`
 
 Перетворює вузол контенту за допомогою всіх доступних плагінів (translation, enumeration, insertion тощо):
@@ -281,28 +245,6 @@ const content = getContent(
 - **nodeProps**: Властивості для контексту перетворення
 - **locale**: Необов'язкова локаль (за замовчуванням використовується налаштована локаль)
 
-### `getTranslation(languageContent, locale?, fallback?)`
-
-Витягує вміст для конкретної локалі з об'єкта мовного вмісту:
-
-```ts
-import { getTranslation } from "intlayer";
-
-const content = getTranslation(
-  {
-    en: "Hello",
-    fr: "Bonjour",
-    de: "Hallo",
-  },
-  "fr",
-  true
-); // "Bonjour"
-```
-
-- **languageContent**: Об'єкт, що відображає локалі на відповідний вміст
-- **locale**: Цільова локаль (за замовчуванням використовується налаштована локаль)
-- **fallback**: Чи виконувати відкат до локалі за замовчуванням (за замовчуванням true)
-
 ### `getIntlayer(dictionaryKey, locale?, plugins?)`
 
 Отримує та трансформує вміст із словника за ключем:
@@ -468,12 +410,87 @@ list(["red", "green", "blue"], { locale: "fr", type: "disjunction" }); // "rouge
 list([1, 2, 3], { type: "unit" }); // "1, 2, 3"
 ```
 
+## Cached Intl
+
+Експортований `Intl` з `intlayer` — це кешований wrapper навколо глобального `Intl`. Він мемоізує екземпляри форматерів (`NumberFormat`, `DateTimeFormat` тощо), щоб уникнути їхнього повторного створення та поліпшити продуктивність.
+
+```ts
+import { Intl } from "intlayer";
+
+// Форматування чисел
+const numberFormat = new Intl.NumberFormat("en-GB", {
+  style: "currency",
+  currency: "GBP",
+});
+numberFormat.format(1234.5); // "£1,234.50"
+
+// Назви відображення для мов, регіонів тощо
+const displayNames = new Intl.DisplayNames("fr", { type: "language" });
+displayNames.of("en"); // "anglais"
+
+// Collation для сортування
+const collator = new Intl.Collator("fr", { sensitivity: "base" });
+collator.compare("é", "e"); // 0 (equal)
+
+// Правила множини
+const pluralRules = new Intl.PluralRules("fr");
+pluralRules.select(1); // "one"
+pluralRules.select(2); // "other"
+```
+
+### Додаткові функції Intl
+
 ## Примітки
 
 - Усі утиліти приймають вхідні значення як `string`; всередині вони приводяться до чисел або дат.
 - Якщо локаль не вказана, за замовчуванням використовується налаштована вами `internationalization.defaultLocale`.
 - Ці утиліти, тонкі обгортки; для просунутого форматування передавайте стандартні опції `Intl`.
 
+#### `Intl.Collator`
+
+Для локалізованого порівняння та сортування рядків:
+
+```ts
+import { Intl } from "intlayer";
+
+const collator = new Intl.Collator("de", {
+  sensitivity: "base",
+  numeric: true,
+});
+
+const words = ["äpfel", "zebra", "100", "20"];
+words.sort(collator.compare); // ["20", "100", "äpfel", "zebra"]
+```
+
+#### `Intl.PluralRules`
+
+Для визначення форм множини в різних локалях:
+
+```ts
+import { Intl } from "intlayer";
+
+const pluralRules = new Intl.PluralRules("ar");
+pluralRules.select(0); // "zero"
+pluralRules.select(1); // "one"
+pluralRules.select(2); // "two"
+pluralRules.select(3); // "few"
+pluralRules.select(11); // "many"
+```
+
+## Locale Utilities
+
+### `getLocaleName(displayLocale, targetLocale?)`
+
+Отримує локалізовану назву локалі:
+
+```ts
+import { getLocaleName } from "intlayer";
+
+getLocaleName("fr", "en"); // "French"
+getLocaleName("en", "fr"); // "anglais"
+getLocaleName("de", "es"); // "alemán"
+```
+
 ## Точки входу та повторні експорти (`@index.ts`)
 
 Форматери містяться в core-пакеті і реекспортуються з пакетів вищого рівня, щоб зробити імпорти зручними в різних середовищах виконання:
@@ -503,6 +520,29 @@ import {
 } from "intlayer";
 ```
 
+### `getLocaleFromPath(inputUrl)`
+
+Витягує сегмент локалі з URL-адреси або шляху:
+
+```ts
+import { getLocaleFromPath } from "intlayer";
+
+getLocaleFromPath("/en/dashboard"); // "en"
+getLocaleFromPath("/fr/dashboard"); // "fr"
+getLocaleFromPath("/dashboard"); // "en" (локаль за замовчуванням)
+```
+
+### `getPathWithoutLocale(inputUrl, locales?)`
+
+Видаляє сегмент локалі з URL:
+
+```ts
+import { getPathWithoutLocale } from "intlayer";
+
+getPathWithoutLocale("/en/dashboard"); // "/dashboard"
+getPathWithoutLocale("/fr/dashboard"); // "/dashboard"
+```
+
 ### React
 
 Клієнтські компоненти:
@@ -576,6 +616,20 @@ import {
 
 > Ці хуки братимуть до уваги локаль із `IntlayerProvider` або `IntlayerServerProvider`
 
+### `getHTMLTextDir(locale?)`
+
+Повертає напрямок тексту для локалі:
+
+```ts
+import { getHTMLTextDir } from "intlayer";
+
+getHTMLTextDir("en-US"); // "ltr"
+getHTMLTextDir("ar"); // "rtl"
+getHTMLTextDir("he"); // "rtl"
+```
+
+## Утиліти обробки вмісту
+
 ### Vue
 
 Клієнтські компоненти:
@@ -594,3 +648,33 @@ import {
 ```
 
 > Ці composables братимуть до уваги локаль із ін'єктованого `IntlayerProvider`
+
+### `getTranslation(languageContent, locale?, fallback?)`
+
+Витягує вміст для конкретної локалі:
+
+```ts
+import { getTranslation } from "intlayer";
+
+const content = getTranslation(
+  { en: "Hello", fr: "Bonjour", de: "Hallo" },
+  "fr",
+  true
+); // "Bonjour"
+```
+
+### `getIntlayer(dictionaryKey, locale?, plugins?)`
+
+Отримує та трансформує вміст зі словника:
+
+```ts
+import { getIntlayer } from "intlayer";
+
+const content = getIntlayer("common", "fr");
+```
+
+## Примітки
+
+- Усі помічники приймають входи типу `string`; внутрішньо вони перетворюються на числа або дати.
+- Locale за замовчуванням використовує ваш налаштований `internationalization.defaultLocale`, якщо він не надано.
+- Ці утиліти є тонкими обгортками; для розширеного форматування передайте стандартні параметри `Intl`.

package/docs/uk/how_works_intlayer.md

@@ -220,9 +220,9 @@ The `@intlayer/webpack` package is used to provide a Webpack configuration to ma
 
 Пакети `@intlayer/dictionaries-entry`, `@intlayer/unmerged-dictionaries-entry` та `@intlayer/dynamic-dictionaries-entry` повертають шлях entry словників Intlayer. Оскільки з браузера неможливо виконувати пошук по файловій системі, використання bundler-ів, таких як Webpack або Rollup, для отримання шляху entry словників неможливе. Ці пакети розроблені для того, щоб їх можна було alias-ити, що дозволяє оптимізувати bundling для різних збирачів, таких як Vite, Webpack та Turbopack.
 
-### @intlayer/chokidar
+### @intlayer/engine
 
-Пакет `@intlayer/chokidar` використовується для моніторингу файлів контенту та перегенерації зміненого словника при кожній модифікації.
+Пакет `@intlayer/engine` використовується для моніторингу файлів контенту та перегенерації зміненого словника при кожній модифікації.
 
 ### @intlayer/editor
 

package/docs/uk/interest_of_intlayer.md

@@ -30,6 +30,10 @@ author: aymericzip
 
 # Чому варто розглянути Intlayer?
 
+## Що таке Intlayer?
+
+**Intlayer** — це бібліотека інтернаціоналізації, розроблена спеціально для розробників JavaScript. Вона дозволяє оголошувати вашу контент будь-де у вашому коді. Вона перетворює оголошення багатомовного контенту на структуровані словники для легкої інтеграції у ваш код. Використовуючи TypeScript, **Intlayer** робить вашу розробку сильнішою та ефективнішою.
+
 ## Чому варто обрати Intlayer, а не альтернативи?
 
 Порівняно з основними рішеннями, такими як `next-intl` або `i18next`, Intlayer — це рішення, яке має такі інтегровані оптимізації, як:
@@ -87,6 +91,196 @@ Intlayer пропонує низку додаткових функцій, яки
 
 ---
 
+## Чому було створено Intlayer?
+
+Intlayer було створено для вирішення поширеної проблеми, яка впливає на всі популярні бібліотеки i18n, такі як `next-intl`, `react-i18next`, `react-intl`, `next-i18next`, `react-intl` та `vue-i18n`.
+
+Всі ці рішення використовують централізований підхід до переліку та управління вашим контентом. Наприклад:
+
+```bash
+.
+├── locales
+│   ├── en.json
+│   ├── es.json
+│   └── fr.json
+├── i18n.ts
+└── src
+    └── components
+        └── MyComponent
+            └── index.tsx
+```
+
+Або тут з використанням простору імен:
+
+```bash
+.
+├── locales
+│   ├── en
+│   │  ├── footer.json
+│   │  └── navbar.json
+│   ├── fr
+│   │  ├── footer.json
+│   │  └── navbar.json
+│   └── es
+│      ├── footer.json
+│      └── navbar.json
+├── i18n.ts
+└── src
+    └── components
+        └── MyComponent
+            └── index.tsx
+```
+
+Цей тип архітектури сповільнює процес розробки та ускладнює підтримку codebase з кількох причин:
+
+1. **Для кожного нового створеного компонента ви повинні:**
+   - Створити новий ресурс/простір імен в папці `locales`
+   - Пам'ятати про імпорт нового простору імен на вашій сторінці
+   - Перекласти ваш контент (часто робиться вручну через копіювання від постачальників AI)
+
+2. **Для будь-яких змін, внесених у ваші компоненти, ви повинні:**
+   - Шукати пов'язаний ресурс/простір імен (далеко від компонента)
+   - Перекласти ваш контент
+   - Переконатися, що ваш контент актуальний для будь-якої локалі
+   - Перевірити, що ваш простір імен не містить невикористаних ключів/значень
+   - Переконатися, що структура ваших JSON файлів однакова для всіх локалей
+
+На професійних проектах, які використовують ці рішення, часто використовуються платформи локалізації для керування перекладом вашого контенту. Однак це може швидко стати дорогим для великих проектів.
+
+Для вирішення цієї проблеми Intlayer використовує підхід, який обмежує ваш контент на компонент і зберігає ваш контент близько до компонента, як ми часто робимо з CSS (`styled-components`), типами, документацією (`storybook`) або unit тестами (`jest`).
+
+```bash codeFormat="typescript"
+.
+└── components
+    └── MyComponent
+        ├── index.content.ts
+        ├── index.test.tsx
+        ├── index.stories.tsx
+        └── index.tsx
+```
+
+```bash codeFormat="commonjs"
+.
+└── components
+    └── MyComponent
+        ├── index.content.cjs
+        ├── index.test.mjs
+        ├── index.stories.mjs
+        └── index.tsx
+```
+
+```bash codeFormat="esm"
+.
+└── components
+    └── MyComponent
+        ├── index.content.mjs
+        ├── index.test.mjs
+        ├── index.stories.mjs
+        └── index.tsx
+```
+
+```tsx fileName="./components/MyComponent/index.content.ts" codeFormat={["typescript", "esm", "commonjs"]}
+import { t, type Dictionary } from "intlayer";
+
+// Вміст прикладу компонента
+const componentExampleContent = {
+  key: "component-example",
+  content: {
+    myTranslatedContent: t({
+      uk: "Привіт Світ",
+      en: "Hello World",
+      es: "Hola Mundo",
+      fr: "Bonjour le monde",
+    }),
+  },
+} satisfies Dictionary;
+
+export default componentExampleContent;
+```
+
+```tsx fileName="./components/MyComponent/index.tsx" codeFormat={["typescript", "esm"]}
+import { useIntlayer } from "react-intlayer";
+
+export const ComponentExample = () => {
+  const { myTranslatedContent } = useIntlayer("component-example");
+
+  return <span>{myTranslatedContent}</span>;
+};
+```
+
+Цей підхід дозволяє вам:
+
+1. **Підвищити швидкість розробки**
+   - `.content.{{ts|mjs|cjs|json}}` файли можна створити за допомогою розширення VSCode
+   - Інструменти автодоповнення AI в вашій IDE (такі як GitHub Copilot) можуть допомогти вам оголосити ваш контент, зменшуючи копіювання/вставлення
+
+2. **Очистити ваш codebase**
+   - Зменшити складність
+   - Підвищити підтримуваність
+
+3. **Дублювати ваші компоненти та їх пов'язаний контент більш легко (Приклад: компоненти входу/реєстрації тощо)**
+   - Обмежуючи ризик впливу на контент інших компонентів
+   - Копіюючи/вставляючи ваш контент з однієї програми в іншу без зовнішніх залежностей
+
+4. **Уникнути забруднення вашого codebase невикористаними ключами/значеннями для невикористаних компонентів**
+   - Якщо ви не використовуєте компонент, Intlayer не буде імпортувати його пов'язаний контент
+   - Якщо ви видалите компонент, вам буде легше пам'ятати про видалення його пов'язаного контенту, оскільки він буде присутній у тій самій папці
+
+5. **Зменшити витрати обробки для AI агентів при оголошенні вашого багатомовного контенту**
+   - AI агент не потребуватиме сканування всього вашого codebase, щоб знати, де реалізувати ваш контент
+   - Переклади можна легко робити за допомогою інструментів автодоповнення AI в вашій IDE (такі як GitHub Copilot)
+
+6. **Оптимізувати продуктивність завантаження**
+   - Якщо компонент ліниво завантажується, його пов'язаний контент буде завантажено одночасно
+
+## Додаткові можливості Intlayer
+
+| Функція                                                                                                                   | Опис                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
+| ------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/frameworks.png?raw=true)                          | **Підтримка кількох фреймворків**<br><br>Intlayer сумісний з усіма основними фреймворками та бібліотеками, включаючи Next.js, React, Vite, Vue.js, Nuxt, Preact, Express та інші.                                                                                                                                                                                                                                                                                    |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/javascript_content_management.jpg?raw=true)       | **Управління контентом на основі JavaScript**<br><br>Використовуйте гнучкість JavaScript для ефективного визначення та управління вашим контентом. <br><br> - [Декларація контенту](https://intlayer.org/doc/concept/content)                                                                                                                                                                                                                                        |
+| <img src="https://github.com/aymericzip/intlayer/blob/main/docs/assets/compiler.jpg?raw=true" alt="Feature" width="700">  | **Компілятор**<br><br>Компілятор Intlayer автоматично витягує контент з компонентів та генерує файли словника.<br><br> - [Компілятор](https://intlayer.org/doc/compiler)                                                                                                                                                                                                                                                                                             |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/per_locale_content_declaration_file.png?raw=true) | **Файл декларації контенту для кожної локалізації**<br><br>Прискорте розробку, оголошуючи ваш контент один раз, перед автоматичною генерацією.<br><br> - [Файл декларації контенту для кожної локалізації](https://intlayer.org/doc/concept/per-locale-file)                                                                                                                                                                                                         |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)                      | **Середовище з безпекою типів**<br><br>Використовуйте TypeScript для забезпечення безпеки від помилок у визначеннях контенту та коду, а також отримуйте автодоповнення IDE.<br><br> - [Конфігурація TypeScript](https://intlayer.org/doc/environment/vite-and-react#configure-typescript)                                                                                                                                                                            |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/config_file.png?raw=true)                         | **Спрощена установка**<br><br>Почніть швидко з мінімальною конфігурацією. Легко налаштовуйте параметри для інтернаціоналізації, маршрутизації, штучного інтелекту, збірки та управління контентом. <br><br> - [Дослідіть інтеграцію Next.js](https://intlayer.org/doc/environment/nextjs)                                                                                                                                                                            |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/content_retrieval.png?raw=true)                   | **Спрощене отримання контенту**<br><br>Немає потреби викликати вашу функцію `t` для кожного фрагмента контенту. Отримуйте весь ваш контент безпосередньо, використовуючи один хук.<br><br> - [Інтеграція React](https://intlayer.org/doc/environment/create-react-app)                                                                                                                                                                                               |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/server_component.png?raw=true)                    | **Послідовна реалізація серверних компонентів**<br><br>Ідеально підходить для серверних компонентів Next.js, використовуйте одну й ту саму реалізацію для клієнтських та серверних компонентів, без необхідності передавати вашу функцію `t` через кожен серверний компонент. <br><br> - [Серверні компоненти](https://intlayer.org/doc/environment/nextjs#step-7-utilize-content-in-your-code)                                                                      |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/file_tree.png?raw=true)                           | **Організована кодова база**<br><br>Тримайте свою кодову базу більш організованою: 1 компонент = 1 словник в одній папці. Переклади, розташовані близько до відповідних компонентів, підвищують ремонтоспроможність та наочність. <br><br> - [Як працює Intlayer](https://intlayer.org/doc/concept/how-works-intlayer)                                                                                                                                               |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/url_routing.png?raw=true)                         | **Покращена маршрутизація**<br><br>Повна підтримка маршрутизації додатків, плавно адаптуючись до складних структур додатків, для Next.js, React, Vite, Vue.js тощо.<br><br> - [Дослідіть інтеграцію Next.js](https://intlayer.org/doc/environment/nextjs)                                                                                                                                                                                                            |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/markdown.png?raw=true)                            | **Підтримка Markdown**<br><br>Імпортуйте та інтерпретуйте файли локалізації та віддалений Markdown для багатомовного контенту, такого як політика конфіденційності, документація тощо. Інтерпретуйте та зробіть метадані Markdown доступними у вашому коді.<br><br> - [Файли контенту](https://intlayer.org/doc/concept/content/file)                                                                                                                                |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/visual_editor.png?raw=true)                       | **Безкоштовний візуальний редактор та CMS**<br><br>Безкоштовний візуальний редактор та CMS доступні для авторів контенту, що усуває необхідність у платформі локалізації. Тримайте ваш контент синхронізованим за допомогою Git або експортуйте його повністю або частково за допомогою CMS.<br><br> - [Redactor Intlayer](https://intlayer.org/doc/concept/editor) <br> - [CMS Intlayer](https://intlayer.org/doc/concept/cms)                                      |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle.png?raw=true)                              | **Вміст, придатний до Tree-shaking**<br><br>Вміст, придатний до tree-shaking, що зменшує розмір остаточного пакету. Завантажує контент для кожного компонента, виключаючи будь-який невикористаний контент з вашого пакету. Підтримує ледачого завантаження для підвищення ефективності завантаження додатку. <br><br> - [Оптимізація збірки додатку](https://intlayer.org/doc/concept/how-works-intlayer#app-build-optimization)                                    |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/static_rendering.png?raw=true)                    | **Статичне рендерування**<br><br>Не блокує статичне рендерування. <br><br> - [Інтеграція Next.js](https://intlayer.org/doc/environment/nextjs)                                                                                                                                                                                                                                                                                                                       |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/AI_translation.png?raw=true)                      | **Переклад на основі штучного інтелекту**<br><br>Перетворіть ваш веб-сайт на 231 мову одним кліком, використовуючи розширені інструменти перекладу на основі штучного інтелекту Intlayer з вашим власним постачальником штучного інтелекту/ключем API. <br><br> - [Інтеграція CI/CD](https://intlayer.org/doc/concept/ci-cd) <br> - [CLI Intlayer](https://intlayer.org/doc/concept/cli) <br> - [Автоматичне заповнення](https://intlayer.org/doc/concept/auto-fill) |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/mcp.png?raw=true)                                 | **Інтеграція MCP Server**<br><br>Надає MCP (Model Context Protocol) сервер для автоматизації IDE, що дозволяє безперешкодне управління контентом та робочі процеси i18n безпосередньо в вашому середовищі розробки. <br><br> - [MCP Server](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/mcp_server.md)                                                                                                                                             |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/vscode_extension.png?raw=true)                    | **Розширення VSCode**<br><br>Intlayer надає розширення VSCode для допомоги в управлінні контентом та перекладами, побудові ваших словників, перекладі контенту та багато іншого. <br><br> - [Розширення VSCode](https://intlayer.org/doc/vs-code-extension)                                                                                                                                                                                                          |
+| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/interoperability.png?raw=true)                    | **Взаємосумісність**<br><br>Дозволяє взаємосумісність з react-i18next, next-i18next, next-intl та react-intl. <br><br> - [Intlayer та react-intl](https://intlayer.org/blog/intlayer-with-react-intl) <br> - [Intlayer та next-intl](https://intlayer.org/blog/intlayer-with-next-intl) <br> - [Intlayer та next-i18next](https://intlayer.org/blog/intlayer-with-next-i18next)                                                                                      |
+| Тестування відсутніх перекладів (CLI/CI)                                                                                  | ✅ CLI: npx intlayer content test (дружній до CI аудит)                                                                                                                                                                                                                                                                                                                                                                                                              |
+
+## Порівняння Intlayer з іншими рішеннями
+
+| Функція                                                     | `intlayer`                                                                                                                          | `react-i18next`                                                                                                              | `react-intl` (FormatJS)                                                                                                                                 | `lingui`                                                          | `next-intl`                                                                                                                  | `next-i18next`                                                                                                               | `vue-i18n`                                                              |
+| ----------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------- |
+| **Переклади поблизу компонентів**                           | ✅ Так, вміст знаходиться разом з кожним компонентом                                                                                | ❌ Ні                                                                                                                        | ❌ Ні                                                                                                                                                   | ❌ Ні                                                             | ❌ Ні                                                                                                                        | ❌ Ні                                                                                                                        | ✅ Так - за допомогою `Single File Components` (SFCs)                   |
+| **Інтеграція TypeScript**                                   | ✅ Просунута, автоматично генеровані строгі типи                                                                                    | ⚠️ Базова; додатковий конфіг для безпеки                                                                                     | ✅ Хороша, але менш сувора                                                                                                                              | ⚠️ Типізація, потрібен конфіг                                     | ✅ Хороша                                                                                                                    | ⚠️ Базова                                                                                                                    | ✅ Хороша (типи доступні; безпека ключів потребує налаштування)         |
+| **Виявлення відсутніх перекладів**                          | ✅ Помилка TypeScript та помилка/попередження на етапі збірки                                                                       | ⚠️ Переважно резервні рядки під час виконання                                                                                | ⚠️ Резервні рядки                                                                                                                                       | ⚠️ Потрібен додатковий конфіг                                     | ⚠️ Резервне значення під час виконання                                                                                       | ⚠️ Резервне значення під час виконання                                                                                       | ⚠️ Резервне значення/попередження під час виконання (можна налаштувати) |
+| **Багатий вміст (JSX/Markdown/компоненти)**                 | ✅ Прямої підтримці                                                                                                                 | ⚠️ Обмежена / тільки інтерполяція                                                                                            | ⚠️ ICU синтаксис, не справжній JSX                                                                                                                      | ⚠️ Обмежена                                                       | ❌ Не розроблено для багатих вузлів                                                                                          | ⚠️ Обмежена                                                                                                                  | ⚠️ Обмежена (компоненти через `<i18n-t>`, Markdown через плагіни)       |
+| **Переклад на базі AI**                                     | ✅ Так, підтримує кілька постачальників AI. Використовується з вашими ключами API. Враховує контекст вашої програми та обсяг вмісту | ❌ Ні                                                                                                                        | ❌ Ні                                                                                                                                                   | ❌ Ні                                                             | ❌ Ні                                                                                                                        | ❌ Ні                                                                                                                        | ❌ Ні                                                                   |
+| **Візуальний редактор**                                     | ✅ Так, локальний візуальний редактор + опціональна CMS; можна зовнішнє розміщення вмісту codebase; вбудовуваний                    | ❌ Ні / доступна через зовнішні платформи локалізації                                                                        | ❌ Ні / доступна через зовнішні платформи локалізації                                                                                                   | ❌ Ні / доступна через зовнішні платформи локалізації             | ❌ Ні / доступна через зовнішні платформи локалізації                                                                        | ❌ Ні / доступна через зовнішні платформи локалізації                                                                        | ❌ Ні / доступна через зовнішні платформи локалізації                   |
+| **Локалізований маршрутинг**                                | ✅ Так, підтримує локалізовані шляхи (працює з Next.js та Vite)                                                                     | ⚠️ Немає вбудованого, потребує плагінів (наприклад `next-i18next`) або власне налаштування маршрутизатора                    | ❌ Ні, тільки форматування повідомлень, маршрутизація має бути ручною                                                                                   | ⚠️ Немає вбудованого, потребує плагінів або ручного налаштування  | ✅ Вбудований, App Router підтримує сегмент `[locale]`                                                                       | ✅ Вбудований                                                                                                                | ✅ Вбудований                                                           |
+| **Динамічна генерація маршрутів**                           | ✅ Так                                                                                                                              | ⚠️ Плагін/екосистема або ручне налаштування                                                                                  | ❌ Не передбачено                                                                                                                                       | ⚠️ Плагін/ручне                                                   | ✅ Так                                                                                                                       | ✅ Так                                                                                                                       | ❌ Не передбачено (Nuxt i18n надає)                                     |
+| **Плюралізація**                                            | ✅ Шаблони на основі перелічення                                                                                                    | ✅ Можна налаштовувати (плагіни як i18next-icu)                                                                              | ✅ (ICU)                                                                                                                                                | ✅ (ICU/messageformat)                                            | ✅ Хороша                                                                                                                    | ✅ Хороша                                                                                                                    | ✅ Вбудовані правила плюралізації                                       |
+| **Форматування (дати, числа, валюти)**                      | ✅ Оптимізовані форматери (Intl під капотом)                                                                                        | ⚠️ Через плагіни або власне використання Intl                                                                                | ✅ ICU форматери                                                                                                                                        | ✅ ICU/CLI помічники                                              | ✅ Хороша (помічники Intl)                                                                                                   | ✅ Хороша (помічники Intl)                                                                                                   | ✅ Вбудовані форматери дат/чисел (Intl)                                 |
+| **Формат вмісту**                                           | ✅ .tsx, .ts, .js, .json, .md, .txt, (.yaml WIP)                                                                                    | ⚠️ .json                                                                                                                     | ✅ .json, .js                                                                                                                                           | ⚠️ .po, .json                                                     | ✅ .json, .js, .ts                                                                                                           | ⚠️ .json                                                                                                                     | ✅ .json, .js                                                           |
+| **Підтримка ICU**                                           | ⚠️ WIP                                                                                                                              | ⚠️ Через плагін (i18next-icu)                                                                                                | ✅ Так                                                                                                                                                  | ✅ Так                                                            | ✅ Так                                                                                                                       | ⚠️ Через плагін (`i18next-icu`)                                                                                              | ⚠️ Через власний форматер/компілятор                                    |
+| **SEO помічники (hreflang, sitemap)**                       | ✅ Вбудовані інструменти: помічники для sitemap, robots.txt, метаданих                                                              | ⚠️ Плагіни спільноти/ручне                                                                                                   | ❌ Не основне                                                                                                                                           | ❌ Не основне                                                     | ✅ Хороша                                                                                                                    | ✅ Хороша                                                                                                                    | ❌ Не основне (Nuxt i18n надає помічники)                               |
+| **Екосистема / Спільнота**                                  | ⚠️ Менша, але швидко зростає та реактивна                                                                                           | ✅ Найбільша та зріла                                                                                                        | ✅ Велика                                                                                                                                               | ⚠️ Менша                                                          | ✅ Середня, сфокусована на Next.js                                                                                           | ✅ Середня, сфокусована на Next.js                                                                                           | ✅ Велика в екосистемі Vue                                              |
+| **Рендеринг на сервері та серверні компоненти**             | ✅ Так, оптимізовано для SSR / React Server Components                                                                              | ⚠️ Підтримується на рівні сторінки, але потребує передачі t-функцій по дереву компонентів для дочірніх серверних компонентів | ⚠️ Підтримується на рівні сторінки з додатковим налаштуванням, але потребує передачі t-функцій по дереву компонентів для дочірніх серверних компонентів | ✅ Підтримується, потребує налаштування                           | ⚠️ Підтримується на рівні сторінки, але потребує передачі t-функцій по дереву компонентів для дочірніх серверних компонентів | ⚠️ Підтримується на рівні сторінки, але потребує передачі t-функцій по дереву компонентів для дочірніх серверних компонентів | ✅ SSR через Nuxt/Vue SSR (без RSC)                                     |
+| **Tree-shaking (завантаження тільки використаного вмісту)** | ✅ Так, за компонентом під час збірки через плагіни Babel/SWC                                                                       | ⚠️ Зазвичай завантажує все (можна поліпшити з namespace/кодом розділення)                                                    | ⚠️ Зазвичай завантажує все                                                                                                                              | ❌ За замовчуванням ні                                            | ⚠️ Часткова                                                                                                                  | ⚠️ Часткова                                                                                                                  | ⚠️ Часткова (з розділенням коду/ручним налаштуванням)                   |
+| **Ледача завантаження**                                     | ✅ Так, за локалею / за словником                                                                                                   | ✅ Так (наприклад, backends/namespaces за запитом)                                                                           | ✅ Так (розділені пакети локалей)                                                                                                                       | ✅ Так (динамічне імпортування каталогу)                          | ✅ Так (за маршрутом/локалю), потрібне управління namespace                                                                  | ✅ Так (за маршрутом/локалю), потрібне управління namespace                                                                  | ✅ Так (асинхронні повідомлення локалей)                                |
+| **Очищення невикористаного вмісту**                         | ✅ Так, за словником під час збірки                                                                                                 | ❌ Ні, тільки через ручне розділення namespace                                                                               | ❌ Ні, всі оголошені повідомлення включені в bundle                                                                                                     | ✅ Так, невикористовані ключі виявлені та видалені під час збірки | ❌ Ні, можна керувати вручну з управлінням namespace                                                                         | ❌ Ні, можна керувати вручну з управлінням namespace                                                                         | ❌ Ні, можливо тільки через ручне ледаче завантаження                   |
+| **Управління великими проектами**                           | ✅ Заохочує модульну структуру, підходить для дизайн-системи                                                                        | ⚠️ Потрібна хороша дисципліна у файлах                                                                                       | ⚠️ Центральні каталоги можуть стати великими                                                                                                            | ⚠️ Може стати складною                                            | ✅ Модульна з налаштуванням                                                                                                  | ✅ Модульна з налаштуванням                                                                                                  | ✅ Модульна з Vue Router/Nuxt i18n налаштуванням                        |
+
 ## Зірки на GitHub
 
 Зірки на GitHub є потужним індикатором популярності проекту, довіри спільноти та довгострокової актуальності. Хоча вони не є прямим показником технічної якості, вони відображають, скільки розробників вважають проект корисним, стежать за його розвитком і, ймовірно, впровадять його. Для оцінки цінності проекту зірки допомагають порівняти інтерес до альтернатив і дають уявлення про зростання екосистеми.