@intlayer/docs 8.9.6-canary.0 → 8.9.7

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 (141) hide show
  1. package/blog/ar/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  2. package/blog/de/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  3. package/blog/en/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  4. package/blog/en/react-i18next_vs_react-intl_vs_intlayer.md +1 -1
  5. package/blog/en-GB/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  6. package/blog/es/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  7. package/blog/fr/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  8. package/blog/id/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  9. package/blog/id/react-i18next_vs_react-intl_vs_intlayer.md +1 -1
  10. package/blog/it/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  11. package/blog/ja/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  12. package/blog/ko/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  13. package/blog/pl/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  14. package/blog/pl/react-i18next_vs_react-intl_vs_intlayer.md +1 -1
  15. package/blog/pt/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  16. package/blog/ru/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  17. package/blog/tr/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  18. package/blog/tr/react-i18next_vs_react-intl_vs_intlayer.md +1 -1
  19. package/blog/uk/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  20. package/blog/uk/react-i18next_vs_react-intl_vs_intlayer.md +1 -1
  21. package/blog/vi/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  22. package/blog/vi/react-i18next_vs_react-intl_vs_intlayer.md +1 -1
  23. package/blog/zh/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  24. package/docs/ar/benchmark/nextjs.md +8 -8
  25. package/docs/ar/benchmark/solid.md +8 -8
  26. package/docs/ar/benchmark/svelte.md +8 -8
  27. package/docs/ar/benchmark/tanstack.md +7 -7
  28. package/docs/ar/benchmark/vue.md +8 -8
  29. package/docs/ar/interest_of_intlayer.md +107 -80
  30. package/docs/bn/interest_of_intlayer.md +237 -0
  31. package/docs/cs/interest_of_intlayer.md +237 -0
  32. package/docs/de/benchmark/nextjs.md +8 -8
  33. package/docs/de/benchmark/solid.md +8 -8
  34. package/docs/de/benchmark/svelte.md +8 -8
  35. package/docs/de/benchmark/tanstack.md +7 -7
  36. package/docs/de/benchmark/vue.md +8 -8
  37. package/docs/de/interest_of_intlayer.md +98 -74
  38. package/docs/en/benchmark/___nextjs.md +8 -8
  39. package/docs/en/benchmark/___tanstack.md +6 -6
  40. package/docs/en/benchmark/nextjs.md +8 -8
  41. package/docs/en/benchmark/solid.md +8 -8
  42. package/docs/en/benchmark/svelte.md +8 -8
  43. package/docs/en/benchmark/tanstack.md +7 -7
  44. package/docs/en/benchmark/vue.md +8 -8
  45. package/docs/en/configuration.md +2 -1
  46. package/docs/en/interest_of_intlayer.md +1 -1
  47. package/docs/en-GB/benchmark/nextjs.md +8 -8
  48. package/docs/en-GB/benchmark/solid.md +8 -8
  49. package/docs/en-GB/benchmark/svelte.md +8 -8
  50. package/docs/en-GB/benchmark/tanstack.md +7 -7
  51. package/docs/en-GB/benchmark/vue.md +8 -8
  52. package/docs/en-GB/configuration.md +2 -1
  53. package/docs/en-GB/interest_of_intlayer.md +59 -33
  54. package/docs/es/benchmark/nextjs.md +8 -8
  55. package/docs/es/benchmark/solid.md +8 -8
  56. package/docs/es/benchmark/svelte.md +8 -8
  57. package/docs/es/benchmark/tanstack.md +7 -7
  58. package/docs/es/benchmark/vue.md +8 -8
  59. package/docs/es/interest_of_intlayer.md +28 -2
  60. package/docs/fr/benchmark/nextjs.md +8 -8
  61. package/docs/fr/benchmark/solid.md +8 -8
  62. package/docs/fr/benchmark/svelte.md +8 -8
  63. package/docs/fr/benchmark/tanstack.md +7 -7
  64. package/docs/fr/benchmark/vue.md +8 -8
  65. package/docs/fr/interest_of_intlayer.md +47 -21
  66. package/docs/hi/benchmark/nextjs.md +8 -8
  67. package/docs/hi/benchmark/solid.md +8 -8
  68. package/docs/hi/benchmark/svelte.md +8 -8
  69. package/docs/hi/benchmark/tanstack.md +7 -7
  70. package/docs/hi/benchmark/vue.md +8 -8
  71. package/docs/hi/interest_of_intlayer.md +114 -88
  72. package/docs/id/benchmark/nextjs.md +8 -8
  73. package/docs/id/benchmark/solid.md +8 -8
  74. package/docs/id/benchmark/svelte.md +8 -8
  75. package/docs/id/benchmark/tanstack.md +7 -7
  76. package/docs/id/benchmark/vue.md +8 -8
  77. package/docs/id/interest_of_intlayer.md +81 -81
  78. package/docs/it/benchmark/nextjs.md +8 -8
  79. package/docs/it/benchmark/solid.md +8 -8
  80. package/docs/it/benchmark/svelte.md +8 -8
  81. package/docs/it/benchmark/tanstack.md +7 -7
  82. package/docs/it/benchmark/vue.md +4 -4
  83. package/docs/it/interest_of_intlayer.md +96 -69
  84. package/docs/ja/benchmark/nextjs.md +8 -8
  85. package/docs/ja/benchmark/solid.md +8 -8
  86. package/docs/ja/benchmark/svelte.md +8 -8
  87. package/docs/ja/benchmark/tanstack.md +7 -7
  88. package/docs/ja/benchmark/vue.md +8 -8
  89. package/docs/ja/interest_of_intlayer.md +108 -81
  90. package/docs/ko/benchmark/nextjs.md +8 -8
  91. package/docs/ko/benchmark/solid.md +8 -8
  92. package/docs/ko/benchmark/svelte.md +8 -8
  93. package/docs/ko/benchmark/tanstack.md +7 -7
  94. package/docs/ko/benchmark/vue.md +8 -8
  95. package/docs/ko/interest_of_intlayer.md +101 -74
  96. package/docs/nl/interest_of_intlayer.md +237 -0
  97. package/docs/pl/benchmark/nextjs.md +8 -8
  98. package/docs/pl/benchmark/solid.md +8 -8
  99. package/docs/pl/benchmark/svelte.md +8 -8
  100. package/docs/pl/benchmark/tanstack.md +7 -7
  101. package/docs/pl/benchmark/vue.md +8 -8
  102. package/docs/pl/interest_of_intlayer.md +85 -83
  103. package/docs/pt/benchmark/nextjs.md +8 -8
  104. package/docs/pt/benchmark/solid.md +8 -8
  105. package/docs/pt/benchmark/svelte.md +8 -8
  106. package/docs/pt/benchmark/tanstack.md +7 -7
  107. package/docs/pt/benchmark/vue.md +8 -8
  108. package/docs/pt/interest_of_intlayer.md +91 -67
  109. package/docs/ru/benchmark/nextjs.md +8 -8
  110. package/docs/ru/benchmark/solid.md +6 -7
  111. package/docs/ru/benchmark/svelte.md +8 -8
  112. package/docs/ru/benchmark/tanstack.md +7 -7
  113. package/docs/ru/benchmark/vue.md +8 -8
  114. package/docs/ru/interest_of_intlayer.md +95 -69
  115. package/docs/tr/benchmark/nextjs.md +8 -8
  116. package/docs/tr/benchmark/solid.md +8 -8
  117. package/docs/tr/benchmark/svelte.md +8 -8
  118. package/docs/tr/benchmark/tanstack.md +7 -7
  119. package/docs/tr/benchmark/vue.md +8 -8
  120. package/docs/tr/interest_of_intlayer.md +94 -89
  121. package/docs/uk/benchmark/nextjs.md +8 -8
  122. package/docs/uk/benchmark/solid.md +8 -8
  123. package/docs/uk/benchmark/svelte.md +8 -8
  124. package/docs/uk/benchmark/tanstack.md +7 -7
  125. package/docs/uk/benchmark/vue.md +8 -8
  126. package/docs/uk/interest_of_intlayer.md +94 -96
  127. package/docs/ur/interest_of_intlayer.md +237 -0
  128. package/docs/vi/benchmark/nextjs.md +8 -8
  129. package/docs/vi/benchmark/solid.md +8 -8
  130. package/docs/vi/benchmark/svelte.md +8 -8
  131. package/docs/vi/benchmark/tanstack.md +7 -7
  132. package/docs/vi/benchmark/vue.md +8 -8
  133. package/docs/vi/interest_of_intlayer.md +82 -79
  134. package/docs/zh/benchmark/nextjs.md +8 -8
  135. package/docs/zh/benchmark/solid.md +6 -7
  136. package/docs/zh/benchmark/svelte.md +7 -7
  137. package/docs/zh/benchmark/tanstack.md +7 -7
  138. package/docs/zh/benchmark/vue.md +8 -8
  139. package/docs/zh/interest_of_intlayer.md +99 -72
  140. package/docs/zh-TW/interest_of_intlayer.md +237 -0
  141. package/package.json +6 -6
