YUI-ImageLoader Utility
javascript/yui 2008/04/01 15:22 |출처 :http://developer.yahoo.com/yui/imageloader/
YUI 의 ImageLoader 유틸리티는 페이지 내에 지금 당장 필요하지 않은 이미지들은 로딩하는 것을 잠시 뒤로 미루어 페이지 로딩 속도를 높이게 해주는 툴이다.
따라서 불필요한 로딩을 줄여준다.
대신 그 이미지가 필요한 순간 이미지를 호출한다.
이미지로더는 이미지 로딩을 위한 트리거와 초기화 시간제한 설정을 사용해 유저가 이미지를 보려는 시도전에 이미지를 로딩시켜준다.
예컨데... 옥션같은 쇼핑몰에 스크롤압박이 심한 상품페이지를 많이 봐왔을 것이다.
이 페이지를 열때 아래 보이지도 않는 부분이 로딩되는 동안 페이지가 버벅거린 경험들이 있을 것이다.
이럴때 유저 화면에 표지되는 이미지 부분만 먼저 로딩을 해서 페이지를 바로 보이게 하고 유저가 스크롤을 하려는 순간 아래부분 이미지를 가져오게 하는 것이다.
그렇게하면 유저가 느끼는 체감 속도가 향상되고 , 보이지도 않는 부분을 로딩하느라 불필요한 부하도 줄일 수 있다.
브라우저는 한 호스트당 2개의 커넥션만 동시연결을 허용한다.(권장사항) 이미지로더를 사용하면 프로그래머가 이를 효율적으로 사용할 수 있게된다.
예제보기
특히,
http://developer.yahoo.com/yui/examples/imageloader/imgloadfold.html
이 예제는 흥미롭다.
차이점을 알아보려면 창을 줄여서 아래이미지가 안보이게 한 후에 페이지를 다시 리로드 해보면 된다.
그후에 아래로 스크롤을 하거나 리사이즈를 해서 아래 이미지가 보이게 영역을 넓히면 아래이미지를 그때 로딩하는 것을 알 수 있다.
이올린에 북마크하기
이올린에 추천하기'javascript > yui' 카테고리의 다른 글
| YUI Logger 를 동적으로 로드하는 북마크릿 (0) | 2008/07/08 |
|---|---|
| YUI-ImageLoader Utility (0) | 2008/04/01 |
| YUI2.5.0 나왔다. (0) | 2008/02/29 |
| YUI 2.4.0 Released — Selector, Charts, Profiler, Script/CSS Get, and JSON Support (0) | 2007/12/05 |
| YUI2.3.0 가 릴리즈 되었다. (0) | 2007/08/22 |
| Cross Domain AJAX Request (4) | 2007/07/13 |
댓글을 달아 주세요