프리로딩
-
이미지 프리로딩(Image Preloading)Web/Optimization 2021. 9. 23. 19:38
갤러리와 같은 형태의 페이지, 즉 이미지가 많이 필요한 페이지의 경우에는 종종 이미지 최적화가 곧 해당 페이지의 성능 최적화 그 자체인 경우가 많다. 이번에 프로젝트로 진행한 Babble 웹페이지도 마찬가지. 이런 경우에 이미지 로딩을 최적화하기 위해 자주 사용되는 방법 중에 하나가 바로 Image Preloading이다. Image Preloading은 유저가 이미지를 요청하기 전에 미리 이미지를 다운받아 캐시에 저장하고, 필요할 때 캐시에서 바로바로 꺼내쓰는 것을 의미한다. 브라우저가 해당 페이지에서 요청한 이미지, CSS, JS 등을 캐싱하여 사용한다는 특징을 이용한 테크닉이다. 초기 페이지에 보여질 이미지 로딩과 관련된 테크닉은 아닌 것 같고, 유저가 특정 버튼을 클릭하거나 다른 페이지로 갈 때 ..