본문 바로가기

나의 FE피봇이야기/HTML || CSS

[HTML] Loading="lazy" 렌더링 속력 올리기

Lazy loading is a strategy to identify resources as non-blocking (non-critical) and load these only when needed. It's a way to shorten the length of the critical rendering path, which translates into reduced page load times.

From MDN

 

지연 로딩은 리소스를 비차단(중요하지 않음)으로 식별하고 필요할 때만 로드하는 전략입니다. 이는 중요한 렌더링 경로의 길이를 단축하여 페이지 로드 시간을 단축하는 방법입니다.

 

적용

지연 로딩은 애플리케이션의 여러 순간에 발생할 수 있지만 일반적으로 스크롤 및 탐색과 같은 일부 사용자 상호 작용에서 발생합니다.

 

https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading