2011-09-23 7 views
0

스택 오버플로에 사용할 수있는 많은 사전로드 스크립트 예제가 있지만 브라우저에 미리 이미지가 캐시에 미리로드되어 있는지 확인한 다음 해당 이미지가 캐시되지 않았거나 시작되지 않았는지 확인하는 방법이 있습니다. .load() 함수로 이미지를 미리로드하고 브라우저에 이미지를 넣으시겠습니까?캐시에서 jQuery 이미지 미리로드

답변

1

브라우저가 이미지를 이미 가지고 있다면 더 이상 중요하지 않게 이미지를 다시로드하려고 시도하지 않을 것입니다 (서버에 헤더를 요청하고 이미지가 변경되지 않았 음을 확인합니다).).

원하는 경우 'far futures expires'헤더를 이미지에 넣을 수 있습니다. 따라서 브라우저는 서버를 확인하려고하지 않고 캐시에있는 이미지가 있다고 가정합니다. 이것은 당신이 요구 한 것을 효과적으로 할 것입니다.

브라우저 (및 프록시) 웹 페이지를 빠르게로드하고, HTTP 요청의 수와 크기를 줄이기 위해 캐시를 사용

나는 Yahoo이 더 나은 내가 할 수있는 것보다라고 생각합니다. 웹 서버는 구성 요소를 캐시 할 수있는 시간을 클라이언트에 알리기 위해 HTTP 응답의 Expires 헤더를 사용합니다. , 목을, 서버가 아파치 2010년 4월 15일 그리니치 표준시 20시 00분 0초

경우 : 이것은 2010 년은 이 만료, 먼 미래가 이 응답 년 4 월 15 일까지 오래된되지 않습니다 브라우저를 말하고, Expires 헤더입니다 ExpiresDefault 지시문을 사용하여 만료 날짜를 현재 날짜와 비교하여 설정하십시오. ExpiresDefault 지시문의이 예는 요청 시간 인 에서 만료 날짜를 10 년으로 설정합니다. ExpiresDefault "access plus 10 years"

먼 미래 Expires 헤더를 사용하는 경우 구성 요소가 변경 될 때마다 구성 요소의 파일 이름을 변경해야합니다. Yahoo! 이 단계를 빌드 프로세스의 일부로 자주 사용합니다. 버전 숫자가 구성 요소의 파일 이름에 포함됩니다 (예 : yahoo_2.0.6.js).

기본적으로 헤더를 넣을 수 있습니다 Expires: Thu, 31 Dec 2030 0:00:00 GMT 및 브라우저는 또 다른 29 년 정도를 위해 이미지를 다시 찾지 않을 것입니다. 물론 이것은 이미지를 변경하면 이미지의 이름을 바꾸어야한다는 것을 의미합니다.

+0

나는 당신이 말하는 것을 이해하고 있지만 이미지가 브라우저에 이미 캐시 된 경우 javascript로 확인할 수 있으므로 .load() 이벤트를 실행할 필요가 없습니다. 로딩 후 내 이미지가 모두 희미 해지고 달성하려고하는 것은 : 이미지가 브라우저에서 .load() 이벤트를 발생시키지 않고 이미 캐싱되어 브라우저에 채워져 자바 스크립트 fadeIn이 실행되지 않도록하는 경우입니다. 행동을 취하지 마라. – Alex

관련 문제