@@ -2,17 +2,20 @@
2
2
  createdAt: 2024-08-14
3
3
  updatedAt: 2025-09-27
4
4
  title: Lợi ích của Intlayer
5
- description: Khám phá các lợi ích và ưu điểm khi sử dụng Intlayer trong các dự án của bạn. Hiểu tại sao Intlayer nổi bật so với các framework khác.
5
+ description: Khám phá những lợi ích và ưu điểm của việc sử dụng Intlayer trong các dự án của bạn. Hiểu tại sao Intlayer nổi bật giữa các khung khác.
6
6
  keywords:
7
7
  - Lợi ích
8
8
  - Ưu điểm
9
9
  - Intlayer
10
- - Framework
10
+ - Khung
11
11
  - So sánh
12
12
  slugs:
13
13
  - doc
14
14
  - why
15
15
  history:
16
+ - version: 7.3.1
17
+ date: 2025-11-27
18
+ changes: "Phát hành Trình biên dịch"
16
19
  - version: 5.8.0
17
20
  date: 2025-08-19
18
21
  changes: "Cập nhật bảng so sánh"
@@ -25,13 +28,13 @@ history:
25
28
 
26
29
  ## Intlayer là gì?
27
30
 
28
- **Intlayer** là một thư viện quốc tế hóa được thiết kế đặc biệt cho các nhà phát triển JavaScript. Nó cho phép khai báo nội dung của bạn ở mọi nơi trong mã nguồn. Nó chuyển đổi các khai báo nội dung đa ngôn ngữ thành các từ điển có cấu trúc để dễ dàng tích hợp vào mã của bạn. Sử dụng TypeScript, **Intlayer** giúp phát triển của bạn mạnh mẽ và hiệu quả hơn.
31
+ **Intlayer** là một thư viện quốc tế hóa được thiết kế đặc biệt dành cho các nhà phát triển JavaScript. Nó cho phép khai báo nội dung của bạn ở mọi nơi trong mã của bạn. Nó chuyển đổi các khai báo nội dung đa ngôn ngữ thành các từ điển có cấu trúc để tích hợp dễ dàng trong mã của bạn. Sử dụng TypeScript, **Intlayer** làm cho việc phát triển của bạn mạnh mẽ và hiệu quả hơn.
29
32
 
30
33
  ## Tại sao Intlayer được tạo ra?
31
34
 
32
- Intlayer được tạo ra để giải quyết một vấn đề phổ biến ảnh hưởng đến tất cả các thư viện i18n thông dụng như `next-intl`, `react-i18next`, `react-intl`, `next-i18next`, `react-intl`, và `vue-i18n`.
35
+ Intlayer được tạo ra để giải quyết một vấn đề phổ biến ảnh hưởng đến tất cả các thư viện i18n phổ biến như `next-intl`, `react-i18next`, `react-intl`, `next-i18next`, `react-intl` và `vue-i18n`.
33
36
 
34
- Tất cả các giải pháp này đều áp dụng phương pháp tập trung để liệt kê và quản lý nội dung của bạn. Ví dụ:
37
+ Tất cả các giải pháp này đều áp dụng cách tiếp cận tập trung để liệt kê và quản lý nội dung của bạn. Ví dụ:
35
38
 
36
39
  ```bash
37
40
  .
@@ -46,7 +49,7 @@ Tất cả các giải pháp này đều áp dụng phương pháp tập trung
46
49
  └── index.tsx
47
50
  ```
48
51
 
49
- Hoặc ở đây sử dụng namespaces:
52
+ Hoặc ở đây sử dụng không gian tên:
50
53
 
51
54
  ```bash
52
55
  .
@@ -67,23 +70,23 @@ Hoặc ở đây sử dụng namespaces:
67
70
  └── index.tsx
68
71
  ```
69
72
 
70
- Loại kiến trúc này làm chậm quá trình phát triển và khiến codebase trở nên phức tạp hơn để duy trì vì một số lý do:
73
+ Loại kiến trúc này làm chậm quá trình phát triển và khiến nguồn trở nên phức tạp hơn để bảo trì vì một số lý do:
71
74
 
72
- 1. **Đối với bất kỳ component mới nào được tạo, bạn cần:**
73
- - Tạo resource/namespace mới trong thư mục `locales`
74
- - Nhớ import namespace mới vào trang của bạn
75
+ 1. **Đối với bất kỳ thành phần mới nào được tạo, bạn nên:**
76
+ - Tạo tài nguyên/không gian tên mới trong thư mục `locales`
77
+ - Nhớ nhập không gian tên mới trong trang của bạn
75
78
  - Dịch nội dung của bạn (thường được thực hiện thủ công bằng cách sao chép/dán từ các nhà cung cấp AI)
76
79
 
77
- 2. **Đối với bất kỳ thay đổi nào được thực hiện trên các component của bạn, bạn cần:**
78
- - Tìm kiếm resource/namespace liên quan (cách xa component)
80
+ 2. **Đối với bất kỳ thay đổi nào được thực hiện trên các thành phần của bạn, bạn nên:**
81
+ - Tìm kiếm tài nguyên/không gian tên liên quan (xa thành phần)
79
82
  - Dịch nội dung của bạn
80
- - Đảm bảo nội dung của bạn được cập nhật cho mọi locale
81
- - Kiểm tra namespace của bạn không bao gồm các khóa/giá trị không sử dụng
82
- - Đảm bảo cấu trúc các file JSON của bạn giống nhau cho tất cả các locale
83
+ - Đảm bảo nội dung của bạn được cập nhật cho mọi ngôn ngữ
84
+ - Xác minh không gian tên của bạn không bao gồm các khóa/giá trị không sử dụng
85
+ - Đảm bảo cấu trúc của các tệp JSON của bạn giống nhau cho tất cả các ngôn ngữ
83
86
 
84
- Trong các dự án chuyên nghiệp sử dụng các giải pháp này, các nền tảng localization thường được sử dụng để giúp quản lý việc dịch nội dung của bạn. Tuy nhiên, điều này có thể nhanh chóng trở nên tốn kém đối với các dự án lớn.
87
+ Trên các dự án chuyên nghiệp sử dụng các giải pháp này, các nền tảng địa phương hóa thường được sử dụng để giúp quản lý việc dịch nội dung của bạn. Tuy nhiên, điều này có thể nhanh chóng trở nên tốn kém cho các dự án lớn.
85
88
 
