@intlayer/docs 8.9.4-canary.0 → 8.9.5

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 (207) hide show
  1. package/dist/cjs/generated/docs.entry.cjs +20 -0
  2. package/dist/cjs/generated/docs.entry.cjs.map +1 -1
  3. package/dist/esm/generated/docs.entry.mjs +20 -0
  4. package/dist/esm/generated/docs.entry.mjs.map +1 -1
  5. package/dist/types/generated/docs.entry.d.ts +1 -0
  6. package/dist/types/generated/docs.entry.d.ts.map +1 -1
  7. package/docs/ar/benchmark/index.md +0 -3
  8. package/docs/ar/benchmark/nextjs.md +15 -6
  9. package/docs/ar/benchmark/solid.md +155 -0
  10. package/docs/ar/benchmark/svelte.md +148 -0
  11. package/docs/ar/benchmark/tanstack.md +12 -3
  12. package/docs/ar/benchmark/vue.md +160 -0
  13. package/docs/ar/configuration.md +16 -12
  14. package/docs/ar/dictionary/content_file.md +51 -1
  15. package/docs/ar/mcp_server.md +30 -17
  16. package/docs/ar/plugins/sync-po.md +333 -0
  17. package/docs/bn/configuration.md +16 -12
  18. package/docs/cs/configuration.md +16 -12
  19. package/docs/de/benchmark/index.md +0 -3
  20. package/docs/de/benchmark/nextjs.md +15 -6
  21. package/docs/de/benchmark/solid.md +155 -0
  22. package/docs/de/benchmark/svelte.md +148 -0
  23. package/docs/de/benchmark/tanstack.md +12 -3
  24. package/docs/de/benchmark/vue.md +160 -0
  25. package/docs/de/configuration.md +16 -12
  26. package/docs/de/dictionary/content_file.md +52 -2
  27. package/docs/de/mcp_server.md +29 -16
  28. package/docs/de/plugins/sync-po.md +332 -0
  29. package/docs/en/benchmark/nextjs.md +11 -2
  30. package/docs/en/benchmark/solid.md +22 -4
  31. package/docs/en/benchmark/svelte.md +17 -5
  32. package/docs/en/benchmark/tanstack.md +18 -3
  33. package/docs/en/benchmark/vue.md +17 -11
  34. package/docs/en/configuration.md +16 -13
  35. package/docs/en/dictionary/content_file.md +51 -1
  36. package/docs/en/mcp_server.md +31 -18
  37. package/docs/en/plugins/sync-po.md +333 -0
  38. package/docs/en-GB/benchmark/index.md +0 -3
  39. package/docs/en-GB/benchmark/nextjs.md +15 -6
  40. package/docs/en-GB/benchmark/solid.md +155 -0
  41. package/docs/en-GB/benchmark/svelte.md +148 -0
  42. package/docs/en-GB/benchmark/tanstack.md +12 -3
  43. package/docs/en-GB/benchmark/vue.md +160 -0
  44. package/docs/en-GB/configuration.md +15 -11
  45. package/docs/en-GB/dictionary/content_file.md +51 -1
  46. package/docs/en-GB/mcp_server.md +31 -18
  47. package/docs/en-GB/plugins/sync-po.md +333 -0
  48. package/docs/es/benchmark/index.md +0 -3
  49. package/docs/es/benchmark/nextjs.md +15 -6
  50. package/docs/es/benchmark/solid.md +155 -0
  51. package/docs/es/benchmark/svelte.md +148 -0
  52. package/docs/es/benchmark/tanstack.md +12 -3
  53. package/docs/es/benchmark/vue.md +160 -0
  54. package/docs/es/configuration.md +16 -12
  55. package/docs/es/dictionary/content_file.md +51 -1
  56. package/docs/es/mcp_server.md +30 -17
  57. package/docs/es/plugins/sync-po.md +333 -0
  58. package/docs/fr/benchmark/index.md +0 -3
  59. package/docs/fr/benchmark/nextjs.md +15 -6
  60. package/docs/fr/benchmark/solid.md +155 -0
  61. package/docs/fr/benchmark/svelte.md +148 -0
  62. package/docs/fr/benchmark/tanstack.md +12 -3
  63. package/docs/fr/benchmark/vue.md +160 -0
  64. package/docs/fr/configuration.md +16 -12
  65. package/docs/fr/dictionary/content_file.md +51 -1
  66. package/docs/fr/mcp_server.md +30 -17
  67. package/docs/fr/plugins/sync-po.md +333 -0
  68. package/docs/hi/benchmark/nextjs.md +15 -6
  69. package/docs/hi/benchmark/solid.md +155 -0
  70. package/docs/hi/benchmark/svelte.md +148 -0
  71. package/docs/hi/benchmark/tanstack.md +12 -3
  72. package/docs/hi/benchmark/vue.md +160 -0
  73. package/docs/hi/configuration.md +16 -12
  74. package/docs/hi/dictionary/content_file.md +51 -1
  75. package/docs/hi/mcp_server.md +31 -18
  76. package/docs/hi/plugins/sync-po.md +333 -0
  77. package/docs/id/benchmark/index.md +0 -3
  78. package/docs/id/benchmark/nextjs.md +15 -6
  79. package/docs/id/benchmark/solid.md +155 -0
  80. package/docs/id/benchmark/svelte.md +148 -0
  81. package/docs/id/benchmark/tanstack.md +12 -3
  82. package/docs/id/benchmark/vue.md +160 -0
  83. package/docs/id/configuration.md +16 -12
  84. package/docs/id/dictionary/content_file.md +51 -1
  85. package/docs/id/mcp_server.md +30 -17
  86. package/docs/id/plugins/sync-po.md +333 -0
  87. package/docs/it/benchmark/index.md +1 -4
  88. package/docs/it/benchmark/nextjs.md +15 -6
  89. package/docs/it/benchmark/solid.md +155 -0
  90. package/docs/it/benchmark/svelte.md +148 -0
  91. package/docs/it/benchmark/tanstack.md +12 -3
  92. package/docs/it/benchmark/vue.md +160 -0
  93. package/docs/it/configuration.md +16 -12
  94. package/docs/it/dictionary/content_file.md +51 -1
  95. package/docs/it/mcp_server.md +30 -17
  96. package/docs/it/plugins/sync-po.md +333 -0
  97. package/docs/ja/benchmark/index.md +5 -5
  98. package/docs/ja/benchmark/nextjs.md +15 -6
  99. package/docs/ja/benchmark/solid.md +155 -0
  100. package/docs/ja/benchmark/svelte.md +148 -0
  101. package/docs/ja/benchmark/tanstack.md +12 -3
  102. package/docs/ja/benchmark/vue.md +160 -0
  103. package/docs/ja/configuration.md +16 -12
  104. package/docs/ja/dictionary/content_file.md +50 -2
  105. package/docs/ja/intlayer_with_nextjs_no_locale_path.md +4 -3
  106. package/docs/ja/mcp_server.md +29 -16
  107. package/docs/ja/plugins/sync-po.md +333 -0
  108. package/docs/ko/benchmark/nextjs.md +15 -6
  109. package/docs/ko/benchmark/solid.md +155 -0
  110. package/docs/ko/benchmark/svelte.md +148 -0
  111. package/docs/ko/benchmark/tanstack.md +12 -3
  112. package/docs/ko/benchmark/vue.md +160 -0
  113. package/docs/ko/configuration.md +16 -12
  114. package/docs/ko/dictionary/content_file.md +51 -1
  115. package/docs/ko/intlayer_with_nextjs_no_locale_path.md +3 -2
  116. package/docs/ko/mcp_server.md +31 -18
  117. package/docs/ko/plugins/sync-po.md +333 -0
  118. package/docs/nl/configuration.md +16 -12
  119. package/docs/pl/benchmark/index.md +0 -3
  120. package/docs/pl/benchmark/nextjs.md +15 -6
  121. package/docs/pl/benchmark/solid.md +155 -0
  122. package/docs/pl/benchmark/svelte.md +148 -0
  123. package/docs/pl/benchmark/tanstack.md +12 -3
  124. package/docs/pl/benchmark/vue.md +160 -0
  125. package/docs/pl/configuration.md +16 -12
  126. package/docs/pl/dictionary/content_file.md +51 -1
  127. package/docs/pl/mcp_server.md +30 -17
  128. package/docs/pl/plugins/sync-po.md +333 -0
  129. package/docs/pt/benchmark/index.md +0 -3
  130. package/docs/pt/benchmark/nextjs.md +16 -7
  131. package/docs/pt/benchmark/solid.md +155 -0
  132. package/docs/pt/benchmark/svelte.md +148 -0
  133. package/docs/pt/benchmark/tanstack.md +13 -4
  134. package/docs/pt/benchmark/vue.md +160 -0
  135. package/docs/pt/configuration.md +16 -12
  136. package/docs/pt/dictionary/content_file.md +51 -1
  137. package/docs/pt/mcp_server.md +30 -17
  138. package/docs/pt/plugins/sync-po.md +333 -0
  139. package/docs/ru/benchmark/nextjs.md +15 -6
  140. package/docs/ru/benchmark/solid.md +155 -0
  141. package/docs/ru/benchmark/svelte.md +148 -0
  142. package/docs/ru/benchmark/tanstack.md +12 -3
  143. package/docs/ru/benchmark/vue.md +160 -0
  144. package/docs/ru/configuration.md +16 -12
  145. package/docs/ru/dictionary/content_file.md +52 -2
  146. package/docs/ru/mcp_server.md +30 -17
  147. package/docs/ru/plugins/sync-po.md +333 -0
  148. package/docs/tr/benchmark/index.md +0 -3
  149. package/docs/tr/benchmark/nextjs.md +15 -6
  150. package/docs/tr/benchmark/solid.md +155 -0
  151. package/docs/tr/benchmark/svelte.md +148 -0
  152. package/docs/tr/benchmark/tanstack.md +12 -3
  153. package/docs/tr/benchmark/vue.md +160 -0
  154. package/docs/tr/configuration.md +16 -12
  155. package/docs/tr/dictionary/content_file.md +51 -1
  156. package/docs/tr/mcp_server.md +31 -18
  157. package/docs/tr/plugins/sync-po.md +333 -0
  158. package/docs/uk/benchmark/nextjs.md +15 -6
  159. package/docs/uk/benchmark/solid.md +155 -0
  160. package/docs/uk/benchmark/svelte.md +148 -0
  161. package/docs/uk/benchmark/tanstack.md +12 -3
  162. package/docs/uk/benchmark/vue.md +160 -0
  163. package/docs/uk/configuration.md +16 -12
  164. package/docs/uk/dictionary/content_file.md +51 -1
  165. package/docs/uk/mcp_server.md +29 -16
  166. package/docs/uk/plugins/sync-po.md +333 -0
  167. package/docs/ur/configuration.md +16 -12
  168. package/docs/vi/benchmark/index.md +0 -3
  169. package/docs/vi/benchmark/nextjs.md +15 -6
  170. package/docs/vi/benchmark/solid.md +155 -0
  171. package/docs/vi/benchmark/svelte.md +148 -0
  172. package/docs/vi/benchmark/tanstack.md +12 -3
  173. package/docs/vi/benchmark/vue.md +160 -0
  174. package/docs/vi/configuration.md +16 -12
  175. package/docs/vi/dictionary/content_file.md +51 -1
  176. package/docs/vi/intlayer_with_nextjs_15.md +10 -57
  177. package/docs/vi/mcp_server.md +30 -17
  178. package/docs/vi/plugins/sync-po.md +333 -0
  179. package/docs/zh/benchmark/nextjs.md +15 -6
  180. package/docs/zh/benchmark/solid.md +155 -0
  181. package/docs/zh/benchmark/svelte.md +148 -0
  182. package/docs/zh/benchmark/tanstack.md +12 -3
  183. package/docs/zh/benchmark/vue.md +160 -0
  184. package/docs/zh/configuration.md +16 -12
  185. package/docs/zh/dictionary/content_file.md +51 -3
  186. package/docs/zh/mcp_server.md +31 -18
  187. package/docs/zh/plugins/sync-po.md +333 -0
  188. package/frequent_questions/ar/intlayerNode.md +3 -3
  189. package/frequent_questions/de/intlayerNode.md +3 -3
  190. package/frequent_questions/en/intlayerNode.md +3 -3
  191. package/frequent_questions/en-GB/intlayerNode.md +3 -3
  192. package/frequent_questions/es/intlayerNode.md +3 -3
  193. package/frequent_questions/fr/intlayerNode.md +3 -3
  194. package/frequent_questions/hi/intlayerNode.md +3 -3
  195. package/frequent_questions/id/intlayerNode.md +3 -3
  196. package/frequent_questions/it/intlayerNode.md +3 -3
  197. package/frequent_questions/ja/intlayerNode.md +3 -3
  198. package/frequent_questions/ko/intlayerNode.md +3 -3
  199. package/frequent_questions/pl/intlayerNode.md +3 -3
  200. package/frequent_questions/pt/intlayerNode.md +3 -3
  201. package/frequent_questions/ru/intlayerNode.md +3 -3
  202. package/frequent_questions/tr/intlayerNode.md +3 -3
  203. package/frequent_questions/uk/intlayerNode.md +3 -3
  204. package/frequent_questions/vi/intlayerNode.md +3 -3
  205. package/frequent_questions/zh/intlayerNode.md +3 -3
  206. package/package.json +8 -8
  207. package/src/generated/docs.entry.ts +20 -0
