크롬 지연 캐시 된 SVG 파일로드 중

표시를 위해 SVG 리소스 파일을 요청하는 자바 스크립트 코드가 있습니다.크롬 지연 캐시 된 SVG 파일로드 중

SVG는 변경되지 않습니다. 하나의 임베디드 jpeg 이미지 (data:image/jpeg:base64)가 들어있는 약 100kb입니다. 가능한 경우 브라우저에 캐시를 저장하고 싶습니다. SVG를로드

코드는이 2 초 정도 걸립니다 것이

$(btn).click(function(){ 
    console.log("loading..."); 
    $(element).load("mri/t1/axi/t1_axi_100.svg", function(resp, status, xhr){ 
     console.log("loaded"); 
     ... 
    }); 
});

같은 것입니다. 이 시간 지연은 모두 "로드 중 ..."과 "로드 된"사이에 있습니다. 프로파일 링 (chrome dev 도구 타임 라인)에서 처리가 없다는 것을 알 수 있습니다. 왼쪽 호출 스택은 "click"이벤트를위한 것이고, 오른쪽 호출 스택은 "loaded"핸들러를위한 것입니다. 그 사이에 "mri/t1/axi/t1_axi_100.svg"이 로딩되는 틈이 있습니다 (상단 근처의 긴 파란색 바). 내가 크롬 개발 도구에서 네트워크에서 볼 때

그러나, 나는 "다운로드"각 단계는 < 4 밀리 갔다 것을 알 수있다. (오른쪽에 좁은 파란색 막대, 큰 격차를 참고) 또한 캐싱이 일 것을 여기에서 볼 수 있습니다

(디스크 캐시에서 svgs을, 메모리 캐시에서 사진과 임베디드).

svg에 대한 4ms의 내역이 여기에 표시됩니다.

왜 2 초의 지연이 있습니까? 내 코드는 4ms가 걸리고 캐시에서 검색하는 데 4ms가 걸린 것처럼 보입니다! "네트워크"탭에 표시

헤더는 다음과 같습니다

General 
    Request URL:http://homphysiology.org/neurosim/basic/slices/mri/t1/axi/t1_axi_100.svg 
    Request Method:GET 
    Status Code:200 OK (from disk cache) 
    Remote Address:173.254.28.84:80 

Response Headers 
    Accept-Ranges:bytes 
    Cache-Control:max-age=2592000 
    Content-Encoding:gzip 
    Content-Type:image/svg+xml 
    Date:Tue, 17 Jan 2017 15:49:02 GMT 
    Expires:Thu, 16 Feb 2017 15:49:02 GMT 
    Last-Modified:Thu, 11 Aug 2016 18:26:42 GMT 
    Server:nginx/1.10.2 
    Vary:Accept-Encoding 
    X-Content-Type-Options:nosniff 
Request Headers 
    Provisional headers are shown 
    Accept:text/html, */*; q=0.01 
    Referer:http://homphysiology.org/neurosim/basic/case2_nonlinear.html 
    User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36 
    X-Requested-With:XMLHttpRequest

서버 폴링 될 크롬 및 응답을 기다리는 수 있을까요? 만약 그렇다면 이것을 막을 수 있습니까? 또는 XHR 준비 상태가 적시에 실행되지 않을 수 있습니까?

출처

2017-01-17 Sanjay Manohar

저에게 서버 지연처럼 보입니다.

타임 라인 및 네트워크 탭에서 두 가지 리소스 다운로드를 보여줍니다. 첫 번째 것은 t1_axi_100.svg이고 두 번째 것은 t1_axi_070.svg입니다. 아마 브라우저는 캐시에서 t1_axi_070.svg만을 가져 갔을 것입니다. 나의 경우에는 t1_axi_100.svg에 대한 TTFB이 1.75 초였다.

출처

2017-01-19 10:57:03

크롬 지연 캐시 된 SVG 파일로드 중

답변

관련 문제