이미지 lazyload 방법의 종류들
링크
https://sir.kr/g5_tip/14037 (86) https://frontdev.tistory.com/entry/Image-Lazy-Loading-%EA%B8%B0%EB%B2%95 (122)
얼마전에 링크1에 있는 그누보드5.4에 lazyload 적용하기라는 팁을 작성했는데요.
링크2에 보니 생각보다 방식이 여러가지더라구요.
링크1에 소개드린 내용은 loading.gif나 대신할 투명이미지를 넣고
스크롤해서 이미지가 보여질 때 다운로드 받는 형식이었습니다.
스크롤할때 보여지는 방식은 똑같구요.
처음 보여질 이미지에 대한 내용이 중요한 듯 합니다.
1. 지배적인 색깔을 뽑아서 같은 이미지 크기로 보여주다가 원본 이미지 출력

2. 초저화질의 이미지 썸네일(LQIP)을 생성해서 보여주다가 원본 이미지 출력

두가지가 제일 무난한 것 같습니다.
워드프레스에서는 LQIP 형식을 지원하는 플러그인이 활성화되어 있습니다.
물론 유료죠 ㅎㅎ
특이하게도 openlitespeed 웹서버를 쓰면 LSCACHE 플러그인에서 무료로 지원하기도 하지만요.
그누보드 플러그인으로도 이런 방식의 이미지 관리 도구가 나오면 좋을 것 같습니다.
위 링크는 오픈라이트스피드 웹서버에 LSCACHE 플러그인으로 LQIP 형식으로 지원되는 예시입니다.
댓글 4개
5년 전
저런 기능의 플러그인을 만들면... 음... 제가 쓸게요 ^^
유료라면... 음... 음... 음... 몇 만원이라면 투자할 가치는 있을 듯요 ^^
유료라면... 음... 음... 음... 몇 만원이라면 투자할 가치는 있을 듯요 ^^
똥싼너구리
5년 전
https://appelsiini.net/projects/lazyload/
제가 예전에 썼던 방식입니다.
여기다가 기본 이미지를 동글동글 돌아가는 이미지를 넣었었죠..
제가 예전에 썼던 방식입니다.
여기다가 기본 이미지를 동글동글 돌아가는 이미지를 넣었었죠..
게시글 목록
| 번호 | 제목 |
|---|---|
| 1717479 | |
| 1717473 | |
| 1717470 | |
| 1717463 | |
| 1717452 | |
| 1717438 | |
| 1717431 | |
| 1717422 | |
| 1717414 | |
| 1717412 | |
| 1717407 | |
| 1717401 | |
| 1717393 | |
| 1717386 | |
| 1717379 | |
| 1717378 | |
| 1717365 | |
| 1717364 | |
| 1717360 | |
| 1717359 | |
| 1717346 | |
| 1717344 | |
| 1717333 | |
| 1717327 | |
| 1717313 | |
| 1717312 | |
| 1717310 | |
| 1717307 | |
| 1717306 | |
| 1717304 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기