@intlayer/docs 8.11.1 → 8.11.3

package/docs/uk/dictionary/markdown.md

@@ -17,6 +17,9 @@ slugs:
   - content
   - markdown
 history:
+  - version: 8.11.0
+    date: 2026-05-28
+    changes: "Дозволити попередній синтаксичний аналіз AST Markdown для SSR / гідратації"
   - version: 8.10.0
     date: 2026-05-19
     changes: "Додано підтримку файлів `.content.md`"
@@ -1149,6 +1152,164 @@ export class MyComponent {
 
 ---
 
+## Рендеринг на стороні сервера (SSR) та гідратація
+
+У порівнянні з іншими парсерами Markdown, такими як remark / rehype, Intlayer Markdown не має залежностей і працює як на клієнті, так і на сервері.
+
+Однак Intlayer оптимізує синтаксичний аналіз для фреймворків серверного рендерингу (SSR) (таких як Next.js App Router, React Router, Nuxt, SvelteKit тощо).
+
+Замість надсилання необроблених рядків Markdown клієнту та їх аналізу в браузері (що призводить до зниження продуктивності), Intlayer дозволяє попередньо проаналізувати Markdown в абстрактне синтаксичне дерево (AST) на сервері.
+
+Ви можете використовувати функцію `parseMarkdown` з пакету Intlayer вашого фреймворку на стороні сервера для генерації серіалізованого AST (об'єкта `ParsedMarkdown`) і передачі його безпосередньо на фронтенд. Всі утиліти рендерингу Intlayer (такі як `<MarkdownRenderer>`, `useMarkdownRenderer` тощо) автоматично приймають цей об'єкт AST і плавно рендерять його.
+
+### Приклад в архітектурі Сервер/Клієнт
+
+<Tabs group="framework">
+  <Tab label="React Router" value="react">
+
+    ```tsx fileName="server.ts"
+    import { parseMarkdown } from "react-intlayer/markdown";
+
+    // 1. На сервері: перетворити markdown на серіалізоване AST
+    export const loader = async () => {
+      const markdownString = "## My title \n\nLorem Ipsum";
+      const ast = parseMarkdown(markdownString);
+
+      // Повернути AST клієнту у форматі JSON
+      return Response.json({ content: ast });
+    };
+    ```
+
+    ```tsx fileName="client.tsx"
+    import { useLoaderData } from "react-router";
+    import { MarkdownRenderer } from "react-intlayer/markdown";
+
+    // 2. На клієнті: відрендерити AST безпосередньо без повторного аналізу
+    export default function Page() {
+      const { content } = useLoaderData();
+
+      // Рендерер приймає або необроблений рядок, або проаналізоване AST
+      return <MarkdownRenderer content={content} />;
+    }
+    ```
+
+  </Tab>
+  <Tab label="Next.js" value="nextjs">
+
+    ```tsx fileName="app/page.tsx"
+    import { parseMarkdown } from "next-intlayer/markdown";
+    import { MarkdownRenderer } from "next-intlayer/markdown";
+
+    export default async function Page() {
+      // 1. Перетворити markdown на серіалізоване AST на сервері
+      const markdownString = "## My title \n\nLorem Ipsum";
+      const ast = parseMarkdown(markdownString);
+
+      // 2. Відрендерити AST безпосередньо
+      // У серверному компоненті це працює безшовно і передає AST
+    // безпосередньо в базові клієнтські компоненти, якщо це необхідно.
+      return <MarkdownRenderer content={ast} />;
+    }
+    ```
+
+  </Tab>
+  <Tab label="Vue / Nuxt" value="vue">
+
+    ```vue fileName="pages/index.vue"
+    <script setup lang="ts">
+    import { parseMarkdown } from "vue-intlayer/markdown";
+    import { MarkdownRenderer } from "vue-intlayer/markdown";
+
+    // 1. Отримати та перетворити markdown на AST на сервері
+    const { data: ast } = await useAsyncData('markdown', () => {
+      const markdownString = "## My title \n\nLorem Ipsum";
+      return parseMarkdown(markdownString);
+    });
+    </script>
+
+    <template>
+      <!-- 2. На клієнті: відрендерити AST безпосередньо без повторного аналізу -->
+      <MarkdownRenderer :content="ast" />
+    </template>
+    ```
+
+  </Tab>
+  <Tab label="SvelteKit" value="svelte">
+
+    ```typescript fileName="+page.server.ts"
+    import { parseMarkdown } from "svelte-intlayer/markdown";
+
+    // 1. На сервері: перетворити markdown на серіалізоване AST
+    export const load = async () => {
+      const markdownString = "## My title \n\nLorem Ipsum";
+      const ast = parseMarkdown(markdownString);
+
+      // Повернути AST клієнту
+      return { content: ast };
+    };
+    ```
+
+    ```svelte fileName="+page.svelte"
+    <script lang="ts">
+      import { MarkdownRenderer } from "svelte-intlayer/markdown";
+      export let data;
+    </script>
+
+    <!-- 2. На клієнті: відрендерити AST безпосередньо без повторного аналізу -->
+    <MarkdownRenderer value={data.content} />
+    ```
+
+  </Tab>
+  <Tab label="Angular" value="angular">
+
+    Angular SSR зазвичай отримує дані на сервері під час початкового завантаження та виконує гідратацію на клієнті. Ви можете використовувати резолвери для передачі AST.
+
+    ```typescript fileName="app.resolver.ts"
+    import { Injectable } from "@angular/core";
+    import { Resolve } from "@angular/router";
+    import { parseMarkdown, type ParsedMarkdown } from "angular-intlayer/markdown";
+
+    @Injectable({ providedIn: "root" })
+    export class MarkdownResolver implements Resolve<ParsedMarkdown> {
+      resolve(): ParsedMarkdown {
+        const markdownString = "## My title \n\nLorem Ipsum";
+        // 1. На сервері: перетворити markdown на серіалізоване AST
+        return parseMarkdown(markdownString);
+      }
+    }
+    ```
+
+    ```typescript fileName="app.component.ts"
+    import { Component } from "@angular/core";
+    import { ActivatedRoute } from "@angular/router";
+    import { IntlayerMarkdownService, type ParsedMarkdown } from "angular-intlayer/markdown";
+
+    @Component({
+      selector: "app-root",
+      template: `<div [innerHTML]="renderedMarkdown"></div>`,
+    })
+    export class AppComponent {
+      renderedMarkdown: string = "";
+
+      constructor(
+        private route: ActivatedRoute,
+        private markdownService: IntlayerMarkdownService
+      ) {
+        // 2. На клієнті: відрендерити AST безпосередньо без повторного аналізу
+        this.route.data.subscribe((data) => {
+          this.renderedMarkdown = this.markdownService.renderMarkdown(
+            data.markdownAst
+          ) as string;
+        });
+      }
+    }
+    ```
+
+  </Tab>
+</Tabs>
+
+Цей підхід гарантує, що логіка аналізу Markdown повністю виконується на сервері, що значно скорочує час виконання на стороні клієнта та підвищує швидкість початкової гідратації.
+
 ## Довідник опцій
 
 Ці параметри можна передати до `MarkdownProvider`, `MarkdownRenderer`, `useMarkdownRenderer` та `renderMarkdown`.

package/docs/uk/interest_of_intlayer.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-08-14
-updatedAt: 2025-09-27
+updatedAt: 2026-05-31
 title: Переваги Intlayer
 description: Відкрийте для себе переваги та користь використання Intlayer у ваших проектах. Зрозумійте, чому Intlayer виділяється серед інших фреймворків.
 keywords:
@@ -13,6 +13,9 @@ slugs:
   - doc
   - why
 history:
+  - version: 8.11.2
+    date: 2026-05-31
+    changes: "Додайте чому Intlayer поверх альтернативного розділу"
   - version: 7.3.1
     date: 2025-11-27
     changes: "Випуск Компілятора"
@@ -26,197 +29,52 @@ history:
 
 # Чому варто розглянути Intlayer?
 
-## Що таке Intlayer?
-
-**Intlayer** - це бібліотека інтернаціоналізації, розроблена спеціально для розробників JavaScript. Вона дозволяє оголошувати ваш вміст у будь-якому місці вашого коду. Вона перетворює оголошення багатомовного вмісту на структуровані словники для легкої інтеграції у ваш код. Використовуючи TypeScript, **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
-```
-
-Або тут з використанням просторів назв (namespaces):
-
-```bash
-.
-├── locales
-│   ├── en
-│   │  ├── footer.json
-│   │  └── navbar.json
-│   ├── fr
-│   │  ├── footer.json
-│   │  └── navbar.json
-│   └── es
-│      ├── footer.json
-│      └── navbar.json
-├── i18n.ts
-└── src
-    └── components
-        └── MyComponent
-            └── index.tsx
-```
-
-Такий тип архітектури уповільнює процес розробки та ускладнює підтримку кодової бази з кількох причин:
-
-1. **Для кожного нового створеного компонента ви повинні:**
-   - Створити новий ресурс/простір назв у папці `locales`
-   - Не забути імпортувати новий простір назв на вашій сторінці
-   - Перекласти ваш вміст (часто робиться вручну шляхом копіювання/вставлення від постачальників ШІ)
-
-2. **Для будь-якої зміни у ваших компонентах ви повинні:**
-   - Шукати пов’язаний ресурс/простір назв (далеко від компонента)
-   - Перекласти ваш вміст
-   - Переконатися, що ваш вміст актуальний для будь-якої мови
-   - Перевірити, чи ваш простір назв не містить невикористаних ключів/значень
-   - Переконатися, що структура ваших JSON-файлів однакова для всіх мов
-
-У професійних проектах, які використовують ці рішення, часто застосовуються платформи локалізації для управління перекладом вмісту. Однак для великих проектів це може швидко стати дорогим.
-
-Щоб вирішити цю проблему, Intlayer використовує підхід, який обмежує область дії вашого вмісту кожним компонентом і тримає ваш вміст поруч із вашим компонентом, як ми часто робимо з CSS (`styled-components`), типами, документацією (`storybook`) або юніт-тестами (`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({
-      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
-   - Інструменти автозаповнення ШІ у вашій IDE (наприклад, GitHub Copilot) можуть допомогти вам оголосити вміст, зменшуючи кількість копіювання/вставлення
-
-2. **Очистити вашу кодову базу**
-   - Зменшити складність
-   - Покращити підтримку
-
-3. **Легше дублювати компоненти та пов’язаний з ними вміст (Приклад: компоненти входу/реєстрації тощо)**
-   - Обмежуючи ризик впливу на вміст інших компонентів
-   - Копіюючи/вставляючи ваш вміст з одного додатка в інший без зовнішніх залежностей
-
-4. **Уникнути забруднення кодової бази невикористаними ключами/значеннями для невикористаних компонентів**
-   - Якщо ви не використовуєте компонент, Intlayer не імпортуватиме пов’язаний з ним вміст
-   - Якщо ви видалите компонент, вам буде легше згадати про видалення пов’язаного з ним вмісту, оскільки він буде знаходитися в тій же папці
-
-5. **Зменшити когнітивне навантаження на ШІ-агентів для оголошення вашого багатомовного вмісту**
-   - ШІ-агенту не доведеться сканувати всю кодову базу, щоб дізнатися, де реалізувати ваш вміст
-   - Переклади можна легко виконати за допомогою інструментів автозаповнення ШІ у вашій IDE (наприклад, GitHub Copilot)
-
-6. **Оптимізувати продуктивність завантаження**
-   - Якщо компонент завантажується ледаче (lazy-loaded), пов’язаний з ним вміст завантажуватиметься одночасно
-
-## Додаткові функції Intlayer
-
-| Функція                                                                                                                   | Опис                                                                                                                                                                                                                                                                                                                                                                                                                        |
-| ------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| ![Функція](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="Функція" 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)                      | **Середовище Type-Safe**<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)                    | **Узгоджена реалізація Server Component**<br><br>Ідеально підходить для серверних компонентів Next.js, використовуйте ту саму реалізацію для клієнтських і серверних компонентів, не потрібно передавати функцію `t` через кожен серверний компонент. <br><br> - [Server Components](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> - [Редактор Intlayer](https://intlayer.org/doc/concept/editor) <br> - [Intlayer CMS](https://intlayer.org/doc/concept/cms)       |
-| ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle.png?raw=true)                              | **Вміст типу Tree-shakable**<br><br>Вміст типу tree-shakable, що зменшує розмір кінцевого пакета. Завантажує вміст на рівні компонента, виключаючи будь-який невикористаний вміст із вашого пакета. Підтримує ледаче завантаження для підвищення ефективності завантаження додатка. <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> - [Intlayer CLI](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**<br><br>Забезпечує сервер MCP (Model Context Protocol) для автоматизації IDE, дозволяючи безперешкодне управління вмістом та робочі процеси i18n безпосередньо у вашому середовищі розробки. <br><br> - [Сервер MCP](https://github.com/aymericzip/intlayer/blob/main/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 та помилки/попередження під час збірки                                                           | ⚠️ Переважно рядки відкату (fallback) під час виконання                                                  | ⚠️ Рядки відкату                                                                                                            | ⚠️ Потрібна додаткова конфігурація                                | ⚠️ Відкат під час виконання                                                                      | ⚠️ Відкат під час виконання                                                                      | ⚠️ Відкат/попередження під час виконання (можна налаштувати)      |
-| **Багатий вміст (JSX/Markdown/компоненти)**        | ✅ Пряма підтримка                                                                                                                   | ⚠️ Обмежено / лише інтерполяція                                                                          | ⚠️ Синтаксис ICU, не справжній JSX                                                                                          | ⚠️ Обмежено                                                       | ❌ Не розраховано на багаті вузли                                                                | ⚠️ Обмежено                                                                                      | ⚠️ Обмежено (компоненти через `<i18n-t>`, Markdown через плагіни) |
-| **Переклад на основі ШІ**                          | ✅ Так, підтримує кількох постачальників ШІ. Можна використовувати з власними ключами API. Враховує контекст додатка та обсяг вмісту | ❌ Ні                                                                                                    | ❌ Ні                                                                                                                       | ❌ Ні                                                             | ❌ Ні                                                                                            | ❌ Ні                                                                                            | ❌ Ні                                                             |
-| **Візуальний редактор**                            | ✅ Так, локальний візуальний редактор + опціональна CMS; може виносити вміст кодової бази на аутсорс; вбудовуваний                   | ❌ Ні / доступно через зовнішні платформи локалізації                                                    | ❌ Ні / доступно через зовнішні платформи локалізації                                                                       | ❌ Ні / доступно через зовнішні платформи локалізації             | ❌ Ні / доступно через зовнішні платформи локалізації                                            | ❌ Ні / доступно через зовнішні платформи локалізації                                            | ❌ Ні / доступно через зовнішні платформи локалізації             |
-| **Локалізована маршрутизація**                     | ✅ Так, підтримує локалізовані шляхи "з коробки" (працює з Next.js та Vite)                                                          | ⚠️ Немає вбудованої, потрібні плагіни (наприклад, `next-i18next`) або власна конфігурація маршрутизатора | ❌ Ні, лише форматування повідомлень, маршрутизація має бути ручною                                                         | ⚠️ Немає вбудованої, потрібні плагіни або ручне налаштування      | ✅ Вбудовано, App Router підтримує сегмент `[locale]`                                            | ✅ Вбудовано                                                                                     | ✅ Вбудовано                                                      |
-| **Динамічне генерування маршрутів**                | ✅ Так                                                                                                                               | ⚠️ Плагін/екосистема або ручне налаштування                                                              | ❌ Не надається                                                                                                             | ⚠️ Плагін/вручну                                                  | ✅ Так                                                                                           | ✅ Так                                                                                           | ❌ Не надається (надає Nuxt i18n)                                 |
-| **Множина**                                        | ✅ Шаблони на основі перерахувань (enums)                                                                                            | ✅ Можна налаштувати (плагіни, такі як i18next-icu)                                                      | ✅ (ICU)                                                                                                                    | ✅ (ICU/messageformat)                                            | ✅ Добре                                                                                         | ✅ Добре                                                                                         | ✅ Вбудовані правила множини                                      |
-| **Форматування (дати, числа, валюти)**             | ✅ Оптимізовані форматувальники (Intl під капотом)                                                                                   | ⚠️ Через плагіни або власне використання Intl                                                            | ✅ Форматувальники ICU                                                                                                      | ✅ Хелпери ICU/CLI                                                | ✅ Добре (хелпери Intl)                                                                          | ✅ Добре (хелпери Intl)                                                                          | ✅ Вбудовані форматувальники дат/чисел (Intl)                     |
-| **Формат вмісту**                                  | ✅ .tsx, .ts, .js, .json, .md, .txt, (.yaml в роботі)                                                                                | ⚠️ .json                                                                                                 | ✅ .json, .js                                                                                                               | ⚠️ .po, .json                                                     | ✅ .json, .js, .ts                                                                               | ⚠️ .json                                                                                         | ✅ .json, .js                                                     |
-| **Підтримка ICU**                                  | ⚠️ В роботі                                                                                                                          | ⚠️ Через плагін (i18next-icu)                                                                            | ✅ Так                                                                                                                      | ✅ Так                                                            | ✅ Так                                                                                           | ⚠️ Через плагін (`i18next-icu`)                                                                  | ⚠️ Через власний форматувальник/компілятор                        |
-| **Хелпери SEO (hreflang, sitemap)**                | ✅ Вбудовані інструменти: хелпери для sitemap, robots.txt, метаданих                                                                 | ⚠️ Плагіни спільноти / вручну                                                                            | ❌ Не є основним                                                                                                            | ❌ Не є основним                                                  | ✅ Добре                                                                                         | ✅ Добре                                                                                         | ❌ Не є основним (надає хелпери Nuxt i18n)                        |
-| **Екосистема / Спільнота**                         | ⚠️ Менша, але швидко зростає та чуйно реагує                                                                                         | ✅ Найбільша та зріла                                                                                    | ✅ Велика                                                                                                                   | ⚠️ Менша                                                          | ✅ Середнього розміру, зосереджена на Next.js                                                    | ✅ Середнього розміру, зосереджена на Next.js                                                    | ✅ Велика в екосистемі Vue                                        |
-| **Server-side Rendering та Server Components**     | ✅ Так, спрощено для SSR / React Server Components                                                                                   | ⚠️ Підтримується на рівні сторінки, але потрібно передавати t-функції вниз по дереву компонентів         | ⚠️ Підтримується на рівні сторінки з додатковим налаштуванням, але потрібно передавати t-функції вниз по дереву компонентів | ✅ Підтримується, потрібне налаштування                           | ⚠️ Підтримується на рівні сторінки, але потрібно передавати t-функції вниз по дереву компонентів | ⚠️ Підтримується на рівні сторінки, але потрібно передавати t-функції вниз по дереву компонентів | ✅ SSR через Nuxt/Vue SSR (без RSC)                               |
-| **Tree-shaking (завантаження лише використаного)** | ✅ Так, для кожного компонента під час збірки через плагіни Babel/SWC                                                                | ⚠️ Зазвичай завантажує все (можна покращити через простори назв / code-splitting)                        | ⚠️ Зазвичай завантажує все                                                                                                  | ❌ Не типово                                                      | ⚠️ Частково                                                                                      | ⚠️ Частково                                                                                      | ⚠️ Частково (з code-splitting / ручним налаштуванням)             |
-| **Ледаче завантаження (Lazy loading)**             | ✅ Так, для кожної мови / для кожного словника                                                                                       | ✅ Так (наприклад, бекенди/простори назв за запитом)                                                     | ✅ Так (розділення мовних пакетів)                                                                                          | ✅ Так (динамічний імпорт каталогів)                              | ✅ Так (на маршрут / на мову), потрібне управління просторами назв                               | ✅ Так (на маршрут / на мову), потрібне управління просторами назв                               | ✅ Так (асинхронні мовні повідомлення)                            |
-| **Очищення невикористаного вмісту**                | ✅ Так, для кожного словника під час збірки                                                                                          | ❌ Ні, лише через ручне розділення просторів назв                                                        | ❌ Ні, усі оголошені повідомлення пакуються                                                                                 | ✅ Так, невикористані ключі виявляються та видаляються при збірці | ❌ Ні, можна керувати вручну за допомогою управління просторами назв                             | ❌ Ні, можна керувати вручну за допомогою управління просторами назв                             | ❌ Ні, можливо лише через ручне ледаче завантаження               |
-| **Управління великими проектами**                  | ✅ Заохочує модульність, підходить для дизайн-систем                                                                                 | ⚠️ Потрібна хороша дисципліна файлів                                                                     | ⚠️ Центральні каталоги можуть стати великими                                                                                | ⚠️ Може стати складним                                            | ✅ Модульно з налаштуванням                                                                      | ✅ Модульно з налаштуванням                                                                      | ✅ Модульно з налаштуванням Vue Router/Nuxt i18n                  |
+## Чому варто обрати Intlayer, а не альтернативи?
+
+Порівняно з основними рішеннями, такими як `next-intl` або `i18next`, Intlayer — це рішення, яке має такі інтегровані оптимізації, як:
+
+<AccordionGroup>
+<Accordion header="Розмір бандлу">
+
+Замість того, щоб завантажувати великі файли JSON на свої сторінки, завантажуйте лише необхідний вміст. Intlayer допомагає **зменшити розмір бандлу і сторінок до 50%**.
+
+</Accordion>
+<Accordion header="Підтримуваність">
+
+Організація вмісту за окремими областями (scoping) **полегшує технічне обслуговування** великомасштабних програм. Ви можете скопіювати або видалити окрему папку функцій без розумового навантаження перегляду всієї кодової бази вмісту. Крім того, Intlayer **повністю типізований (fully typed)**, щоб забезпечити точність вашого вмісту.
+
+</Accordion>
+<Accordion header="Агент AI">
+
+Спільне розміщення вмісту **зменшує контекст, необхідний** для великих мовних моделей (LLM). Intlayer також постачається з набором інструментів, наприклад **CLI** для перевірки відсутніх перекладів,**[LSP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/lsp.md)**, **[MCP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/mcp_server.md)** і **[навички агента](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/agent_skills.md)**, щоб зробити роботу розробника (DX) ще зручнішою для агентів ШІ.
+
+</Accordion>
+<Accordion header="Функція">
+
+Intlayer пропонує низку додаткових функцій, яких немає в інших рішеннях i18n, як-от [підтримка Markdown](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/dictionary/markdown.md), [отримання зовнішніх вміст](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/dictionary/function_fetching.md), [завантаження вмісту файлу](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/dictionary/file.md), [живий вміст оновлення](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/cli/live.md), [візуальний редактор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_visual_editor.md) тощо.
+
+</Accordion>
+<Accordion header="Автоматизація">
+
+Використовуйте автоматизацію для перекладу в конвеєрі CI/CD за допомогою LLM за вашим вибором за рахунок вашого постачальника штучного інтелекту. Intlayer також пропонує **компілятор** для автоматизації екстракція вмісту, а також [веб-платформу](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_CMS.md), щоб допомогти **перекладати у фоновому режимі**.
+
+</Accordion>
+<Accordion header="Продуктивність">
+
+Підключення великих файлів JSON до компонентів може призвести до проблем з продуктивністю та реакцією. Intlayer оптимізує завантаження вмісту під час збірки (build time).
+
+</Accordion>
+<Accordion header="Співпраця з не-розробниками">
+
+Більше ніж просто рішення i18n, Intlayer пропонує **власний [візуальний редактор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_visual_editor.md)** і **[повний CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_CMS.md)**, щоб допомогти вам керувати своїм багатомовним вмістом у **реальному часі**, спрощуючи співпрацю з перекладачами, копірайтерами та іншими членами команди. Контент можна зберігати локально та/або віддалено.
+
+</Accordion>
+<Accordion header="Крос фреймворк дизайн">
+
+Якщо ви використовуєте різні фреймворки для різних частин вашої програми (наприклад, React, React-native, Vue, Angular, Svelte тощо), Intlayer надає спосіб **використовувати загальний синатаксис і реалізацію в усіх основних інтерфейсних фреймворках**. Ви також зможете поділитися своєю декларацією вмісту у своїй системі дизайну, програмах, серверній частині тощо.
+
+</Accordion>
+</AccordionGroup>
 
 ---
 

package/docs/uk/intlayer_with_adonisjs.md

@@ -1,8 +1,8 @@
 ---
 createdAt: 2025-08-23
-updatedAt: 2026-05-06
-title: AdonisJS i18n - Як перекласти додаток AdonisJS у 2026
-description: Дізнайтеся, як зробити ваш бекенд AdonisJS багатомовним. Дотримуйтесь документації, щоб інтернаціоналізувати (i18n) та перекласти його.
+updatedAt: 2026-05-31
+title: AdonisJS i18n - Повний посібник з перекладу AdonisJS
+description: Найкраще рішення для розміру бандлу, SEO, продуктивності & підтримуваності. Зробіть AdonisJS бекенд багатомовним у 2026, переклад LLM, Agent Skills & MCP.
 keywords:
   - Інтернаціоналізація
   - Документація