요소 캐시 상태
IMS : if-modified-since
ETAG : if-none-match
구형 IE 외의 요즘 브라우저들은 새로고침시 문서 내 요소에 대해 다시 묻지도 않고 캐시를 이용하기 때문에 304 항목은 거의 의미 없습니다.
요소를 직접 열고 새로고침하면 각각 확인 됩니다. css 열기
본 테스트에서는 304 검사는 하지만, 304로 응답 가능한 상황에서 304로 응답하지않고 IMS, ETAG 를 본문에 포함합니다.
| 요소 | 시간 | 304 |
|---|---|---|
| html | 2024-04-19 21:49:24 | |
| css | ||
| css lazyload | ||
| js | ||
| js lazyload |
주소 직접 이동
새로고침
문서가 수정되었는지
if-modified-since,
if-none-match
요청을 하고 304 가 오면 캐시를 이용합니다.
문서에 포함된 요소들은 캐시를 이용합니다.
파이어폭스 : js 의 경우만 변경되었는지 요청을 합니다.
IE : 문서 내의 모든 요소에 대해 변경검사 요청을 합니다.
문서에 포함된 요소들은 캐시를 이용합니다.
파이어폭스 : js 의 경우만 변경되었는지 요청을 합니다.
IE : 문서 내의 모든 요소에 대해 변경검사 요청을 합니다.
강력 새로고침
if-modified-since 요청 없이 새로 불러오지만, 문서 불러오기가 완료되는 시점에서 다시 캐시를 이용합니다.
requirejs, lazyload 등 여러 경우에 새로고침이 되지 않는 요소가 발생합니다.
requirejs, lazyload 등 여러 경우에 새로고침이 되지 않는 요소가 발생합니다.
캐시 비우기 및 강력 새로고침
문서에 이용되는 요소가 무엇인지 미리 알고 구별하는것이 안되기 때문에 브라우저의 캐시를 전체 삭제합니다.
탭 두개 다른 사이트로 띄워놓고 네트워크 탭을 연 후,
size 란에 (disk cache, memory cache) 라고 표기되는것을 확인하고,
한 탭에서 캐시 비운 후 옆탭에서 새로고침해서 size 란을 확인하면 됩니다.
탭 두개 다른 사이트로 띄워놓고 네트워크 탭을 연 후,
size 란에 (disk cache, memory cache) 라고 표기되는것을 확인하고,
한 탭에서 캐시 비운 후 옆탭에서 새로고침해서 size 란을 확인하면 됩니다.
개발자 도구를 연 후 새로고침 버튼을 우클릭하면 아래와 같은 메뉴가 나옵니다.
위에서 파악한 강력 새로고침으로 안되는 요소는 캐시 비우기까지 해야 새로 받아올 수 있습니다.
