Chrome delay loading cached SVG-файл

У меня есть код javascript, который запрашивает файл ресурсов SVG для отображения.Chrome delay loading cached SVG-файл

SVG не изменится. Он составляет около 100 кб, содержащий одно встроенное jpeg-изображение (как data:image/jpeg:base64). Поэтому я бы хотел, чтобы браузер кэшировал его, если это возможно.

Код для загрузки SVG что-то вроде этого

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

Кажется, это занимает 2 секунды. Вся эта временная задержка находится между «загрузкой ...» и «загруженной». Вы можете видеть из профилирования (хромированная временная шкала инструментов разработчика), что между обработкой не происходит обработки: стек левого вызова - для события «щелчок», а правый - для «загруженного» обработчика. Между ними находится промежуток, где якобы загружается «mri/t1/axi/t1_axi_100.svg» (длинная синяя полоса рядом с вершиной).

Однако, когда я смотрю в сети под хром Дев инструментов, я вижу, что каждый из «скачать» шаги приняли только < 4 мс. (узкие синие полосы на правой стороне, отметьте большие пробелы)

Вы также можете увидеть здесь, что кэширование работает (SVGs из дискового кэша; встроенный JPEGs из кэш-памяти).

Здесь показано разбиение 4ms для svg.

Так почему же существует 2-секундная задержка? Мой код занимает 4 мс, а извлечение из кэша занимает 4 мс!

заголовки, показанные на вкладке «Сеть» являются:

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

Может Chrome Ве опроса сервера и ждет ответа? Если это так, я могу предотвратить это? Или может быть, что состояние готовности XHR не запускается своевременно?

источник

2017-01-17 Sanjay Manohar

Это похоже на задержку сервера для меня.

Вы показываете нам две разные загрузки ресурсов на вкладках «Временная шкала» и «Сеть». Первый - t1_axi_100.svg, а второй - t1_axi_070.svg. Вероятно, браузер взял только t1_axi_070.svg из кеша. TTFB для t1_axi_100.svg было 1.75 секунд в моем случае.

источник

2017-01-19 10:57:03

Chrome delay loading cached SVG-файл

ответ

Смежные вопросы