diff --git a/.jules/bolt.md b/.jules/bolt.md
index f74ef2f..8de11f5 100644
--- a/.jules/bolt.md
+++ b/.jules/bolt.md
@@ -1,3 +1,6 @@
## 2024-06-20 - Unnecessary initial DOM updates for default language
**Learning:** The simple static i18n implementation runs `node.textContent = dict[node.dataset.i18n]` for every translatable node on the initial script load, even when the HTML is already written in the target language (Korean). This creates unnecessary layout/paint operations and blocking time on the main thread for elements that don't need text changes.
**Action:** Always check if the current value matches the desired value before updating the DOM (`node.textContent !== newText`), and add early exits when setting state to the same value to avoid redundant DOM traversal and writes.
+## 2024-06-27 - 초기 언어 로드 시 불필요한 DOM 탐색 제거
+**Learning:** 초기 로드 시 요청된 언어가 HTML의 기본 언어(ko)와 동일한 경우, 모든 DOM 텍스트 노드를 탐색하고 치환하는 불필요한 작업을 생략하면 성능이 향상됨을 확인했습니다.
+**Action:** `isInitialDefault` 조건을 추가하여 초기 로드 시 불필요한 DOM 순회 코드가 실행되지 않도록 개선했습니다.
diff --git a/CHANGELOG.md b/CHANGELOG.md
new file mode 100644
index 0000000..e5fc107
--- /dev/null
+++ b/CHANGELOG.md
@@ -0,0 +1,5 @@
+# CHANGELOG
+
+## [Unreleased]
+- **성능 개선**: `i18n.js`에서 초기 로드 시 기본 언어가 한국어(ko)인 경우 불필요한 DOM 순회 및 텍스트 업데이트를 생략하도록 개선했습니다.
+- **테스트 추가**: 다국어 처리 로직의 무결성을 검증하기 위해 `test_i18n.html` 테스트 파일을 추가했습니다.
diff --git a/i18n.js b/i18n.js
index 2393774..00e14cb 100644
--- a/i18n.js
+++ b/i18n.js
@@ -315,8 +315,7 @@ function setLanguage(lang) {
const dict = messages[lang] || messages.ko;
- if (!i18nNodes) {
- i18nNodes = document.querySelectorAll("[data-i18n]");
+ if (!langButtons) {
langButtons = document.querySelectorAll("[data-lang]");
metaDesc = document.querySelector('meta[name="description"]');
ogDesc = document.querySelector('meta[property="og:description"]');
@@ -346,13 +345,22 @@ function setLanguage(lang) {
}
}
- // Only update textContent if it actually changed to avoid layout recalculations
- i18nNodes.forEach((node) => {
- const newText = dict[node.dataset.i18n];
- if (newText && node.textContent !== newText) {
- node.textContent = newText;
+ // ⚡ Bolt: 기본 언어로 초기 로드 시 불필요한 DOM 텍스트 읽기 및 탐색 생략 (성능 개선)
+ const isInitialDefault = lang === "ko" && !i18nNodes;
+
+ if (!isInitialDefault) {
+ if (!i18nNodes) {
+ i18nNodes = document.querySelectorAll("[data-i18n]");
}
- });
+
+ // Only update textContent if it actually changed to avoid layout recalculations
+ i18nNodes.forEach((node) => {
+ const newText = dict[node.dataset.i18n];
+ if (newText && node.textContent !== newText) {
+ node.textContent = newText;
+ }
+ });
+ }
langButtons.forEach((button) => {
const pressed = String(button.dataset.lang === lang);
diff --git a/test_i18n.html b/test_i18n.html
new file mode 100644
index 0000000..c8e71fb
--- /dev/null
+++ b/test_i18n.html
@@ -0,0 +1,63 @@
+
+
+
+
+ i18n Test
+
+
+
+
+
+
+
+
+
+