@@ -0,0 +1,155 @@
1
+ ---
2
+ createdAt: 2026-04-20
3
+ updatedAt: 2026-04-21
4
+ title: Najlepsze rozwiązanie i18n dla Solid w 2026 r. — raport z benchmarku
5
+ description: Porównaj biblioteki internacjonalizacji (i18n) dla Solid, takie jak solid-primitives, solid-i18next i Intlayer. Szczegółowy raport wydajności dotyczący rozmiaru paczki, wycieków i reaktywności.
6
+ keywords:
7
+ - benchmark
8
+ - i18n
9
+ - intl
10
+ - solid
11
+ - wydajność
12
+ - intlayer
13
+ slugs:
14
+ - doc
15
+ - benchmark
16
+ - solid
17
+ author: Aymeric PINEAU
18
+ applicationTemplate: https://github.com/intlayer-org/benchmark-i18n-solid-template
19
+ history:
20
+ - version: 8.7.12
21
+ date: 2026-01-06
22
+ changes: "Inicjalizacja benchmarku"
23
+ ---
24
+
25
+ # Biblioteki i18n dla Solid — raport z benchmarku 2026
26
+
27
+ Ta strona zawiera raport z benchmarku rozwiązań i18n dla Solid.
28
+
29
+ ## Spis treści
30
+
31
+ <Toc/>
32
+
33
+ ## Interaktywny benchmark
34
+
35
+ <I18nBenchmark framework="vite-solid" vertical/>
36
+
37
+ ## Referencja wyników:
38
+
39
+ <iframe
40
+ src="https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_solid.md"
41
+ width="100%"
42
+ height="600px"
43
+ style="border:none;">
44
+ </iframe>
45
+
46
+ > https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_solid.md
47
+
48
+ Pełne repozytorium benchmarku znajdziesz [tutaj](https://github.com/intlayer-org/benchmark-i18n/tree/main).
49
+
50
+ ## Wstęp
51
+
52
+ Rozwiązania do internacjonalizacji należą do najcięższych zależności w aplikacji Solid. Głównym ryzykiem jest wysyłanie niepotrzebnych treści: tłumaczeń dla innych stron i innych lokalizacji w paczce (bundle) pojedynczej trasy.
53
+
54
+ W miarę rozwoju aplikacji problem ten może szybko zwiększyć ilość JavaScriptu wysyłanego do klienta i spowolnić nawigację.
55
+
56
+ W praktyce, w przypadku najmniej zoptymalizowanych implementacji, strona zinternacjonalizowana może okazać się kilkukrotnie cięższa niż wersja bez i18n.
57
+
58
+ Innym skutkiem jest wpływ na doświadczenie programisty (DX): sposób deklarowania treści, typy, organizacja przestrzeni nazw (namespaces), dynamiczne ładowanie i reaktywność przy zmianie lokalizacji.
59
+
60
+ ## TL;DR
61
+
62
+ - **Intlayer**: Zalecany wybór dla profesjonalnych aplikacji Solid wymagających zaawansowanych funkcji i optymalizacji (v8.7.12).
63
+ - **@solid-primitives/i18n**: Doskonała lekka alternatywa dla prostych projektów, choć brakuje jej zaawansowanych funkcji, takich jak lazy loading.
64
+ - **solid-i18next**: Standardowa, ale ciężka opcja (~4.7x Intlayer) z tymi samymi wadami co React i18next.
65
+ - **Paraglide**: Innowacyjne podejście, ale złożone DX i problemy z tree-shakingiem w niektórych konfiguracjach.
66
+
67
+ ## Przetestuj swoją aplikację
68
+
69
+ Aby szybko wykryć problemy z wyciekami i18n, przygotowałem darmowy skaner dostępny [tutaj](https://intlayer.org/i18n-seo-scanner).
70
+
71
+ <iframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
72
+
73
+ ## Problem
74
+
75
+ Dwa dźwignie są kluczowe dla ograniczenia kosztów aplikacji wielojęzycznej:
76
+
77
+ - Dzielenie treści według stron / przestrzeni nazw, aby nie ładować całych słowników, gdy nie są potrzebne.
78
+ - Dynamiczne ładowanie odpowiedniej lokalizacji tylko wtedy, gdy jest potrzebna.
79
+
80
+ Zrozumienie technicznych ograniczeń tych podejść:
81
+
82
+ **Dynamiczne ładowanie**
83
+
84
+ Bez dynamicznego ładowania większość rozwiązań przechowuje komunikaty w pamięci od pierwszego renderowania, co dodaje znaczny narzut w przypadku aplikacji z wieloma trasami i lokalizacjami.
85
+
86
+ Dzięki dynamicznemu ładowaniu akceptujesz kompromis: mniej początkowego JS, ale czasami dodatkowe zapytanie przy zmianie języka.
87
+
88
+ **Dzielenie treści (Splitting)**
89
+
90
+ Składnie zbudowane wokół `t('a.b.c')` są bardzo wygodne, ale często zachęcają do utrzymywania dużych obiektów JSON w czasie wykonywania. Ten model utrudnia tree-shaking, chyba że biblioteka oferuje rzeczywistą strategię dzielenia na poszczególne strony.
91
+
92
+ ## Metodologia badań
93
+
94
+ W tym benchmarku porównaliśmy następujące biblioteki:
95
+
96
+ - `Base App` (Brak biblioteki i18n)
97
+ - `solid-intlayer` (v8.7.12)
98
+ - `@solid-primitives/i18n` (v2.2.1)
99
+ - `solid-i18next` (v17.0.2)
100
+ - `@inlang/paraglide-js` (v2.17.0)
101
+
102
+ Framework to `Solid` z aplikacją wielojęzyczną składającą się z **10 stron** i **10 języków**.
103
+
104
+ Porównaliśmy **cztery strategie ładowania**:
105
+
106
+ | Strategia | Brak przestrzeni nazw (globalna) | Z przestrzeniami nazw (scoped) |
107
+ | :----------------------- | :------------------------------------------------ | :------------------------------------------------------------------------------- |
108
+ | **Ładowanie statyczne** | **Static**: Wszystko w pamięci przy starcie. | **Scoped static**: Podział na przestrzenie nazw; wszystko ładowane przy starcie. |
109
+ | **Ładowanie dynamiczne** | **Dynamic**: Ładowanie na żądanie na lokalizację. | **Scoped dynamic**: Szczegółowe ładowanie na przestrzeń nazw i lokalizację. |
110
+
111
+ ## Podsumowanie strategii
112
+
113
+ - **Static**: Proste; brak opóźnień sieciowych po początkowym załadowaniu. Minus: duży rozmiar paczki.
114
+ - **Dynamic**: Zmniejsza początkową wagę (lazy-loading). Idealne, gdy masz wiele lokalizacji.
115
+ - **Scoped static**: Utrzymuje porządek w kodzie (logiczna separacja) bez skomplikowanych dodatkowych zapytań sieciowych.
116
+ - **Scoped dynamic**: Najlepsze podejście dla _code splittingu_ i wydajności. Minimalizuje zużycie pamięci, ładując tylko to, czego potrzebuje bieżący widok i aktywna lokalizacja.
117
+
118
+ ## Wyniki szczegółowe
119
+
120
+ ### 1 — Rozwiązania, których należy unikać
121
+
122
+ > W ekosystemie Solid nie ma jednoznacznego rozwiązania, którego należy unikać.
123
+
124
+ ### 2 — Rozwiązania akceptowalne
125
+
126
+ **(solid-i18next)** (`solid-i18next@17.0.2`):
127
+
128
+ `solid-i18next` jest prawdopodobnie najpopularniejszą opcją, ponieważ był jednym z pierwszych rozwiązań zaspokajających potrzeby i18n aplikacji JavaScript. Posiada również szeroki zestaw wtyczek społecznościowych dla konkretnych problemów.
129
+
130
+ Paczka jest ciężka (~14.6kb, co stanowi około 4.7x `solid-intlayer`).
131
+
132
+ Mimo to dzieli te same główne wady co stosy technologiczne zbudowane na `t('a.b.c')`: optymalizacje są możliwe, ale bardzo czasochłonne, a duże projekty niosą ze sobą ryzyko złych praktyk (przestrzenie nazw + dynamiczne ładowanie + typy).
133
+
134
+ **(@solid-primitives/i18n)** (`@solid-primitives/i18n@2.2.1`):
135
+
136
+ Solid primitive jest niezwykle lekki i wydajny. Polecam to rozwiązanie dla lekkich projektów, ale może w nim szybko zabraknąć funkcji dla profesjonalnych rozwiązań, w tym zarządzania plikami cookie, przekierowań proxy, formaterów itp.
137
+ Brakuje mu również lazy loadingu i scopingu przestrzeni nazw w celu optymalizacji rozmiaru strony.
138
+
139
+ **(Paraglide)** (`@inlang/paraglide-js@2.17.0`):
140
+
141
+ `Paraglide` oferuje innowacyjne, przemyślane podejście. Mimo to w tym benchmarku reklamowany przez nich tree-shaking nie zadziałał w mojej implementacji. Workflow i DX są również bardziej złożone niż w przypadku innych opcji.
142
+ Osobiście nie lubię konieczności regeneracji plików JS przed każdym pushem, co stwarza ciągłe ryzyko konfliktów przy mergowaniu poprzez PR-y.
143
+ Wreszcie, w porównaniu z innymi rozwiązaniami, Paraglide nie używa store'a (np. Solid signal) do pobierania aktualnej lokalizacji w celu renderowania treści. Dla każdego sparsowanego węzła będzie żądać lokalizacji z localStorage / cookie itp. Prowadzi to do wykonywania niepotrzebnej logiki, która wpływa na reaktywność komponentu.
144
+
145
+ ### 3 — Rekomendacje
146
+
147
+ **(Intlayer)** (`solid-intlayer@8.7.12`):
148
+
149
+ Nie będę osobiście oceniać `solid-intlayer` ze względu na obiektywizm, ponieważ jest to moje własne rozwiązanie.
150
+
151
+ ### Notatka osobista
152
+
153
+ Ta notatka jest osobista i nie wpływa na wyniki benchmarku. Mimo to w świecie i18n często widać konsensus wokół wzorca takiego jak `const t = useTranslation('xx')` + `<>{t('xx.xx')}</>` dla treści przetłumaczonych.
154
+
155
+ W aplikacjach Solid wstrzykiwanie funkcji jako `JSX.Element` jest moim zdaniem antywzorcem. Dodaje to również złożoność, której można uniknąć, oraz narzut na wykonywanie JavaScriptu (nawet jeśli jest on ledwo zauważalny).
@@ -0,0 +1,148 @@
1
+ ---
2
+ createdAt: 2026-04-20
3
+ updatedAt: 2026-04-21
4
+ title: Najlepsze rozwiązanie i18n dla Svelte w 2026 r. — raport z benchmarku
5
+ description: Porównaj biblioteki internacjonalizacji (i18n) dla Svelte, takie jak svelte-i18n, Paraglide i Intlayer. Szczegółowy raport wydajności dotyczący rozmiaru paczki, wycieków i reaktywności.
6
+ keywords:
7
+ - benchmark
8
+ - i18n
9
+ - intl
10
+ - svelte
11
+ - wydajność
12
+ - intlayer
13
+ slugs:
14
+ - doc
15
+ - benchmark
16
+ - svelte
17
+ author: Aymeric PINEAU
18
+ applicationTemplate: https://github.com/intlayer-org/benchmark-i18n-svelte-template
19
+ history:
20
+ - version: 8.7.12
21
+ date: 2026-01-06
22
+ changes: "Inicjalizacja benchmarku"
23
+ ---
24
+
25
+ # Biblioteki i18n dla Svelte — raport z benchmarku 2026
26
+
27
+ Ta strona zawiera raport z benchmarku rozwiązań i18n dla Svelte.
28
+
29
+ ## Spis treści
30
+
31
+ <Toc/>
32
+
33
+ ## Interaktywny benchmark
34
+
35
+ <I18nBenchmark framework="vite-svelte" vertical/>
36
+
37
+ ## Referencja wyników:
38
+
39
+ <iframe
40
+ src="https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_svelte.md"
41
+ width="100%"
42
+ height="600px"
43
+ style="border:none;">
44
+ </iframe>
45
+
46
+ > https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_svelte.md
47
+
48
+ Pełne repozytorium benchmarku znajdziesz [tutaj](https://github.com/intlayer-org/benchmark-i18n/tree/main).
49
+
50
+ ## Wstęp
51
+
52
+ Rozwiązania do internacjonalizacji należą do najcięższych zależności w aplikacji Svelte. Głównym ryzykiem jest wysyłanie niepotrzebnych treści: tłumaczeń dla innych stron i innych lokalizacji w paczce (bundle) pojedynczej trasy.
53
+
54
+ W miarę rozwoju aplikacji problem ten może szybko zwiększyć ilość JavaScriptu wysyłanego do klienta i spowolnić nawigację.
55
+
56
+ W praktyce, w przypadku najmniej zoptymalizowanych implementacji, strona zinternacjonalizowana może okazać się kilkukrotnie cięższa niż wersja bez i18n.
57
+
58
+ Innym skutkiem jest wpływ na doświadczenie programisty (DX): sposób deklarowania treści, typy, organizacja przestrzeni nazw (namespaces), dynamiczne ładowanie i reaktywność przy zmianie lokalizacji.
59
+
60
+ ## TL;DR
61
+
62
+ - **Intlayer**: Najbardziej wydajny wybór (v8.7.12) z najmniejszym śladem (footprint).
63
+ - **Paraglide**: Mocny kandydat pod kątem tree-shakingu, ale oferuje bardziej złożone doświadczenie programisty i narzut reaktywności.
64
+ - **svelte-i18n**: Kompleksowy i standardowy dla Svelte, ale wiąże się ze znacznie większą wagą paczki (~7x Intlayer).
65
+
66
+ ## Przetestuj swoją aplikację
67
+
68
+ Aby szybko wykryć problemy z wyciekami i18n, przygotowałem darmowy skaner dostępny [tutaj](https://intlayer.org/i18n-seo-scanner).
69
+
70
+ <iframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
71
+
72
+ ## Problem
73
+
74
+ Dwa dźwignie są kluczowe dla ograniczenia kosztów aplikacji wielojęzycznej:
75
+
76
+ - Dzielenie treści według stron / przestrzeni nazw, aby nie ładować całych słowników, gdy nie są potrzebne.
77
+ - Dynamiczne ładowanie odpowiedniej lokalizacji tylko wtedy, gdy jest potrzebna.
78
+
79
+ Zrozumienie technicznych ograniczeń tych podejść:
80
+
81
+ **Dynamiczne ładowanie**
82
+
83
+ Bez dynamicznego ładowania większość rozwiązań przechowuje komunikaty w pamięci od pierwszego renderowania, co dodaje znaczny narzut w przypadku aplikacji z wieloma trasami i lokalizacjami.
84
+
85
+ Dzięki dynamicznemu ładowaniu akceptujesz kompromis: mniej początkowego JS, ale czasami dodatkowe zapytanie przy zmianie języka.
86
+
87
+ **Dzielenie treści (Splitting)**
88
+
89
+ Składnie zbudowane wokół `t('a.b.c')` są bardzo wygodne, ale często zachęcają do utrzymywania dużych obiektów JSON w czasie wykonywania. Ten model utrudnia tree-shaking, chyba że biblioteka oferuje rzeczywistą strategię dzielenia na poszczególne strony.
90
+
91
+ ## Metodologia badań
92
+
93
+ W tym benchmarku porównaliśmy następujące biblioteki:
94
+
95
+ - `Base App` (Brak biblioteki i18n)
96
+ - `svelte-intlayer` (v8.7.12)
97
+ - `svelte-i18n` (v4.0.1)
98
+ - `@inlang/paraglide-js` (v2.17.0)
99
+
100
+ Framework to `Svelte` z aplikacją wielojęzyczną składającą się z **10 stron** i **10 języków**.
101
+
102
+ Porównaliśmy **cztery strategie ładowania**:
103
+
104
+ | Strategia | Brak przestrzeni nazw (globalna) | Z przestrzeniami nazw (scoped) |
105
+ | :----------------------- | :------------------------------------------------ | :------------------------------------------------------------------------------- |
106
+ | **Ładowanie statyczne** | **Static**: Wszystko w pamięci przy starcie. | **Scoped static**: Podział na przestrzenie nazw; wszystko ładowane przy starcie. |
107
+ | **Ładowanie dynamiczne** | **Dynamic**: Ładowanie na żądanie na lokalizację. | **Scoped dynamic**: Szczegółowe ładowanie na przestrzeń nazw i lokalizację. |
108
+
109
+ ## Podsumowanie strategii
110
+
111
+ - **Static**: Proste; brak opóźnień sieciowych po początkowym załadowaniu. Minus: duży rozmiar paczki.
112
+ - **Dynamic**: Zmniejsza początkową wagę (lazy-loading). Idealne, gdy masz wiele lokalizacji.
113
+ - **Scoped static**: Utrzymuje porządek w kodzie (logiczna separacja) bez skomplikowanych dodatkowych zapytań sieciowych.
114
+ - **Scoped dynamic**: Najlepsze podejście dla _code splittingu_ i wydajności. Minimalizuje zużycie pamięci, ładując tylko to, czego potrzebuje bieżący widok i aktywna lokalizacja.
115
+
116
+ ## Wyniki szczegółowe
117
+
118
+ ### 1 — Rozwiązania, których należy unikać
119
+
120
+ > W ekosystemie Svelte nie ma jednoznacznego rozwiązania, którego należy unikać.
121
+
122
+ ### 2 — Rozwiązania akceptowalne
123
+
124
+ **(Paraglide)** (`@inlang/paraglide-js@2.17.0`):
125
+
126
+ `Paraglide` oferuje innowacyjne, przemyślane podejście. W kontekście aplikacji Vite + Svelte reklamowany przez nich tree-shaking działał zgodnie z oczekiwaniami, co jest świetne.
127
+ Ale w przypadku React + TanStack Start tree-shaking nie działał zgodnie z oczekiwaniami, podobnie w Next.js. To powiedziawszy, użycie Paraglide w projekcie Svelte i TanStack Start byłoby warte ponownego sprawdzenia.
128
+ Workflow i DX są również bardziej złożone niż w przypadku innych opcji.
129
+ Osobiście nie jestem fanem konieczności regeneracji plików JS przed każdym pushem, co stwarza ciągłe ryzyko konfliktów przy mergowaniu poprzez PR-y. Narzędzie wydaje się również bardziej skoncentrowane na Vite niż na Next.js.
130
+ Wreszcie, w porównaniu z innymi rozwiązaniami, Paraglide nie używa store'a (np. Svelte store) do pobierania aktualnej lokalizacji w celu renderowania treści. Dla każdego sparsowanego węzła będzie żądać lokalizacji z localStorage / cookie itp. Prowadzi to do wykonywania niepotrzebnej logiki, która wpływa na reaktywność komponentu.
131
+
132
+ > Uwaga na temat paraglide: rozwiązanie to wstrzykuje kod do Twojej bazy kodu w celu importu; w rezultacie metryka „lib size” w raporcie z benchmarku wynosi prawie 0. Generowanie kodu jest dobrą rzeczą, ponieważ użyta funkcja będzie zawierać tylko niezbędną logikę (prefiks wszędzie vs brak prefiksu, cookie vs storage itp.). Dla porównania, Intlayer wykonuje to filtrowanie poprzez wstrzykiwanie zmiennych środowiskowych podczas budowania, aby wymusić na bundlerze tree-shaking treści w zależności od logiki. Dzięki temu paraglide i intlayer okazują się być od 6 do 10 razy lżejszymi rozwiązaniami niż i18next czy next-intl.
133
+
134
+ **(svelte-i18n)** (`svelte-i18n@3.4.0`):
135
+
136
+ To rozwiązanie odpowiada na wszystkie potrzeby i18n w projekcie Svelte. Ale podobnie jak w przypadku i18next lub innych głównych rozwiązań i18n, jest ono nieco ciężkie (~15.9kb, co stanowi około 7x `svelte-intlayer`).
137
+
138
+ ### 3 — Rekomendacje
139
+
140
+ **(Intlayer)** (`svelte-intlayer@8.7.12`):
141
+
142
+ Nie będę osobiście oceniać `svelte-intlayer` ze względu na obiektywizm, ponieważ jest to moje własne rozwiązanie.
143
+
144
+ ### Notatka osobista
145
+
146
+ Ta notatka jest osobista i nie wpływa na wyniki benchmarku. Mimo to w świecie i18n często widać konsensus wokół wzorca takiego jak `const t = useTranslation('xx')` + `<>{t('xx.xx')}</>` dla treści przetłumaczonych.
147
+
148
+ W aplikacjach Svelte wstrzykiwanie funkcji jako `Slot` jest moim zdaniem antywzorcem. Dodaje to również złożoność, której można uniknąć, oraz narzut na wykonywanie JavaScriptu (nawet jeśli jest on ledwo zauważalny).
@@ -57,6 +57,13 @@ W praktyce, w przypadku najmniej zoptymalizowanych implementacji, strona zintern
57
57
 
58
58
  Inny wpływ dotyczy doświadczenia programisty (DX): sposobu deklarowania treści, typów, organizacji przestrzeni nazw, ładowania dynamicznego i reaktywności przy zmianie lokalizacji.
59
59
 
60
+ ## TL;DR
61
+
62
+ - **Intlayer**: Zapewnia najlepszą wydajność i najmniejszy rozmiar pakietu (v8.7.12) dla TanStack Start.
63
+ - **react-i18next** & **use-intl**: Dojrzałe alternatywy z dużymi ekosystemami, ale znacznie cięższe i bardziej złożone w optymalizacji.
64
+ - **Paraglide**: Innowacyjny pomysł na tree-shaking, który nie działa w praktyce. Skomplikowane DX i narzut reaktywności w TanStack Start.
65
+ - **Unikaj**: **General Translation (GT)** i **Lingo.dev** ze względu na poważne problemy z wydajnością, limity AI i uzależnienie od dostawcy (vendor lock-in).
66
+
60
67
  ## Przetestuj swoją aplikację
61
68
 
62
69
  Aby szybko wykryć problemy z wyciekami i18n, przygotowałem darmowy skaner dostępny [tutaj](https://intlayer.org/i18n-seo-scanner).
@@ -87,12 +94,12 @@ Składnie oparte na `const t = useTranslation()` + `t('a.b.c')` są bardzo wygod
87
94
  W tym benchmarku porównaliśmy następujące biblioteki:
88
95
 
89
96
  - `Base App` (Brak biblioteki i18n)
90
- - `react-intlayer` (v8.7.5-canary.0)
97
+ - `react-intlayer` (v8.7.12)
91
98
  - `react-i18next` (v17.0.2)
92
99
  - `use-intl` (v4.9.1)
93
100
  - `@lingui/core` (v5.3.0)
94
101
  - `@inlang/paraglide-js` (v2.15.1)
95
- - `tolgee` (v7.0.0)
102
+ - `@tolgee/react` (v7.0.0)
96
103
  - `react-intl` (v10.1.1)
97
104
  - `wuchale` (v0.22.11)
98
105
  - `gt-react` (vlatest)
@@ -150,7 +157,9 @@ Idea stojąca za `Wuchale` jest interesująca, ale nie jest to jeszcze opłacaln
150
157
 
151
158
  `Paraglide` oferuje innowacyjne i przemyślane podejście. Mimo to w tym benchmarku reklamowany przez firmę tree-shaking nie zadziałał w mojej implementacji Next.js ani w TanStack Start. Przepływ pracy i DX są również bardziej złożone niż w przypadku innych opcji. Osobiście nie jestem fanem konieczności regenerowania plików JS przed każdym przesłaniem kodu (push), co stwarza ciągłe ryzyko konfliktów scalania dla programistów przy Pull Requestach.
152
159
 
153
- **(Tolgee)** (`tolgee@7.0.0`):
160
+ > Uwaga dotycząca paraglide: to rozwiązanie wstrzykuje kod do bazy kodu dla importów, w wyniku czego metryka 'lib size' w raporcie benchmarku wynosi prawie 0. Generowanie kodu jest dobre, ponieważ użyta funkcja będzie zawierać tylko niezbędną logikę (prefiks wszędzie vs brak prefiksu, cookie vs pamięć itp.). Dla porównania, Intlayer wykonuje to filtrowanie poprzez wstrzykiwanie zmiennych środowiskowych w procesie budowania, aby wymusić na bundlerze tree-shaking zawartości w zależności od logiki. Dzięki temu paraglide i intlayer są ostatecznie od 6 do 10 razy lżejszymi rozwiązaniami niż i18next czy next-intl.
161
+
162
+ **(Tolgee)** (`@tolgee/react@7.0.0`):
154
163
 
155
164
  `Tolgee` rozwiązuje wiele z wymienionych wcześniej problemów. Uznałem jednak, że trudniej z nim zacząć niż z innymi narzędziami o podobnym podejściu. Nie zapewnia on bezpieczeństwa typów, co sprawia, że bardzo trudno jest wyłapać brakujące klucze w czasie kompilacji. Musiałem opakować API Tolgee we własne API, aby dodać wykrywanie brakujących kluczy.
156
165
 
@@ -0,0 +1,160 @@
1
+ ---
2
+ createdAt: 2026-04-20
3
+ updatedAt: 2026-04-21
4
+ title: Najlepsze rozwiązanie i18n dla Vue w 2026 r. — raport z benchmarku
5
+ description: Porównaj biblioteki internacjonalizacji (i18n) dla Vue, takie jak vue-i18n, fluent-vue i Intlayer. Szczegółowy raport wydajności dotyczący rozmiaru paczki, wycieków i reaktywności.
6
+ keywords:
7
+ - benchmark
8
+ - i18n
9
+ - intl
10
+ - vue
11
+ - wydajność
12
+ - intlayer
13
+ slugs:
14
+ - doc
15
+ - benchmark
16
+ - vue
17
+ author: Aymeric PINEAU
18
+ applicationTemplate: https://github.com/intlayer-org/benchmark-i18n-vue-template
19
+ history:
20
+ - version: 8.7.12
21
+ date: 2026-01-06
22
+ changes: "Inicjalizacja benchmarku"
23
+ ---
24
+
25
+ # Biblioteki i18n dla Vue — raport z benchmarku 2026
26
+
27
+ Ta strona zawiera raport z benchmarku rozwiązań i18n dla Vue.
28
+
29
+ ## Spis treści
30
+
31
+ <Toc/>
32
+
33
+ ## Interaktywny benchmark
34
+
35
+ <I18nBenchmark framework="vite-vue" vertical/>
36
+
37
+ ## Referencja wyników:
38
+
39
+ <iframe
40
+ src="https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_vue.md"
41
+ width="100%"
42
+ height="600px"
43
+ style="border:none;">
44
+ </iframe>
45
+
46
+ > https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_vue.md
47
+
48
+ Pełne repozytorium benchmarku znajdziesz [tutaj](https://github.com/intlayer-org/benchmark-i18n/tree/main).
49
+
50
+ ## Wstęp
51
+
52
+ Rozwiązania do internacjonalizacji należą do najcięższych zależności w aplikacji Vue. Głównym ryzykiem jest wysyłanie niepotrzebnych treści: tłumaczeń dla innych stron i innych lokalizacji w paczce (bundle) pojedynczej trasy.
53
+
54
+ W miarę rozwoju aplikacji problem ten może szybko zwiększyć ilość JavaScriptu wysyłanego do klienta i spowolnić nawigację.
55
+
56
+ W praktyce, w przypadku najmniej zoptymalizowanych implementacji, strona zinternacjonalizowana może okazać się kilkukrotnie cięższa niż wersja bez i18n.
57
+
58
+ Innym skutkiem jest wpływ na doświadczenie programisty (DX): sposób deklarowania treści, typy, organizacja przestrzeni nazw (namespaces), dynamiczne ładowanie i reaktywność przy zmianie lokalizacji.
59
+
60
+ ## TL;DR
61
+
62
+ - **Intlayer**: Najlżejsze rozwiązanie (v8.7.12) z natywnym scopingiem i dynamicznym ładowaniem.
63
+ - **vue-i18n**: Standard branżowy z bogatym ekosystemem, ale może być znacznie cięższy i trudniejszy do optymalizacji pod kątem code-splittingu w dużych aplikacjach.
64
+ - **fluent-vue**: Innowacyjna organizacja komunikatów, ale brakuje jej bezpieczeństwa typów (type-safety) i okazuje się być ekstremalnie ciężkim rozwiązaniem.
65
+
66
+ ## Przetestuj swoją aplikację
67
+
68
+ Aby szybko wykryć problemy z wyciekami i18n, przygotowałem darmowy skaner dostępny [tutaj](https://intlayer.org/i18n-seo-scanner).
69
+
70
+ <iframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
71
+
72
+ ## Problem
73
+
74
+ Dwa dźwignie są kluczowe dla ograniczenia kosztów aplikacji wielojęzycznej:
75
+
76
+ - Dzielenie treści według stron / przestrzeni nazw, aby nie ładować całych słowników, gdy nie są potrzebne.
77
+ - Dynamiczne ładowanie odpowiedniej lokalizacji tylko wtedy, gdy jest potrzebna.
78
+
79
+ Zrozumienie technicznych ograniczeń tych podejść:
80
+
81
+ **Dynamiczne ładowanie**
82
+
83
+ Bez dynamicznego ładowania większość rozwiązań przechowuje komunikaty w pamięci od pierwszego renderowania, co dodaje znaczny narzut w przypadku aplikacji z wieloma trasami i lokalizacjami.
84
+
85
+ Dzięki dynamicznemu ładowaniu akceptujesz kompromis: mniej początkowego JS, ale czasami dodatkowe zapytanie przy zmianie języka.
86
+
87
+ **Dzielenie treści (Splitting)**
88
+
89
+ Składnie zbudowane wokół `const { t } = useI18n()` + `t('a.b.c')` są bardzo wygodne, ale często zachęcają do utrzymywania dużych obiektów JSON w czasie wykonywania. Ten model utrudnia tree-shaking, chyba że biblioteka oferuje rzeczywistą strategię dzielenia na poszczególne strony.
90
+
91
+ ## Metodologia badań
92
+
93
+ W tym benchmarku porównaliśmy następujące biblioteki:
94
+
95
+ - `Base App` (Brak biblioteki i18n)
96
+ - `vue-intlayer` (v8.7.12)
97
+ - `vue-i18n` (v11.4.0)
98
+ - `fluent-vue` (v3.8.2)
99
+
100
+ Framework to `Vue` z aplikacją wielojęzyczną składającą się z **10 stron** i **10 języków**.
101
+
102
+ Porównaliśmy **cztery strategie ładowania**:
103
+
104
+ | Strategia | Brak przestrzeni nazw (globalna) | Z przestrzeniami nazw (scoped) |
105
+ | :----------------------- | :------------------------------------------------ | :------------------------------------------------------------------------------- |
106
+ | **Ładowanie statyczne** | **Static**: Wszystko w pamięci przy starcie. | **Scoped static**: Podział na przestrzenie nazw; wszystko ładowane przy starcie. |
107
+ | **Ładowanie dynamiczne** | **Dynamic**: Ładowanie na żądanie na lokalizację. | **Scoped dynamic**: Szczegółowe ładowanie na przestrzeń nazw i lokalizację. |
108
+
109
+ ## Podsumowanie strategii
110
+
111
+ - **Static**: Proste; brak opóźnień sieciowych po początkowym załadowaniu. Minus: duży rozmiar paczki.
112
+ - **Dynamic**: Zmniejsza początkową wagę (lazy-loading). Idealne, gdy masz wiele lokalizacji.
113
+ - **Scoped static**: Utrzymuje porządek w kodzie (logiczna separacja) bez skomplikowanych dodatkowych zapytań sieciowych.
114
+ - **Scoped dynamic**: Najlepsze podejście dla _code splittingu_ i wydajności. Minimalizuje zużycie pamięci, ładując tylko to, czego potrzebuje bieżący widok i aktywna lokalizacja.
115
+
116
+ ### Co mierzyłem:
117
+
118
+ Uruchomiłem tę samą wielojęzyczną aplikację w prawdziwej przeglądarce dla każdego stosu technologicznego, a następnie zanotowałem, co faktycznie przesłała sieć i ile czasu zajęły poszczególne operacje. Rozmiary są podawane **po normalnej kompresji internetowej**, ponieważ jest to bliższe temu, co ludzie faktycznie pobierają, niż surowa liczba linii kodu źródłowego.
119
+
120
+ - **Rozmiar biblioteki internacjonalizacji**: Po spakowaniu (bundling), tree-shakingu i minifikacji, rozmiar biblioteki i18n to rozmiar kodu providerów + composables w pustym komponencie. Nie obejmuje ładowania plików tłumaczeń. Odpowiada na pytanie, jak „droga” jest biblioteka, zanim Twoja treść wejdzie do gry.
121
+
122
+ - **JavaScript na stronę**: Dla każdej trasy benchmarku, ile skryptów przeglądarka pobiera dla tej wizyty, uśrednione dla stron w zestawie (i dla lokalizacji). Ciężkie strony to wolne strony.
123
+
124
+ - **Wycieki z innych lokalizacji (Leakage)**: To treść tej samej strony, ale w innym języku, która zostałaby błędnie załadowana na kontrolowanej stronie. Ta treść jest niepotrzebna i należy jej unikać (np. treść strony `/fr/about` w paczce strony `/en/about`).
125
+
126
+ - **Wycieki z innych tras**: Ten sam pomysł dla **innych ekranów** w aplikacji: czy ich teksty są dołączane, gdy otworzyłeś tylko jedną stronę (np. treść strony `/en/about` w paczce strony `/en/contact`). Wysoki wynik sugeruje słabe dzielenie lub zbyt szerokie paczki.
127
+
128
+ - **Średni rozmiar paczki komponentu**: Typowe elementy interfejsu użytkownika są mierzone **pojedynczo**, zamiast ukrywać się w gigantycznej liczbie dla całej aplikacji. Pokazuje to, czy internacjonalizacja po cichu nadyma codzienne komponenty. Na przykład, jeśli Twój komponent renderuje się ponownie, załaduje wszystkie te dane z pamięci. Dołączanie gigantycznego JSON-a do dowolnego komponentu jest jak podłączanie dużego magazynu nieużywanych danych, co spowolni wydajność Twoich komponentów.
129
+
130
+ - **Reaktywność przełączania języka**: Przełączam język za pomocą własnego sterowania aplikacji i mierzę czas, aż strona wyraźnie się przełączy — co zauważyłby odwiedzający.
131
+
132
+ - **Praca renderowania po zmianie języka**: Bardziej szczegółowe badanie: ile wysiłku interfejs włożył w ponowne odrysowanie dla nowego języka po rozpoczęciu zmiany. Przydatne, gdy „odczuwalny” czas i koszt frameworka się rozbiegają.
133
+
134
+ - **Czas początkowego ładowania strony**: Od nawigacji do momentu, w którym przeglądarka uzna stronę za w pełni załadowaną dla testowanych przeze mnie scenariuszy. Dobre do porównywania „zimnych startów”.
135
+
136
+ - **Czas hydratacji (Hydration)**: Czas, jaki klient spędza na przekształcaniu HTML z serwera w interaktywny interfejs. Myślnik w tabelach oznacza, że ta implementacja nie dostarczyła wiarygodnej liczby dotyczącej hydratacji w tym benchmarku.
137
+
138
+ ## Wyniki szczegółowe
139
+
140
+ ### 1 — Rozwiązania, których należy unikać
141
+
142
+ > W ekosystemie Vue nie ma jednoznacznego rozwiązania, którego należy unikać.
143
+
144
+ ### 2 — Rozwiązania akceptowalne
145
+
146
+ **(vue-i18n)** (`vue-i18n@11.4.0`):
147
+
148
+ - **vue-i18n** jest bezsprzecznie najczęściej używaną biblioteką i18n dla Vue, ma wiele funkcji i ogromny ekosystem. Jednak pod maską rozwiązanie to jest dość ciężkie. Nawet jeśli vue-i18n integruje lazy loading dla komunikatów, brakuje mu funkcji scopingu. W przypadku klasycznej aplikacji Vue SPA nie ma problemu, ale dla aplikacji nuxt wykorzystującej @nuxt/i18n prowadzi to do włączania komunikatów ze wszystkich stron do jednej. W przypadku dużej aplikacji nuxt zawierającej ponad 10 stron może to stać się naprawdę problematyczne.
149
+
150
+ Paczka jest bardzo ciężka (~24.3kb, co stanowi około 9x `vue-intlayer`).
151
+
152
+ **(fluent-vue)** (`fluent-vue@0.5.0`):
153
+
154
+ - **fluent-vue** oferuje próbę innowacji poprzez format .ftl. Organizacja komunikatów jest świetna, łatwiej zacząć. Ale w praktyce brak bezpieczeństwa typów zwiększa ryzyko błędu, a debugowanie może szybko stać się czasochłonne. Co więcej, to rozwiązanie ładuje komunikaty za pomocą wtyczki vite, która wymusza ładowanie całej treści we wszystkich językach na każdej stronie. Dodatkowo jest to ekstremalnie ciężkie rozwiązanie (~92.7kb, co stanowi około 34x `vue-intlayer`).
155
+
156
+ ### 3 — Rekomendacje
157
+
158
+ **(Intlayer)** (`vue-intlayer@8.7.12`):
159
+
160
+ Nie będę osobiście oceniać `vue-intlayer` ze względu na obiektywizm, ponieważ jest to moje własne rozwiązanie.
@@ -1,6 +1,6 @@
1
1
  ---
2
2
  createdAt: 2024-08-13
3
- updatedAt: 2026-04-08
3
+ updatedAt: 2026-05-12
4
4
  title: Konfiguracja
5
5
  description: Dowiedz się, jak skonfigurować Intlayer dla swojej aplikacji. Zrozum różne ustawienia i opcje dostępne do dostosowania Intlayer do Twoich potrzeb.
6
6
  keywords:
@@ -14,6 +14,9 @@ slugs:
14
14
  - concept
15
15
  - configuration
16
16
  history:
17
+ - version: 8.9.4
18
+ date: 2026-05-12
19
+ changes: "Dodano obsługę dostawcy LM Studio"
17
20
  - version: 8.7.0
18
21
  date: 2026-04-08
19
22
  changes: "Dodano opcje `prune` i `minify` do konfiguracji budowania"
@@ -350,7 +353,7 @@ const config: IntlayerConfig = {
350
353
  ai: {
351
354
  /**
352
355
  * Wybrany dostawca AI.
353
- * Opcje: 'openai', 'anthropic', 'mistral', 'deepseek', 'gemini', 'ollama', 'openrouter', 'alibaba', 'fireworks', 'groq', 'huggingface', 'bedrock', 'googlevertex', 'togetherai'
356
+ * Opcje: 'openai', 'anthropic', 'mistral', 'deepseek', 'gemini', 'ollama', 'openrouter', 'alibaba', 'fireworks', 'groq', 'huggingface', 'bedrock', 'googlevertex', 'togetherai', 'lmstudio'
354
357
  * Domyślnie: 'openai'
355
358
  */
356
359
  provider: "openai",
@@ -916,16 +919,17 @@ Intlayer obsługuje szeroką gamę dostawców AI, aby zapewnić maksymalną elas
916
919
  - **Groq**
917
920
  - **Amazon Bedrock**
918
921
  - **Together.ai**
919
-
920
- | Pole | Opis | Typ | Domyślnie | Przykład | Uwagi |
921
- | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | ------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
922
- | `provider` | Dostawca, który będzie używany do funkcji AI w Intlayer. | `'openai'` &#124; <br/> `'anthropic'` &#124; <br/> `'mistral'` &#124; <br/> `'deepseek'` &#124; <br/> `'gemini'` &#124; <br/> `'ollama'` &#124; <br/> `'openrouter'` &#124; <br/> `'alibaba'` &#124; <br/> `'fireworks'` &#124; <br/> `'groq'` &#124; <br/> `'huggingface'` &#124; <br/> `'bedrock'` &#124; <br/> `'googleaistudio'` &#124; <br/> `'googlevertex'` &#124; <br/> `'togetherai'` | `undefined` | `'anthropic'` | Różni dostawcy wymagają różnych kluczy API i mają różne cenniki. |
923
- | `model` | Model AI do użycia w funkcjach AI. | `string` | Brak | `'gpt-4o-2024-11-20'` | Konkretne modele zależą od dostawcy. |
924
- | `temperature` | Kontroluje losowość odpowiedzi AI. | `number` | Brak | `0.1` | Wyższa temperatura = bardziej kreatywne, ale mniej niezawodne odpowiedzi. |
925
- | `apiKey` | Twój klucz API dla wybranego dostawcy. | `string` | Brak | `process.env.OPENAI_API_KEY` | Musi pozostać tajny; używaj zmiennych środowiskowych. |
926
- | `applicationContext` | Dodatkowy kontekst o Twojej aplikacji, aby pomóc AI generować dokładniejsze tłumaczenia (domena, grupa docelowa, ton, terminologia). | `string` | Brak | `'mój własny kontekst aplikacji'` | Można użyć do dodania zasad (np.: `"Nie powinieneś tłumaczyć swoich URL"` ). |
927
- | `baseURL` | Bazowy URL dla API AI. | `string` | Brak | `'https://api.openai.com/v1'` <br/> `'http://localhost:5000'` | Może wskazywać na lokalne lub własne punkty końcowe API AI. |
928
- | `dataSerialization` | Format serializacji danych dla funkcji AI. | `'json'` &#124; <br/> `'toon'` | `undefined` | `'toon'` | `'json'`: domyślnie, niezawodne; zużywa więcej tokenów.<br/>• `'toon'`: mniej tokenów, mniej stabilne.<br/>• Przekazuje modelowi kontekst jako dodatkowy parametr (reasoning effort itp.). |
922
+ - **LM Studio**
923
+
924
+ | Pole | Opis | Typ | Domyślnie | Przykład | Uwagi |
925
+ | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- | ------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
926
+ | `provider` | Dostawca, który będzie używany do funkcji AI w Intlayer. | `'openai'` &#124; <br/> `'anthropic'` &#124; <br/> `'mistral'` &#124; <br/> `'deepseek'` &#124; <br/> `'gemini'` &#124; <br/> `'ollama'` &#124; <br/> `'openrouter'` &#124; <br/> `'alibaba'` &#124; <br/> `'fireworks'` &#124; <br/> `'groq'` &#124; <br/> `'huggingface'` &#124; <br/> `'bedrock'` &#124; <br/> `'googleaistudio'` &#124; <br/> `'googlevertex'` &#124; <br/> `'togetherai'` &#124; <br/> `'lmstudio'` | `undefined` | `'anthropic'` | Różni dostawcy wymagają różnych kluczy API i mają różne cenniki. |
927
+ | `model` | Model AI do użycia w funkcjach AI. | `string` | Brak | `'gpt-4o-2024-11-20'` | Konkretne modele zależą od dostawcy. |
928
+ | `temperature` | Kontroluje losowość odpowiedzi AI. | `number` | Brak | `0.1` | Wyższa temperatura = bardziej kreatywne, ale mniej niezawodne odpowiedzi. |
929
+ | `apiKey` | Twój klucz API dla wybranego dostawcy. | `string` | Brak | `process.env.OPENAI_API_KEY` | Musi pozostać tajny; używaj zmiennych środowiskowych. |
930
+ | `applicationContext` | Dodatkowy kontekst o Twojej aplikacji, aby pomóc AI generować dokładniejsze tłumaczenia (domena, grupa docelowa, ton, terminologia). | `string` | Brak | `'mój własny kontekst aplikacji'` | Można użyć do dodania zasad (np.: `"Nie powinieneś tłumaczyć swoich URL"` ). |
931
+ | `baseURL` | Bazowy URL dla API AI. | `string` | Brak | `'https://api.openai.com/v1'` <br/> `'http://localhost:5000'` | Może wskazywać na lokalne lub własne punkty końcowe API AI. |
932
+ | `dataSerialization` | Format serializacji danych dla funkcji AI. | `'json'` &#124; <br/> `'toon'` | `undefined` | `'toon'` | • `'json'`: domyślnie, niezawodne; zużywa więcej tokenów.<br/>• `'toon'`: mniej tokenów, mniej stabilne.<br/>• Przekazuje modelowi kontekst jako dodatkowy parametr (reasoning effort itp.). |
929
933
 
930
934
  ---
931
935