인프런 커뮤니티 질문&답변

Jon님의 프로필 이미지
Jon

작성한 질문수

프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 2

4-4) 이미지 지연(lazy) 로딩 (react-lazyload)

lazy load 의 layout shift에 대하여

해결된 질문

작성

·

277

1

이강의에서는 이전강의에서 layout shift 에 대한 처리를 해서 현재는 발생하지 않고있지만, 보통이라면 lazy loading 을 할때 layout shift 가 반드시 따라올것같은데 image lazy loading시에는 선작업으로 무조건 layout shift를 없애주어야하는것일까요?

답변 1

0

유동균님의 프로필 이미지
유동균
지식공유자

안녕하세요, Jon 님,

lazy loading과 layout shift의 관계에 대해서 질문을 주셨는데요,

선후를 따지기는 애매한 부분이 있겠지만,
말씀하신대로 lazy loading을 하게되면 layout shift가 어쩔 수 없이 따라오게 됩니다.
없던 요소를 늦게 넣는 거니까요.

그래서 lazy loading 을 적용할 때는 layout shift에 대해서 고려를 해주셔야 합니다.

때에 따라서는 해당 layout에 크게 영향을 주지 않는 경우도 있지만,
아주 중요한 위치에서 layout shift가 발생하게되어 사용성에 큰 문제를 줄 수도 있습니다.

물론, layout shift에 대응을 할 건지 말 건지는 개발자의 결정이겠지만,
사용성을 위해 가능하면 대응을 해주는게 좋겠죠?

답변이 도움되셨길 바라며, 강의에 관심을 가져주셔서 감사합니다.

Jon님의 프로필 이미지
Jon

작성한 질문수

질문하기