웹로드 속도를 최적화하기위한 jQuery 이미지 지연로드 솔루션 여전히

Question

SmashingMagazine, Noupe 및 기타 이미지 레이아웃에 게으른로드를 구현하는 몇 가지 큰 디자인 블로그가 있습니다. 로드 시간을 최적화하고 서버 리소스를 절약하는 데 도움이된다고 생각합니다.

그렇다면 jQuery lazyload 이미지를 보러 왔지만 새 브라우저에서는 플러그인이 작동하지 않고 작동하지 않습니다. 알고 싶습니다 lazyload 여전히 웹 사이트를 최적화하는 것이 좋습니다?

Answer 1

얼마나 많은 이미지가 있고 얼마나 중요한지에 따라 달라 지므로 성능 향상에 대한 여러 가지 해결책이 있으며 (대부분 you can find a presentation about the topic here) 대부분 웹 사이트 구성 방법과 필요에 따라 다릅니다.

웹 사이트에 여러 다른 장소 (like amazon does)에서 재사용되는 작은 아이콘이 많이있는 경우 CSS 스프라이트를 사용할 수 있으며 HTML에서 직접 인코딩 된 이미지를 사용할 수 있습니다. 게으른로드를 수행 할 수 있으므로 상황에 따라 다릅니다.

게으른로드 플러그인으로 돌아가서 javascript 오류 또는 그런 것들을 찾으십시오. 작동하지 않는다면, 당신 자신을 위해 게으른 로더를 만들 수도 있습니다. 복잡하지 않아야합니다. 여기 가능성이 일할 수있는 해킹 (나는 그것을 실행하지 않았다, 그래서 나는 확신 할 수 없다) : 자바 스크립트에서

<img lazy_loaded_src="/some_image.jpeg" class="lazy_loaded"/> 

: 그리고

이

jQuery("img.lazy_loaded").each(function() { 
    var image = jQuery(this); 
    image.attr("src", image.attr("lazy_loaded_src")); 
}); 

이 같은 게으른 부하가 있어야합니다 페이지가로드 된 후 수행하는 한 동작.

Answer 2

이상한 소리가났다. jQuery 버전과 충돌 할 수 있습니다.

나는 이미지의 게으른로드를 사용합니다. 그것은 특정 상황에서 사용하는 좋은 기술입니다.