86
- Để giải quyết vấn đề này, Intlayer áp dụng một cách tiếp cận phân vùng nội dung theo từng component và giữ nội dung của bạn gần với component của bạn, giống như cách chúng ta thường làm với CSS (`styled-components`), types, tài liệu (`storybook`), hoặc unit tests (`jest`).
89
+ Để giải quyết vấn đề này, Intlayer áp dụng một cách tiếp cận phân phạm vi nội dung của bạn theo từng thành phần và giữ nội dung của bạn gần với thành phần của bạn, như chúng ta thường làm với CSS (`styled-components`), các kiểu, tài liệu (`storybook`) hoặc kiểm thử đơn vị (`jest`).
87
90
 
88
91
  ```bash codeFormat="typescript"
89
92
  .
@@ -118,7 +121,6 @@ Trong các dự án chuyên nghiệp sử dụng các giải pháp này, các n
118
121
  ```tsx fileName="./components/MyComponent/index.content.ts" codeFormat={["typescript", "esm", "commonjs"]}
119
122
  import { t, type Dictionary } from "intlayer";
120
123
 
121
- // Nội dung ví dụ cho component
122
124
  const componentExampleContent = {
123
125
  key: "component-example",
124
126
  content: {
@@ -146,89 +148,90 @@ export const ComponentExample = () => {
146
148
  Cách tiếp cận này cho phép bạn:
147
149
 
148
150
  1. **Tăng tốc độ phát triển**
149
- - Các tệp `.content.{{ts|mjs|cjs|json}}` có thể được tạo bằng cách sử dụng tiện ích mở rộng VSCode
151
+ - Các tệp `.content.{{ts|mjs|cjs|json}}` có thể được tạo bằng tiện ích mở rộng VSCode
150
152
  - Các công cụ AI tự động hoàn thành trong IDE của bạn (như GitHub Copilot) có thể giúp bạn khai báo nội dung, giảm việc sao chép/dán
151
153
 
152
- 2. **Làm sạch codebase của bạn**
154
+ 2. **Làm sạch nguồn của bạn**
153
155
  - Giảm độ phức tạp
154
156
  - Tăng khả năng bảo trì
155
157
 
156
- 3. **Nhân bản các component và nội dung liên quan dễ dàng hơn (Ví dụ: các component đăng nhập/đăng ký, v.v.)**
157
- - Bằng cách hạn chế rủi ro ảnh hưởng đến nội dung của các component khác
158
- - Bằng cách sao chép/dán nội dung của bạn từ ứng dụng này sang ứng dụng khác mà không cần phụ thuộc bên ngoài
158
+ 3. **Sao chép các thành phần và nội dung liên quan của chúng dễ dàng hơn (Ví dụ: thành phần đăng nhập/đăng ký, v.v.)**
159
+ - Bằng cách hạn chế rủi ro ảnh hưởng đến nội dung của các thành phần khác
160
+ - Bằng cách sao chép/dán nội dung của bạn từ ứng dụng này sang ứng dụng khác mà không các phụ thuộc bên ngoài
159
161
 
160
- 4. **Tránh làm bẩn codebase của bạn với các khóa/giá trị không sử dụng cho các component không dùng đến**
161
- - Nếu bạn không sử dụng một component, Intlayer sẽ không nhập nội dung liên quan của nó
162
- - Nếu bạn xóa một component, bạn sẽ dễ dàng nhớ để xóa nội dung liên quan vì nó sẽ nằm trong cùng một thư mục
162
+ 4. **Tránh làm bẩn nguồn của bạn với các khóa/giá trị không sử dụng cho các thành phần không sử dụng**
163
+ - Nếu bạn không sử dụng một thành phần, Intlayer sẽ không nhập nội dung liên quan của nó
164
+ - Nếu bạn xóa một thành phần, bạn sẽ dễ dàng nhớ xóa nội dung liên quan của nó vì nó sẽ mặt trong cùng một thư mục
163
165
 
164
- 5. **Giảm chi phí suy luận cho các AI agent khi khai báo nội dung đa ngôn ngữ của bạn**
165
- - AI agent sẽ không phải quét toàn bộ codebase của bạn để biết nơi triển khai nội dung
166
- - Việc dịch thuật có thể dễ dàng thực hiện bằng các công cụ AI hỗ trợ tự động hoàn thành trong IDE của bạn (như GitHub Copilot)
166
+ 5. **Giảm chi phí lập luận cho các tác nhân AI để khai báo nội dung đa ngôn ngữ của bạn**
167
+ - Tác nhân AI sẽ không phải quét toàn bộ nguồn của bạn để biết nơi triển khai nội dung của bạn
168
+ - Các bản dịch có thể dễ dàng được thực hiện bằng các công cụ AI tự động hoàn thành trong IDE của bạn (như GitHub Copilot)
167
169
 
168
- 6. **Tối ưu hiệu suất tải**
169
- - Nếu một component được tải theo lazy-load, nội dung liên quan sẽ được tải cùng lúc
170
+ 6. **Tối ưu hóa hiệu suất tải**
171
+ - Nếu một thành phần được tải lười (lazy-loaded), nội dung liên quan của nó sẽ được tải cùng lúc
170
172
 
171
173
  ## Các tính năng bổ sung của Intlayer
172
174
 
173
- | Tính năng | Mô tả |
174
- | --------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
175
- | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/frameworks.png?raw=true) | **Hỗ trợ đa Framework**<br><br>Intlayer tương thích với tất cả các framework và thư viện lớn, bao gồm Next.js, React, Vite, Vue.js, Nuxt, Preact, Express và nhiều hơn nữa. |
176
- | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/javascript_content_management.jpg?raw=true) | **Quản lý Nội dung Bằng JavaScript**<br><br>Khai thác sự linh hoạt của JavaScript để định nghĩa và quản lý nội dung của bạn một cách hiệu quả.<br><br> - [Khai báo nội dung](https://intlayer.org/doc/concept/content) |
177
- | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/per_locale_content_declaration_file.png?raw=true) | **Tệp Khai Báo Nội Dung Theo Ngôn Ngữ**<br><br>Tăng tốc phát triển bằng cách khai báo nội dung một lần, trước khi tự động tạo.<br><br> - [Tệp Khai Báo Nội Dung Theo Ngôn Ngữ](https://intlayer.org/doc/concept/per-locale-file) |
178
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true) | **Môi Trường An Toàn Kiểu Dữ Liệu**<br><br>Tận dụng TypeScript để đảm bảo định nghĩa nội dung và mã của bạn không có lỗi, đồng thời hưởng lợi từ tính năng tự động hoàn thành trong IDE.<br><br> - [Cấu hình TypeScript](https://intlayer.org/doc/environment/vite-and-react#configure-typescript) |
179
- | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/config_file.png?raw=true) | **Cài đặt Đơn giản hóa**<br><br>Bắt đầu nhanh chóng với cấu hình tối thiểu. Dễ dàng điều chỉnh các thiết lập cho quốc tế hóa, định tuyến, AI, build xử nội dung.<br><br> - [Khám phá tích hợp Next.js](https://intlayer.org/doc/environment/nextjs) |
180
- | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/content_retrieval.png?raw=true) | **Truy xuất Nội dung Đơn giản hóa**<br><br>Không cần gọi hàm `t` cho từng phần nội dung. Truy xuất tất cả nội dung của bạn trực tiếp bằng một hook duy nhất.<br><br> - [Tích hợp React](https://intlayer.org/doc/environment/create-react-app) |
181
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/server_component.png?raw=true) | **Triển khai Thành phần Server Nhất quán**<br><br>Phù hợp hoàn hảo cho các thành phần server của Next.js, sử dụng cùng một triển khai cho cả thành phần client và server, không cần truyền hàm `t` của bạn qua từng thành phần server. <br><br> - [Server Components](https://intlayer.org/doc/environment/nextjs#step-7-utilize-content-in-your-code) |
182
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/file_tree.png?raw=true) | **Codebase Tổ Chức**<br><br>Giữ cho codebase của bạn tổ chức hơn: 1 component = 1 từ điển trong cùng một thư mục. Việc đặt bản dịch gần với các component tương ứng giúp tăng khả năng bảo trì sự rõ ràng. <br><br> - [Cách Intlayer hoạt động](https://intlayer.org/doc/concept/how-works-intlayer) |
183
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/url_routing.png?raw=true) | **Điều Hướng Nâng Cao**<br><br>Hỗ trợ đầy đủ điều hướng ứng dụng, thích ứng mượt với các cấu trúc ứng dụng phức tạp, dành cho Next.js, React, Vite, Vue.js, v.v.<br><br> - [Khám phá tích hợp Next.js](https://intlayer.org/doc/environment/nextjs) |
184
- | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/markdown.png?raw=true) | **Hỗ trợ Markdown**<br><br>Nhập giải thích các tệp locale Markdown từ xa cho nội dung đa ngôn ngữ như chính sách bảo mật, tài liệu, v.v. Giải thích và làm cho metadata của Markdown có thể truy cập trong mã của bạn.<br><br> - [Tệp nội dung](https://intlayer.org/doc/concept/content/file) |
185
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/visual_editor.png?raw=true) | **Trình chỉnh sửa trực quan và CMS miễn phí**<br><br>Một trình chỉnh sửa trực quan CMS miễn phí sẵn cho người viết nội dung, loại bỏ nhu cầu sử dụng nền tảng bản địa hóa. Giữ nội dung của bạn đồng bộ bằng cách sử dụng Git, hoặc ngoại hóa hoàn toàn hoặc một phần với CMS.<br><br> - [Trình chỉnh sửa Intlayer](https://intlayer.org/doc/concept/editor) <br> - [CMS Intlayer](https://intlayer.org/doc/concept/cms) |
186
- | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle.png?raw=true) | **Nội dung thể Tree-shake**<br><br>Nội dung thể tree-shake, giảm kích thước của gói cuối cùng. Tải nội dung theo từng component, loại trừ bất kỳ nội dung không sử dụng nào khỏi gói của bạn. Hỗ trợ lazy loading để nâng cao hiệu quả tải ứng dụng. <br><br> - [Tối ưu hóa build ứng dụng](https://intlayer.org/doc/concept/how-works-intlayer#app-build-optimization) |
187
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/static_rendering.png?raw=true) | **Kết xuất Tĩnh**<br><br>Không chặn Kết xuất Tĩnh.<br><br> - [Tích hợp Next.js](https://intlayer.org/doc/environment/nextjs) |
188
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/AI_translation.png?raw=true) | **Dịch Thuật Bằng AI**<br><br>Biến trang web của bạn thành 231 ngôn ngữ chỉ với một cú nhấp chuột bằng cách sử dụng các công cụ dịch thuật tiên tiến dựa trên AI của Intlayer với nhà cung cấp AI/key API của riêng bạn. <br><br> - [Tích hợp CI/CD](https://intlayer.org/doc/concept/ci-cd) <br> - [Intlayer CLI](https://intlayer.org/doc/concept/cli) <br> - [Tự động điền](https://intlayer.org/doc/concept/auto-fill) |
189
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/mcp.png?raw=true) | **Tích hợp Máy chủ MCP**<br><br>Cung cấp một máy chủ MCP (Model Context Protocol) cho tự động hóa IDE, cho phép quản nội dung quy trình làm việc i18n liền mạch trực tiếp trong môi trường phát triển của bạn. <br><br> - [Máy chủ MCP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/mcp_server.md) |
190
- | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/vscode_extension.png?raw=true) | **Tiện ích mở rộng VSCode**<br><br>Intlayer cung cấp một tiện ích mở rộng VSCode giúp bạn quản lý nội dung và bản dịch của mình, xây dựng từ điển, dịch nội dung nhiều hơn thế nữa. <br><br> - [Tiện ích mở rộng VSCode](https://intlayer.org/doc/vi/vs-code-extension) |
191
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/interoperability.png?raw=true) | **Tương tác đa nền tảng**<br><br>Cho phép tương tác đa nền tảng với react-i18next, next-i18next, next-intl react-intl. <br><br> - [Intlayerreact-intl](https://intlayer.org/blog/intlayer-with-react-intl) <br> - [Intlayernext-intl](https://intlayer.org/blog/intlayer-with-next-intl) <br> - [Intlayer next-i18next](https://intlayer.org/blog/intlayer-with-next-i18next) |
192
- | Kiểm tra Bản dịch Thiếu (CLI/CI) | CLI: npx intlayer content test (kiểm tra thân thiện với CI) |
175
+ | Tính năng | Mô tả |
176
+ | -------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
177
+ | ![Tính năng](https://github.com/aymericzip/intlayer/blob/main/docs/assets/frameworks.png?raw=true) | **Hỗ trợ đa khung làm việc**<br><br>Intlayer tương thích với tất cả các khung làm việc và thư viện chính, bao gồm Next.js, React, Vite, Vue.js, Nuxt, Preact, Express và nhiều hơn nữa. |
178
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/javascript_content_management.jpg?raw=true) | **Quản lý nội dung bằng sức mạnh JavaScript**<br><br>Tận dụng tính linh hoạt của JavaScript để xác định và quản lý nội dung của bạn một cách hiệu quả. <br><br> - [Khai báo nội dung](https://intlayer.org/doc/concept/content) |
179
+ | <img src="https://github.com/aymericzip/intlayer/blob/main/docs/assets/compiler.jpg?raw=true" alt="Tính năng" width="700"> | **Trình biên dịch**<br><br>Trình biên dịch Intlayer tự động trích xuất nội dung từ các thành phần tạo các tệp từ điển.<br><br> - [Trình biên dịch](https://intlayer.org/doc/compiler) |
180
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/per_locale_content_declaration_file.png?raw=true) | **Tệp khai báo nội dung theo ngôn ngữ**<br><br>Tăng tốc độ phát triển của bạn bằng cách khai báo nội dung của bạn một lần, trước khi tự động tạo.<br><br> - [Tệp khai báo nội dung theo ngôn ngữ](https://intlayer.org/doc/concept/per-locale-file) |
181
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true) | **Môi trường Type-Safe**<br><br>Tận dụng TypeScript để đảm bảo các định nghĩa nội dung của bạn không lỗi, đồng thời hưởng lợi từ tính năng tự động hoàn thành của IDE.<br><br> - [Cấu hình TypeScript](https://intlayer.org/doc/environment/vite-and-react#configure-typescript) |
182
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/config_file.png?raw=true) | **Thiết lập đơn giản hóa**<br><br>Bắt đầu chạy nhanh chóng với cấu hình tối thiểu. Điều chỉnh các cài đặt cho quốc tế hóa, định tuyến, AI, xây dựng và xử lý nội dung một cách dễ dàng. <br><br> - [Khám phá tích hợp Next.js](https://intlayer.org/doc/environment/nextjs) |
183
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/content_retrieval.png?raw=true) | **Truy xuất nội dung đơn giản hóa**<br><br>Không cần gọi hàm `t` cho từng phần nội dung. Truy xuất tất cả nội dung của bạn trực tiếp bằng một hook duy nhất.<br><br> - [Tích hợp React](https://intlayer.org/doc/environment/create-react-app) |
184
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/server_component.png?raw=true) | **Triển khai Server Component nhất quán**<br><br>Hoàn toàn phù hợp cho các server component của Next.js, sử dụng cùng một cách triển khai cho cả thành phần client server, không cần truyền hàm `t` của bạn qua từng server component. <br><br> - [Server Components](https://intlayer.org/doc/environment/nextjs#step-7-utilize-content-in-your-code) |
185
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/file_tree.png?raw=true) | **Mã nguồn được tổ chức**<br><br>Giữ cho nguồn của bạn tổ chức hơn: 1 thành phần = 1 từ điển trong cùng một thư mục. Các bản dịch gần với các thành phần tương ứng của chúng giúp tăng khả năng bảo trì và sự rõ ràng. <br><br> - [Cách Intlayer hoạt động](https://intlayer.org/doc/concept/how-works-intlayer) |
186
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/url_routing.png?raw=true) | **Định tuyến nâng cao**<br><br>Hỗ trợ đầy đủ định tuyến ứng dụng, thích ứng liền mạch với các cấu trúc ứng dụng phức tạp, cho Next.js, React, Vite, Vue.js, v.v.<br><br> - [Khám phá tích hợp Next.js](https://intlayer.org/doc/environment/nextjs) |
187
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/markdown.png?raw=true) | **Hỗ trợ Markdown**<br><br>Nhập diễn giải các tệp ngôn ngữ Markdown từ xa cho nội dung đa ngôn ngữ như chính sách bảo mật, tài liệu, v.v. Diễn giải làm cho siêu dữ liệu Markdown thể truy cập được trong của bạn.<br><br> - [Tệp nội dung](https://intlayer.org/doc/concept/content/file) |
188
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/visual_editor.png?raw=true) | **Trình biên tập trực quan & CMS miễn phí**<br><br>Một trình biên tập trực quan CMS miễn phí sẵn cho các nhà viết nội dung, loại bỏ nhu cầu về một nền tảng địa phương hóa. Giữ cho nội dung của bạn được đồng bộ hóa bằng Git, hoặc bên thứ ba hóa hoàn toàn hoặc một phần với CMS.<br><br> - [Trình biên tập Intlayer](https://intlayer.org/doc/concept/editor) <br> - [Intlayer CMS](https://intlayer.org/doc/concept/cms) |
189
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle.png?raw=true) | **Nội dung Tree-shakable**<br><br>Nội dung tree-shakable, giảm kích thước của gói cuối cùng. Tải nội dung theo từng thành phần, loại trừ bất kỳ nội dung không sử dụng nào khỏi gói của bạn. Hỗ trợ tải lười để tăng hiệu quả tải ứng dụng. <br><br> - [Tối ưu hóa xây dựng ứng dụng](https://intlayer.org/doc/concept/how-works-intlayer#app-build-optimization) |
190
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/static_rendering.png?raw=true) | **Kết xuất tĩnh (Static Rendering)**<br><br>Không chặn Kết xuất tĩnh. <br><br> - [Tích hợp Next.js](https://intlayer.org/doc/environment/nextjs) |
191
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/AI_translation.png?raw=true) | **Dịch bằng AI**<br><br>Biến trang web của bạn sang 231 ngôn ngữ chỉ bằng một nhấp chuột bằng các công cụ dịch nâng cao được hỗ trợ bởi AI của Intlayer bằng cách sử dụng nhà cung cấp AI/khóa API của riêng bạn. <br><br> - [Tích hợp CI/CD](https://intlayer.org/doc/concept/ci-cd) <br> - [Intlayer CLI](https://intlayer.org/doc/concept/cli) <br> - [Tự động điền](https://intlayer.org/doc/concept/auto-fill) |
192
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/mcp.png?raw=true) | **Tích hợp Máy chủ MCP**<br><br>Cung cấp máy chủ MCP (Model Context Protocol) để tự động hóa IDE, cho phép quản lý nội dung và quy trình làm việc i18n liền mạch ngay trong môi trường phát triển của bạn. <br><br> - [Máy chủ MCP](https://github.com/aymericzip/intlayer/blob/main/docs/vi/mcp_server.md) |
193
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/vscode_extension.png?raw=true) | **Tiện ích mở rộng VSCode**<br><br>Intlayer cung cấp một tiện ích mở rộng VSCode để giúp bạn quản nội dungbản dịch, xây dựng từ điển, dịch nội dung nhiều hơn nữa. <br><br> - [Tiện ích mở rộng VSCode](https://intlayer.org/doc/vs-code-extension) |
194
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/interoperability.png?raw=true) | **Khả năng tương tác**<br><br>Cho phép khả năng tương tác với react-i18next, next-i18next, next-intl và react-intl. <br><br> - [Intlayer và 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) |
195
+ | Kiểm tra bản dịch còn thiếu (CLI/CI) | ✅ CLI: npx intlayer content test (kiểm tra thân thiện với CI) |
193
196
 
194
197
  ## So sánh Intlayer với các giải pháp khác
195
198
 
196
- | Tính năng | `intlayer` | `react-i18next` | `react-intl` (FormatJS) | `lingui` | `next-intl` | `next-i18next` | `vue-i18n` |
197
- | ------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------- |
198
- | **Bản dịch Gần Các Thành Phần** | ✅ Có, nội dung được đặt gần với từng thành phần | ❌ Không | ❌ Không | ❌ Không | ❌ Không | ❌ Không | ✅ Có - sử dụng `Single File Components` (SFCs) |
199
- | **Tích hợp TypeScript** | ✅ Nâng cao, tự động tạo kiểu nghiêm ngặt | ⚠️ Cơ bản; cần cấu hình thêm để đảm bảo an toàn | ✅ Tốt, nhưng ít nghiêm ngặt hơn | ⚠️ Typings, cần cấu hình | ✅ Tốt | ⚠️ Cơ bản | ✅ Tốt (có kiểu; cần thiết lập an toàn khóa) |
200
- | **Phát hiện bản dịch còn thiếu** | ✅ Đánh dấu lỗi TypeScript và lỗi/cảnh báo trong thời gian biên dịch | ⚠️ Chủ yếu là chuỗi dự phòng khi chạy | ⚠️ Chuỗi dự phòng | ⚠️ Cần cấu hình thêm | ⚠️ Chuỗi dự phòng khi chạy | ⚠️ Chuỗi dự phòng khi chạy | ⚠️ Chuỗi dự phòng/cảnh báo khi chạy (có thể cấu hình) |
201
- | **Nội dung phong phú (JSX/Markdown/components)** | ✅ Hỗ trợ trực tiếp | ⚠️ Hạn chế / chỉ nội suy | ⚠️ Cú pháp ICU, không phải JSX thực sự | ⚠️ Hạn chế | ❌ Không thiết kế cho các node phong phú | ⚠️ Hạn chế | ⚠️ Hạn chế (các component qua `<i18n-t>`, Markdown qua plugin) |
202
- | **Dịch thuật hỗ trợ AI** | ✅ Có, hỗ trợ nhiều nhà cung cấp AI. Có thể sử dụng bằng các khóa API riêng của bạn. Xem xét ngữ cảnh của ứng dụng và phạm vi nội dung | ❌ Không | ❌ Không | ❌ Không | ❌ Không | ❌ Không | ❌ Không |
203
- | **Trình chỉnh sửa trực quan** | ✅ Có, Trình chỉnh sửa trực quan cục bộ + CMS tùy chọn; có thể tách nội dung codebase ra ngoài; có thể nhúng được | ❌ Không / có sẵn qua các nền tảng nội địa hóa bên ngoài | ❌ Không / có sẵn qua các nền tảng nội địa hóa bên ngoài | ❌ Không / có sẵn qua các nền tảng nội địa hóa bên ngoài | ❌ Không / có sẵn qua các nền tảng nội địa hóa bên ngoài | ❌ Không / có sẵn qua các nền tảng nội địa hóa bên ngoài | ❌ Không / có sẵn qua các nền tảng nội địa hóa bên ngoài |
204
- | **Định tuyến địa phương hóa** | ✅ Có, hỗ trợ đường dẫn địa phương hóa sẵn (hoạt động với Next.js & Vite) | ⚠️ Không tích hợp sẵn, cần plugin (ví dụ `next-i18next`) hoặc cấu hình router tùy chỉnh | ❌ Không, chỉ định dạng thông điệp, định tuyến phải làm thủ công | ⚠️ Không tích hợp sẵn, cần plugin hoặc cấu hình thủ công | ✅ Tích hợp sẵn, App Router hỗ trợ phân đoạn `[locale]` | ✅ Tích hợp sẵn | ✅ Tích hợp sẵn |
205
- | **Tạo Đường Dẫn Động** | ✅ Có | ⚠️ Plugin/hệ sinh thái hoặc cấu hình thủ công | ❌ Không cung cấp | ⚠️ Plugin/thủ công | ✅ Có | ✅ Có | ❌ Không cung cấp (Nuxt i18n cung cấp) |
206
- | **Phân số nhiều** | ✅ Mẫu dựa trên liệt kê | ✅ Có thể cấu hình (các plugin như i18next-icu) | ✅ (ICU) | ✅ (ICU/messageformat) | ✅ Tốt | ✅ Tốt | ✅ Quy tắc phân số nhiều tích hợp sẵn |
207
- | **Định dạng (ngày tháng, số, tiền tệ)** | ✅ Bộ định dạng tối ưu (Intl bên trong) | ⚠️ Qua plugins hoặc sử dụng Intl tùy chỉnh | ✅ Bộ định dạng ICU | ✅ Trợ giúp ICU/CLI | ✅ Tốt (trợ giúp Intl) | ✅ Tốt (trợ giúp Intl) | ✅ Bộ định dạng ngày/tháng/số tích hợp sẵn (Intl) |
208
- | **Định dạng nội dung** | ✅ .tsx, .ts, .js, .json, .md, .txt, (.yaml đang phát triển) | ⚠️ .json | ✅ .json, .js | ⚠️ .po, .json | ✅ .json, .js, .ts | ⚠️ .json | ✅ .json, .js |
209
- | **Hỗ trợ ICU** | ⚠️ Đang phát triển (WIP) | ⚠️ Qua plugin (i18next-icu) | ✅ Có | ✅ Có | ✅ Có | ⚠️ Qua plugin (`i18next-icu`) | ⚠️ Qua bộ định dạng/trình biên dịch tùy chỉnh |
210
- | **Trợ giúp SEO (hreflang, sitemap)** | ✅ Công cụ tích hợp sẵn: trợ giúp cho sitemap, robots.txt, metadata | ⚠️ Plugin cộng đồng / thủ công | ❌ Không phải lõi | ❌ Không phải lõi | ✅ Tốt | ✅ Tốt | ❌ Không phải lõi (Nuxt i18n cung cấp trợ giúp) |
211
- | **Hệ sinh thái / Cộng đồng** | ⚠️ Nhỏ hơn nhưng đang phát triển nhanh và phản ứng nhanh | ✅ Lớn nhất và trưởng thành | ✅ Lớn | ⚠️ Nhỏ hơn | ✅ Trung bình, tập trung vào Next.js | ✅ Trung bình, tập trung vào Next.js | ✅ Lớn trong hệ sinh thái Vue |
212
- | **Kết xuất phía máy chủ & Thành phần máy chủ** | ✅ Có, tối ưu cho SSR / React Server Components | ⚠️ Hỗ trợ ở cấp trang nhưng cần truyền các hàm t-functions trên cây thành phần cho các thành phần máy chủ con | ⚠️ Hỗ trợ ở cấp trang với thiết lập bổ sung, nhưng cần truyền các hàm t-functions trên cây thành phần cho các thành phần máy chủ con | ✅ Hỗ trợ, cần thiết lập | ⚠️ Hỗ trợ ở cấp trang nhưng cần truyền các hàm t-functions trên cây thành phần cho các thành phần máy chủ con | ⚠️ Hỗ trợ ở cấp trang nhưng cần truyền các hàm t-functions trên cây thành phần cho các thành phần máy chủ con | ✅ SSR qua Nuxt/Vue SSR (không RSC) |
213
- | **Tree-shaking (chỉ tải nội dung được sử dụng)** | ✅ Có, theo từng component tại thời điểm build thông qua các plugin Babel/SWC | ⚠️ Thường tải tất cả (có thể cải thiện với namespaces/phân tách code) | ⚠️ Thường tải tất cả | ❌ Không phải mặc định | ⚠️ Một phần | ⚠️ Một phần | ⚠️ Một phần (với phân tách code/cài đặt thủ công) |
214
- | **Tải lười (Lazy loading)** | ✅ Có, theo từng locale / từng từ điển | ✅ Có (ví dụ, backend/namespace theo yêu cầu) | ✅ Có (chia nhỏ gói locale) | ✅ Có (nhập khẩu danh mục động) | ✅ Có (theo từng route/theo từng locale), cần quản lý namespace | ✅ Có (theo từng route/theo từng locale), cần quản lý namespace | ✅ Có (tin nhắn locale bất đồng bộ) |
215
- | **Xóa nội dung không sử dụng** | ✅ Có, theo từ điển tại thời điểm build | ❌ Không, chỉ qua phân đoạn namespace thủ công | ❌ Không, tất cả các thông điệp đã khai báo đều được đóng gói | ✅ Có, các khóa không sử dụng được phát hiện & loại bỏ tại thời điểm build | ❌ Không, có thể quản lý thủ công với quản lý namespace | ❌ Không, có thể quản lý thủ công với quản lý namespace | ❌ Không, chỉ có thể thực hiện qua lazy-loading thủ công |
216
- | **Quản lý Dự án Lớn** | ✅ Khuyến khích mô-đun, phù hợp cho hệ thống thiết kế | ⚠️ Cần kỷ luật tệp tốt | ⚠️ Các danh mục trung tâm có thể trở nên lớn | ⚠️ Có thể trở nên phức tạp | ✅ Mô-đun với thiết lập | ✅ Mô-đun với thiết lập | ✅ Mô-đun với thiết lập Vue Router/Nuxt i18n |
199
+ | Tính năng | `intlayer` | `react-i18next` | `react-intl` (FormatJS) | `lingui` | `next-intl` | `next-i18next` | `vue-i18n` |
200
+ | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------- |
201
+ | **Bản dịch gần các thành phần** | ✅ Có, nội dung được đặt cùng với từng thành phần | ❌ Không | ❌ Không | ❌ Không | ❌ Không | ❌ Không | ✅ Có - sử dụng `Single File Components` (SFCs) |
202
+ | **Tích hợp TypeScript** | ✅ Nâng cao, các kiểu nghiêm ngặt được tạo tự động | ⚠️ Cơ bản; cần cấu hình thêm để an toàn | ✅ Tốt, nhưng ít nghiêm ngặt hơn | ⚠️ Định kiểu, cần cấu hình | ✅ Tốt | ⚠️ Cơ bản | ✅ Tốt (có sẵn kiểu; an toàn khóa cần thiết lập) |
203
+ | **Phát hiện bản dịch còn thiếu** | ✅ Làm nổi bật lỗi TypeScript và lỗi/cảnh báo trong thời gian xây dựng | ⚠️ Chủ yếu là các chuỗi dự phòng (fallback) khi chạy | ⚠️ Các chuỗi dự phòng | ⚠️ Cần cấu hình thêm | ⚠️ Dự phòng khi chạy | ⚠️ Dự phòng khi chạy | ⚠️ Dự phòng/cảnh báo khi chạy (có thể cấu hình) |
204
+ | **Nội dung phong phú (JSX/Markdown/thành phần)** | ✅ Hỗ trợ trực tiếp | ⚠️ Hạn chế / chỉ nội suy | ⚠️ Cú pháp ICU, không phải JSX thực | ⚠️ Hạn chế | ❌ Không được thiết kế cho các nút phong phú | ⚠️ Hạn chế | ⚠️ Hạn chế (thành phần qua `<i18n-t>`, Markdown qua plugin) |
205
+ | **Dịch bằng AI** | ✅ Có, hỗ trợ nhiều nhà cung cấp AI. Có thể sử dụng bằng các khóa API của riêng bạn. Xem xét bối cảnh ứng dụng và phạm vi nội dung của bạn | ❌ Không | ❌ Không | ❌ Không | ❌ Không | ❌ Không | ❌ Không |
206
+ | **Trình biên tập trực quan** | ✅ Có, Trình biên tập trực quan cục bộ + CMS tùy chọn; có thể bên thứ ba hóa nội dung nguồn; có thể nhúng | ❌ Không / có sẵn thông qua các nền tảng địa phương hóa bên ngoài | ❌ Không / có sẵn thông qua các nền tảng địa phương hóa bên ngoài | ❌ Không / có sẵn thông qua các nền tảng địa phương hóa bên ngoài | ❌ Không / có sẵn thông qua các nền tảng địa phương hóa bên ngoài | ❌ Không / có sẵn thông qua các nền tảng địa phương hóa bên ngoài | ❌ Không / có sẵn thông qua các nền tảng địa phương hóa bên ngoài |
207
+ | **Định tuyến được bản địa hóa** | ✅ Có, hỗ trợ các đường dẫn được bản địa hóa ngay từ đầu (hoạt động với Next.js & Vite) | ⚠️ Không tích hợp sẵn, yêu cầu plugin (ví dụ: `next-i18next`) hoặc cấu hình bộ định tuyến tùy chỉnh | ❌ Không, chỉ định dạng thông báo, định tuyến phải thủ công | ⚠️ Không tích hợp sẵn, yêu cầu plugin hoặc cấu hình thủ công | ✅ Tích hợp sẵn, App Router hỗ trợ phân đoạn `[locale]` | ✅ Tích hợp sẵn | ✅ Tích hợp sẵn |
208
+ | **Tạo tuyến đường động** | ✅ Có | ⚠️ Plugin/hệ sinh thái hoặc thiết lập thủ công | ❌ Không được cung cấp | ⚠️ Plugin/thủ công | ✅ Có | ✅ Có | ❌ Không được cung cấp (Nuxt i18n cung cấp) |
209
+ | **Số nhiều** | ✅ Các mẫu dựa trên liệt kê | ✅ Có thể cấu hình (các plugin như i18next-icu) | ✅ (ICU) | ✅ (ICU/messageformat) | ✅ Tốt | ✅ Tốt | ✅ Các quy tắc số nhiều tích hợp sẵn |
210
+ | **Định dạng (ngày tháng, số, tiền tệ)** | ✅ Các trình định dạng được tối ưu hóa (sử dụng Intl bên dưới) | ⚠️ Qua các plugin hoặc cách sử dụng Intl tùy chỉnh | ✅ Trình định dạng ICU | ✅ Helper ICU/CLI | ✅ Tốt (Intl helper) | ✅ Tốt (Intl helper) | ✅ Trình định dạng ngày tháng/số tích hợp sẵn (Intl) |
211
+ | **Định dạng nội dung** | ✅ .tsx, .ts, .js, .json, .md, .txt, (.yaml đang phát triển) | ⚠️ .json | ✅ .json, .js | ⚠️ .po, .json | ✅ .json, .js, .ts | ⚠️ .json | ✅ .json, .js |
212
+ | **Hỗ trợ ICU** | ⚠️ Đang phát triển | ⚠️ Qua plugin (i18next-icu) | ✅ Có | ✅ Có | ✅ Có | ⚠️ Qua plugin (`i18next-icu`) | ⚠️ Qua trình định dạng/trình biên dịch tùy chỉnh |
213
+ | **SEO Helper (hreflang, sitemap)** | ✅ Công cụ tích hợp sẵn: các helper cho sitemap, robots.txt, metadata | ⚠️ Các plugin cộng đồng/thủ công | ❌ Không phải là cốt lõi | ❌ Không phải là cốt lõi | ✅ Tốt | ✅ Tốt | ❌ Không phải là cốt lõi (Nuxt i18n cung cấp các helper) |
214
+ | **Hệ sinh thái / Cộng đồng** | ⚠️ Nhỏ hơn nhưng phát triển nhanh và phản ứng nhanh | ✅ Lớn nhất và trưởng thành | ✅ Lớn | ⚠️ Nhỏ hơn | ✅ Quy mô trung bình, tập trung vào Next.js | ✅ Quy mô trung bình, tập trung vào Next.js | ✅ Lớn trong hệ sinh thái Vue |
215
+ | **Server-side Rendering & Server Components** | ✅ Có, được tối ưu cho SSR / React Server Components | ⚠️ Được hỗ trợ ở cấp trang nhưng cần truyền hàm t trên cây thành phần cho các server component con | ⚠️ Được hỗ trợ ở cấp trang với thiết lập bổ sung, nhưng cần truyền hàm t trên cây thành phần cho các server component con | ✅ Được hỗ trợ, cần thiết lập | ⚠️ Được hỗ trợ ở cấp trang nhưng cần truyền hàm t trên cây thành phần cho các server component con | ⚠️ Được hỗ trợ ở cấp trang nhưng cần truyền hàm t trên cây thành phần cho các server component con | ✅ SSR qua Nuxt/Vue SSR (không RSC) |
216
+ | **Tree-shaking (chỉ tải nội dung được sử dụng)** | ✅ Có, trên mỗi thành phần tại thời điểm xây dựng thông qua các plugin Babel/SWC | ⚠️ Thường tải tất cả (có thể được cải thiện với không gian tên/chia nhỏ ) | ⚠️ Thường tải tất cả | ❌ Không mặc định | ⚠️ Một phần | ⚠️ Một phần | ⚠️ Một phần (với chia nhỏ mã/thiết lập thủ công) |
217
+ | **Tải lười (Lazy loading)** | ✅ Có, theo từng ngôn ngữ / theo từng từ điển | ✅ Có (ví dụ: backends/không gian tên theo yêu cầu) | ✅ Có (tách rời các gói ngôn ngữ) | ✅ Có (nhập danh mục động) | ✅ Có (theo tuyến đường/theo ngôn ngữ), cần quản lý không gian tên | ✅ Có (theo tuyến đường/theo ngôn ngữ), cần quản lý không gian tên | ✅ Có (thông báo ngôn ngữ không đồng bộ) |
218
+ | **Loại bỏ nội dung không sử dụng** | ✅ Có, theo từng từ điển tại thời điểm xây dựng | ❌ Không, chỉ thông qua phân đoạn không gian tên thủ công | ❌ Không, tất cả các thông báo được khai báo đều được đóng gói | ✅ Có, các khóa không sử dụng được phát hiện & loại bỏ khi xây dựng | ❌ Không, có thể được quản lý thủ công với quản lý không gian tên | ❌ Không, có thể được quản lý thủ công với quản lý không gian tên | ❌ Không, chỉ có thể thực hiện qua tải lười thủ công |
219
+ | **Quản lý dự án lớn** | ✅ Khuyến khích tính mô-đun, phù hợp cho các hệ thống thiết kế | ⚠️ Cần kỷ luật tệp tốt | ⚠️ Các danh mục trung tâm có thể trở nên lớn | ⚠️ Có thể trở nên phức tạp | ✅ Mô-đun với thiết lập | ✅ Mô-đun với thiết lập | ✅ Mô-đun với thiết lập Vue Router/Nuxt i18n |
217
220
 
218
221
  ---
219
222
 
220
- ## GitHub STARs
223
+ ## Sao GitHub
221
224
 
222
- Các sao trên GitHub là một chỉ số mạnh mẽ về độ phổ biến của dự án, sự tin tưởng của cộng đồng và tính liên quan lâu dài. Mặc dù không phải là thước đo trực tiếp về chất lượng kỹ thuật, chúng phản ánh số lượng nhà phát triển thấy dự án hữu ích, theo dõi tiến trình của nó và có khả năng áp dụng nó. Để ước tính giá trị của một dự án, các sao giúp so sánh mức độ thu hút giữa các lựa chọn thay thế và cung cấp cái nhìn sâu sắc về sự phát triển của hệ sinh thái.
225
+ Sao GitHub là một chỉ số mạnh mẽ về mức độ phổ biến của dự án, sự tin tưởng của cộng đồng và mức độ phù hợp lâu dài. Mặc dù không phải là thước đo trực tiếp về chất lượng kỹ thuật, chúng phản ánh số lượng nhà phát triển thấy dự án hữu ích, theo dõi tiến trình của nó và có khả năng áp dụng nó. Để ước tính giá trị của một dự án, các ngôi sao giúp so sánh sức hút giữa các lựa chọn thay thế và cung cấp thông tin chi tiết về sự phát triển của hệ sinh thái.
223
226
 
224
- [![Biểu đồ Lịch sử Sao](https://api.star-history.com/svg?repos=formatjs/formatjs&repos=i18next/react-i18next&repos=i18next/i18next&repos=i18next/next-i18next&repos=lingui/js-lingui&repos=amannn/next-intl&repos=intlify/vue-i18n&repo=opral/monorepo&repos=aymericzip/intlayer&type=Date)](https://www.star-history.com/#formatjs/formatjs&i18next/react-i18next&i18next/i18next&i18next/next-i18next&lingui/js-lingui&amannn/next-intl&intlify/vue-i18n&opral/monorepo&aymericzip/intlayer)
227
+ [![Star History Chart](https://api.star-history.com/chart?repos=formatjs/formatjs%2Ci18next/react-i18next%2Ci18next/i18next%2Ci18next/next-i18next%2Clingui/js-lingui%2Camannn/next-intl%2Cintlify/vue-i18n%2Caymericzip/intlayer%2Copral/inlang&type=date&legend=top-left)](https://www.star-history.com/#formatjs/formatjs&i18next/react-i18next&i18next/i18next&i18next/next-i18next&lingui/js-lingui&amannn/next-intl&intlify/vue-i18n&opral/paraglide-js&aymericzip/intlayer)
225
228
 
226
229
  ---
227
230
 
228
- ## Tính tương tác
231
+ ## Khả năng tương tác
229
232
 
230
- `intlayer` cũng có thể giúp quản lý các namespace `react-intl`, `react-i18next`, `next-intl`, `next-i18next`, và `vue-i18n` của bạn.
233
+ `intlayer` cũng có thể giúp quản lý các không gian tên `react-intl`, `react-i18next`, `next-intl`, `next-i18next` và `vue-i18n` của bạn.
231
234
 
232
- Sử dụng `intlayer`, bạn có thể khai báo nội dung của mình theo định dạng của thư viện i18n yêu thích, và intlayer sẽ tạo ra các namespace của bạn tại vị trí bạn chọn (ví dụ: `/messages/{{locale}}/{{namespace}}.json`).
235
+ Sử dụng `intlayer`, bạn có thể khai báo nội dung của mình theo định dạng của thư viện i18n yêu thích và intlayer sẽ tạo các không gian tên của bạn tại vị trí bạn chọn (ví dụ: `/messages/{{locale}}/{{namespace}}.json`).
233
236
 
234
- Tham khảo các tùy chọn [`dictionaryOutput``i18nextResourcesDir`](https://intlayer.org/doc/concept/configuration#content-configuration) để biết thêm chi tiết.
237
+ Tham khảo các [tùy chọn dictionaryOutput và i18nextResourcesDir](https://intlayer.org/doc/concept/configuration#content-configuration) để biết thêm chi tiết.
@@ -36,14 +36,14 @@ history:
36
36
 
37
37
  ## 结果参考:
38
38
 
39
- <iframe
40
- src="https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-nextjs.md"
41
- width="100%"
42
- height="600px"
43
- style="border:none;">
44
- </iframe>
39
+ <ClickToOpenIframe
40
+ src="https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-nextjs.md"
41
+ width="100%"
42
+ height="600px"
43
+ style="border:none;"
44
+ />
45
45
 
46
- > https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-nextjs.md
46
+ > [查看完整的基准测试数据](https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-nextjs.md)
47
47
 
48
48
  查看完整的基准测试仓库[点击这里](https://github.com/intlayer-org/benchmark-i18n)。
49
49
 
@@ -72,7 +72,7 @@ Intlayer 尝试在这些维度上进行优化。
72
72
 
73
73
  为了发现这些问题,我构建了一个免费扫描器,你可以在[这里](https://intlayer.org/i18n-seo-scanner)试用。
74
74
 
75
- <iframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
75
+ <ClickToOpenIframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
76
76
 
77
77
  ## 问题所在
78
78
 
@@ -36,14 +36,13 @@ history:
36
36
 
37
37
  ## 结果参考:
38
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%"
39
+ <ClickToOpenIframe
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
42
  height="600px"
43
- style="border:none;">
44
- </iframe>
43
+ />
45
44
 
46
- > https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_solid.md
45
+ > [查看完整的基准测试数据](https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_solid.md)
47
46
 
48
47
  查看完整的基准仓库 [此处](https://github.com/intlayer-org/benchmark-i18n/tree/main)。
49
48
 
@@ -68,7 +67,7 @@ history:
68
67
 
69
68
  为了快速发现 i18n 泄漏问题,我建立了一个免费扫描仪,可在 [此处](https://intlayer.org/i18n-seo-scanner) 试用。
70
69
 
71
- <iframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
70
+ <ClickToOpenIframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
72
71
 
73
72
  ## 问题所在
74
73
 
@@ -36,14 +36,14 @@ history:
36
36
 
37
37
  ## 结果参考:
38
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%"
39
+ <ClickToOpenIframe
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
42
  height="600px"
43
- style="border:none;">
44
- </iframe>
43
+ style="border:none;"
44
+ />
45
45
 
46
- > https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_svelte.md
46
+ > [查看完整的基准测试数据](https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_svelte.md)
47
47
 
48
48
  查看完整的基准仓库 [此处](https://github.com/intlayer-org/benchmark-i18n/tree/main)。
49
49
 
@@ -67,7 +67,7 @@ history:
67
67
 
68
68
  为了快速发现 i18n 泄漏问题,我建立了一个免费扫描仪,可在 [此处](https://intlayer.org/i18n-seo-scanner) 试用。
69
69
 
70
- <iframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
70
+ <ClickToOpenIframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
71
71
 
72
72
  ## 问题所在
73
73
 
@@ -36,14 +36,14 @@ history:
36
36
 
37
37
  ## 结果参考:
38
38
 
39
- <iframe
40
- src="https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-tanstack.md"
41
- width="100%"
39
+ <ClickToOpenIframe
40
+ src="https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-tanstack.md"
41
+ width="100%"
42
42
  height="600px"
43
- style="border:none;">
44
- </iframe>
43
+ style="border:none;"
44
+ />
45
45
 
46
- > https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-tanstack.md
46
+ > [查看完整的基准测试数据](https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-tanstack.md)
47
47
 
48
48
  查看完整的基准测试仓库[点击这里](https://github.com/intlayer-org/benchmark-i18n/tree/main)。
49
49
 
@@ -68,7 +68,7 @@ history:
68
68
 
69
69
  为了快速发现 i18n 泄漏问题,我建立了一个免费扫描器,你可以在[这里](https://intlayer.org/i18n-seo-scanner)试用。
70
70
 
71
- <iframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
71
+ <ClickToOpenIframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
72
72
 
73
73
  ## 问题所在
74
74
 
@@ -36,14 +36,14 @@ history:
36
36
 
37
37
  ## 结果参考:
38
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>
39
+ <ClickToOpenIframe
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
+ />
45
45
 
46
- > https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_vue.md
46
+ > [查看完整的基准测试数据](https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-vite_vue.md)
47
47
 
48
48
  查看完整的基准仓库 [此处](https://github.com/intlayer-org/benchmark-i18n/tree/main)。
49
49
 
@@ -67,7 +67,7 @@ history:
67
67
 
68
68
  为了快速发现 i18n 泄漏问题,我建立了一个免费扫描仪,可在 [此处](https://intlayer.org/i18n-seo-scanner) 试用。
69
69
 
70
- <iframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
70
+ <ClickToOpenIframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
71
71
 
72
72
  ## 问题所在
73
73