diff --git a/.jules/bolt.md b/.jules/bolt.md index 983f48a..c131f8b 100644 --- a/.jules/bolt.md +++ b/.jules/bolt.md @@ -7,3 +7,6 @@ ## 2026-07-05 - content-visibility와 scrollbar jumping 방지 **Learning:** 긴 단일 페이지(static site)에서 `content-visibility: auto`를 사용하여 오프스크린 섹션의 렌더링을 최적화할 때, `contain-intrinsic-size`를 함께 지정하지 않으면 스크롤바가 튀거나 레이아웃 시프트가 발생할 수 있습니다. **Action:** 항상 길이 기반 폴백(예: `contain-intrinsic-size: 600px;`)을 선행하고, 브라우저가 실제 높이를 기억할 수 있도록 `auto` 키워드를 포함한 속성을 설정합니다. 섹션별 실제 높이에 맞춰 크기를 조정합니다. +## 2026-07-07 - 이미지 디코딩으로 인한 메인 스레드 차단 방지 +**Learning:** 페이지 로드 시 크기가 큰 SVG나 PNG 이미지의 디코딩 작업이 메인 스레드를 차단하여 다른 중요한 렌더링 작업이나 스크립트 실행을 지연시킬 수 있음을 확인했습니다. +**Action:** 모든 `` 태그(특히 LCP에 영향을 주거나 lazy loading되지 않는 이미지)에 `decoding="async"` 속성을 추가하여 브라우저가 이미지 디코딩 작업을 백그라운드에서 비동기적으로 처리하도록 합니다. diff --git a/index.html b/index.html index d188886..443c49c 100644 --- a/index.html +++ b/index.html @@ -29,7 +29,7 @@