지연 로딩

지연 로딩은 리소스가 필요할 때까지 로딩을 미루는 프로그래밍 기법입니다. 일반적인 예로, 사용자가 페이지에서 이미지가 있는 위치까지 스크롤하면 그때 이미지를 로딩하는 웹페이지가 있습니다. 지연 로딩은 웹과 모바일 및 데스크톱 애플리케이션 같은 소프트웨어 프로그램에서 사용됩니다.

웹에서의 지연 로딩

웹페이지 내 이미지에 지연 로딩을 적용하면 로딩 시간이 빨라질 수 있습니다. 브라우저가 보이지 않는 이미지를 로딩할 필요가 없기 때문입니다. 사용자가 페이지를 스크롤하면 이미지가 동적으로 로딩됩니다. 이를 위해 각 이미지의 위치를 감지하고 이미지가 브라우저 창의 표시 영역 안에 있는지 확인하는 JavaScript를 사용합니다. 사용자가 이미지까지 아래로 스크롤하면 JavaScript가 웹 서버에 리소스를 요청하고 페이지에 이미지를 표시합니다. 사용자가 아래로 스크롤하지 않으면 이미지는 로딩되지 않습니다.

JavaScript 파일, CSS, 심지어 HTML 자체와 같은 다른 리소스의 로딩을 미루는 것도 가능합니다. 예를 들어 웹 개발자는 웹페이지에서 "above-the-fold" 콘텐츠, 즉 일반적인 브라우저 창의 높이 안에서 볼 수 있는 콘텐츠에 어떤 CSS 스타일이 필요한지 결정할 수 있습니다. 개발자는 이러한 스타일을 "인라인 스타일"로 구현하거나 웹페이지의 HTML 안에 정의할 수 있습니다. JavaScript는 페이지가 로딩된 후 또는 사용자가 스크롤을 시작할 때 추가 CSS를 로딩하는 데 사용됩니다.

동영상의 지연 로딩도 웹에서 널리 사용됩니다. 동영상 파일은 일반적으로 웹페이지에서 로딩되는 가장 큰 리소스이므로 특히 효과적입니다. 웹 서버는 동영상 전체를 클라이언트의 장치로 보내는 대신 사용자가 동영상을 시청하는 동안 동영상의 작은 부분만 보냅니다. YouTube와 Vimeo 같은 인기 동영상 공유 웹사이트는 대역폭을 줄이고 사용자가 필요 이상으로 많은 동영상 콘텐츠를 다운로드하는 것을 방지하기 위해 지연 로딩을 사용합니다. 이는 모바일 데이터 요금제처럼 데이터 사용량이 제한된 인터넷 연결을 사용하는 사람에게 특히 유용합니다.

소프트웨어 프로그램에서의 지연 로딩

지연 로딩은 웹에서 점점 더 널리 사용되고 있지만, 오랫동안 소프트웨어 개발에 사용되어 왔습니다. 예를 들어 운영 체제는 폴더에서 현재 보이는 아이콘에 대해서만 미리 보기 이미지를 표시할 수 있습니다. 마찬가지로 이미지 보기 프로그램은 사진 보관함에서 현재 보이는 이미지만 로딩할 수 있습니다. 프로그램이 불필요한 데이터를 로딩하지 않으므로 메모리를 덜 사용하고 애플리케이션 성능이 향상됩니다.