자바 스크립트 이미지 미리로드 기능을 작성했는데 페이지가로드 될 때 성공적으로 이미지를 미리로드하는 것처럼 보입니다. 그러나 실제로 이미지를 표시해야 할 때 지연이 있습니다. 외관상으로는 그들을 다시 적재하고 선적의 목적을 무효로합니다. 이 동작 및 수정의 가능한 원인은 무엇입니까?이미지 미리로드가 작동하지 않습니다.
재현 가능한 코드를 만들려고 시도했지만 실패 했으므로이 문제의 원인은 내 전체 프로젝트의 복잡성 어딘가에 있습니다. 여기에 내가 사용하고 이미지 사전로드 기능입니다 : 페이지가로드 될 때 우리의 서버에 저장된 이미지의 긴 배열이 전화
function preload(sources)
{
var images = [];
for (i = 0, length = sources.length; i < length; ++i) {
images[i] = new Image();
images[i].src = sources[i];
}
}
는, 나는에 "GET"요청의 긴 목록을 볼 수 있습니다 내 콘솔은 실제로 이미지를 미리로드하고 있음을 나타냅니다. 나중에 이미지가 동적으로 생성 된 내용 (중요한 경우 jQuery를 사용하여)에 표시되면로드 될 때 지연이 발생하고 콘솔에서 다른 "GET"요청 ("HTTP/1.1 304 Not Modified"상태)이 표시됩니다. 캐시 된 버전을 사용하는 대신 이미지가 다시로드되는 것처럼 보입니다. 무엇이 이것을 일으킬 수 있습니까?
"cache : false"가 포함 된 이미지 미리로드 이후에 일부 Ajax 호출이 발생합니다. 가능한 원인일까요? 그러나 이러한 Ajax 호출은 페이지 내용에 직접적으로 영향을 미치지 않으며 단지 데이터베이스 내용을 가져 와서 페이지 내용에 영향을줍니다.
그런데 테스트를 위해 Firefox를 사용하고 있습니다. 나는 어딘가에 크롬이 캐시 된 이미지가 수정되었는지 여부를 확인하라는 요청을 언젠가는 보았지만 이것은 파이어 폭스와 관련이없는 것으로 추정된다.
이 의견을 보내 주셔서 감사합니다. 나는 방화범을 사용하지 않기 때문에 이것이 내 문제라고 생각하지 않는다. 또한 Chrome에서 동일하거나 관련있는 문제가 있다고 생각합니다. 이미지가 여전히 느리게로드되어 Chrome에서 GET 요청을 볼 수는 없지만 미리로드가 작동하지 않는 것처럼 보입니다. 다시 한번 고마워, 잘 알고있어. – baixiwei
Thx; 이것은 내 문제였다. 또한 Ajax로 미리로드 할 때 Firefox는 여전히 두 번째 http 요청을 작성합니다. 그래서 css 배경 이미지 preloading에 좋습니다. – bodo
@ baixiwei는 내 문제를 정확하게 설명합니다. 나는 크롬 개발자 도구를 사용하고 있지만, Wireshark를 사용하여 네트워크 트래픽을 모니터링하고 해제했을 때 나는 정확히 동일한 동작 (이미 GET으로로드 된 이미지로 가져옴)을 발견했습니다. 나는이 문제가 devtools/firebug에 의한 것이라고 생각하지 않는다. –