2011-03-20 4 views
1

나는 $ 아약스()와 iframe을로드하고있어 속도가 느려집니다 :jQuery를/자바 스크립트는 아약스와로드 iframe이 페이지

$("#iframe_wrapper").each(function(){ 
    $.ajax({ 
    type: "post", 
    url: "http://site.com", 
    data: { action: 'get_the_iframe' }, 
    context: this, 
    success: function(html){ 
     $(this).html(html); 
     $(this).show(); 
     $('#theiframe').load(function(){ 
     // do stuff with the iframe... 
     }); 
    } 
    }); 
}); 

iframe이가 호출되는 함수 내부에있는 경우 $ _POST [ '행동' ] 'get_the_iframe'입니다 : iframe이 페이지에 전체 내용을 표시하기 전에로드를 기다립니다처럼

<iframe id="theiframe" name="theiframe" src="http://site.com/page/"></iframe> 

작동하지만, 문제는 브라우저가 정말 느린 전체 페이지를 표시 할 것 같다, 그것은 보인다 그것은 물마루 아약스가 완료 되었기 때문에 일어나지 않아야합니다. 이것은 정확히 내가 피하려고했던 것입니다 ...

어떤 아이디어가 잘못 되었습니까?

답변

1

대답의 열쇠는 아약스 게시를 수행하는 jQuery 조각이 브라우저에서 실행될 때, 또는 더 구체적으로 말입니다.

jQuery 코드가 전체 페이지가로드되기 전에 언젠가 발생한다고 생각합니다. 그리고 아마도 브라우저가 같은 도메인의 비동기 적로드를 지원하지 않을 수도 있습니다. 이것은 오랫동안 IE를 사용한 경우였습니다. 그래서 브라우저는 정상적인 (바깥 쪽) 페이지가하고있는 요청의 나머지 부분과 함께 iframe을로드하고 처리하기 시작합니다.

아직 준비가되지 않은 경우 ajax 게시물을 시작하는 코드를 문서 준비 처리기에 넣으십시오. 또한 다른 브라우저에서 해당 문제가 보드 전체에서 발생하는지 확인하십시오.

1

IFrame이 특히 IE에서 요소를 차단하고 있기 때문에 그 이유는 무엇입니까? IFrame은 브라우저에서 만드는 데 비용이 많이 드는 요소이며 JavaScript를 만들 때 JavaScript 실행을 차단합니다. 또한 IFrame에 대한 리소스 차단 규칙이 있습니다. 페이지에 CSS 파일이있는 경우 모든 CSS 파일에 대한 응답이 브라우저 (IE) 또는 Firefox에서 수신 될 때까지 IFrame이로드되지 않고 기본 페이지의 모든 리소스에 대한 응답이 수신 될 때까지 모든 IFrame의 리소스가 차단됩니다 .

예를 들어, AJAX를 서버에 호출 할 때마다 실행중인 뱀을 표시하는 표준 스피너 컨트롤이 있습니다 (사용자에게 어떤 일이 발생했는지 피드백을주기 위해). 또한 IE6/7에 대한 페이지의 모든 드롭 다운 요소를 오버레이하여 버그를 통해 몸체 레벨에서 IFrame 요소를 작성했습니다. 어떤 시점에서 필자는 웹 서비스 호출이 IE에서 약 두 배 느린 것을 발견했다. 조사가 끝나면 IFrame 요소를 만들면 서버의 응답을받는 코드를 비롯하여 브라우저의 모든 요소가 차단된다는 것을 알게되었습니다.

IFrame을 사용하지 않는 것을 제외하고는 주위에 방법이 없다고 생각합니다.