[vue] lazyload 사용하기

페이지에 이미지가 많을 경우 하나의 페이지를 호출할 때 모든 이미지를 호출하도록 한다면 그 페이지는 로딩 속도가 매우 느릴 수 있습니다. cdn으로 호출한다고 해도 용량이 큰 이미지가 많이 호출 될 경우 느릴수있습니다. 그래서 페이지 로딩 시 경량화 이미지 혹은 이미지를 호출하지 않고 이미지가 있는 영역에 갔을 때 로드될 수 있도록 하는 기능이 lazyload 입니다. 설치부터 사용방법까지 작성해봅니다. 1. 설치 npm install vue-lazyload --save 2. 사용방법 - main.js 에 라이브러리 로드 // lazyload 라이브러리 로드 import VueLazyload from 'vue-lazyload'; // vue app 에 VueLazyload 사용 app.use(VueLaz..

2023.09.04