브라우저가 CSS 배경 이미지를 캐싱하고 있습니까?

다른 요소 (스프라이트 이미지)에 사용 된 동일한 이미지가있을 때 일반적으로 새 HTTP 요청이므로 이미지를 다시 호출하지 않습니다.브라우저가 CSS 배경 이미지를 캐싱하고 있습니까?

차라리 사용

element1 { 
    background: url(someImage.png); 
} 

element2 { 
    background-image: inherit; 
}

이 절약 HTTP 요청인가?

또는 브라우저가 스마트 내가 사용할 수있는 경우

는 :

element1 { 
    background: url(someImage.png); 
} 

element2 { 
    background: url(someImage.png); 
}

브라우저는 새로운 HTTP 요청을 예정? 또는 이미이 이미지를 캐싱 한 것을 알고 있습니까?

질문 : 예제 1을 사용하여 무언가를 얻습니까?

출처

2010-01-20 adardesign

브라우저에 따라 다릅니다. – jball

설명하는 시나리오에서 브라우저는 본질적으로 한 페이지에서 여러 번 동일한 이미지를 참조하므로 거의 확실하게 캐시됩니다.

다른 페이지에서 대답은 브라우저에 따라 다르며 서버가 보내는 만료 헤더는 해당 에이전트의 캐싱 동작에 영향을줍니다.

출처

2010-01-20 18:27:39 JasonTrue

그래서'background-image : inherit; '를 사용하여 얻는 것이 무엇입니까? – adardesign

IE6 및 IE7 사용자가 더 나아 보이지 않는가? 그렇지 않아. 그리고 상속은 첫 번째 CSS 선택기가 두 번째 CSS 선택기를 요소에 적용하면 효과가 있어야합니다. 두 가지가 일치하지 않거나 첫 번째가 일치하지 않으면 아무것도 얻지 못합니다. – JasonTrue

예, 브라우저는 CSS 파일의 동일한 이미지에 대한 두 번째 참조를 캐시에서로드합니다. Firebug를 사용하면 브라우저가 만든 모든 HTTP 요청을 볼 수 있습니다.

출처

2010-01-20 18:27:15 jeffreyveon

그래서 나는 background-image를 사용하는 것으로부터 무엇이든 얻는다 : 상속; – adardesign

아니요, 아무런 차이가 없습니다. – jeffreyveon

단순화하고 리소스를 캐시하고 대역폭을 절약하려면 웹 사이트 루트에 appcache.appcache 파일을 만들어야합니다. This link은 appcache 만들기에 대한 자습서를 제공합니다. 사용자가 사이트를 두 번 이상 방문한 경우 HTTP 요청을 저장하고 이미 캐시에 동일한 이미지가 두 번 요청되면 저장합니다.

해피 캐싱!

출처

2012-09-04 19:56:42

브라우저가 CSS 배경 이미지를 캐싱하고 있습니까?

답변

관련 문제