⚡ Bolt: 이미지 디코딩 최적화로 렌더링 블로킹 방지#59
Conversation
Adds decoding="async" attribute to all img tags to prevent image decoding from blocking the main thread.
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
Adds decoding="async" attribute to all img tags to prevent image decoding from blocking the main thread.
1 participant
💡 What
모든
<img>태그에decoding="async"속성을 추가했습니다.🎯 Why
브라우저가 이미지를 파싱하고 디코딩하는 작업은 기본적으로 메인 스레드에서 동기적으로 처리됩니다. 이로 인해 용량이 큰 이미지(특히 LCP에 영향을 주는 이미지나 lazy loading되지 않는 이미지)가 렌더링될 때 다른 렌더링 작업이나 중요한 스크립트 실행이 차단(Blocking)되는 성능 저하 현상이 발생할 수 있습니다.
📊 Impact
🔬 Measurement
브라우저 개발자 도구의 Performance 탭에서 새로고침 프로파일링을 진행하면, 기존 Main Thread에서 발생하던
Image Decode작업 덩어리가 분리되어 병렬 처리되거나 차단 시간이 줄어든 것을 확인할 수 있습니다.PR created automatically by Jules for task 16093582396275708342 started by @seonghobae