Lazy loading

Lazy Loading 이란?

• 프로그래밍과 소프트웨어 개발에서 자주 사용되는 기법 중 하나로, 데이터나 객체를 실제로 필요로 하는 순간까지 그 로딩을 지연시키는 방식
• 중요도가 떨어지거나 당장 화면에 보이지 않는 요소들의 로딩을 우선적으로 시행하지 않으면서 웹페이지 로딩 퍼포먼스를 최적화 하는 기술
• 데이터 세트나 자원 집약적인 객체를 다룰 때 유용하며, 웹 개발, 모바일 애플리케이션, 데스크톱 소프트웨어 등 다양한 분야에서 적용된다.

웹페이지를 로딩하는 기존 방식은 모든 리소스들을 한번에 받아서 최초 로딩시간이 길었다. 이러한 로딩 시간 증가는 인터넷 연결 속도가 느린 지역이나 느린 디바이스를 사용할 경우 체감하는 로딩속도가 매우 느렸다.

이러한 문제를 해결하기 위해 사용하는 기술이 Lazy loading이며, 당장 필요한 컨텐츠들을 먼저 로딩하고, 다른 리소스들은 필요해 질 때 로딩시켜 웹 페이지 속도를 향상시킬 수 있다.

Lazy loading은 주로 크기가 큰 자원(이미지,영상)을 로딩하는데 사용되며, placeholder, 또는 해상도 낮은 썸네일로 보여지다가. 스크롤을 통해 시야에 들어오는 경우 대체하여 원본을 로딩하게 된다.

장점

1. 실제로 필요할 때 까지 객체를 생성하지 않아 사용하지 않는 리소스에 대한 메모리 사용을 최적화한다.
2. 애플리케이션의 초기 로딩시간을 단축하는데 도움을 준다.
3. 당장 표현할 필요가 없는 크기가 큰 자원(이미지, 영상) 등의 리소스를 나중에 로딩하여 최초 데이터 전달 양을 감소시켜 대역폭 사용을 줄일 수 있다.

단점

1. Lazy loading은 성능 최적화에 큰 이점을 제공하지만, 잘못 사용되었을 경우 사용자 경험을 저해할 수 있다. ex) 웹페이지에서 이미지 로딩이 너무 늦어져서 사용자가 이미지를 기다리는 경우
2. SEO (검색 엔진 최적화)
   • 웹 페이지에 lazy loading을 구현할 때는 검색 엔진이 콘텐츠를 적절히 인덱싱할 수 있도록 주의해야 한다.
   • Lazy loading된 리소스는 placeholder 콘텐츠여서 웹사이트를 크롤링하는 검색 엔진은 리소스의 내용을 알아보지 못해 무시당할 수 있다.
   • 해결 방안은 lazy load하는 콘텐츠에 대한 링크를 제공하여 검색엔진이 링크를 따라가서 검색한 내용을 색인화 하여 찾을 수 있게한다.

https://seo-tory.tistory.com/84
https://scarlett-dev.gitbook.io/all/it/lazy-loading