2009-04-24 31 views
12

Tôi đang gặp sự cố với các cuộc gọi jQuery AJAX trên IE7. Mã đơn giản này hoạt động tốt trên FF và Opera. Nhưng trên IE7 phải mất 3-5 giây. - chậm hơn 20 lần so với FF! Tải nội dung là HTML thuần túy và mã JavaScript nội tuyến. Không có hiển thị JS. Tôi thậm chí còn bật mã JavaScript nội tuyến. Bu vẫn chậm.Tại sao jQuery Ajax quá chậm trên IE7?

$('#block').load('some url'); 

Làm cách nào để khắc phục sự cố này? Mọi sự trợ giúp sẽ rất được trân trọng.

+0

bao nhiêu nội dung được bạn tải? IE thường chậm hơn một chút đối với một số thứ và chậm hơn rất nhiều nếu có nhiều nội dung. – cgp

+0

11KB. Có quá nhiều cho IE7 không? FF Opera Chrome tải rất nhanh. – taras

Trả lời

16

Làm cách nào để khắc phục sự cố này? Bất cứ sự giúp đỡ nào cũng được đánh giá cao.

Phát hiện IE7 khi tải trang và cung cấp đề xuất rời rạc mà người dùng không thích tải chậm nên nâng cấp.

3

Có thực sự không nhiều bạn có thể làm. Công cụ javascript của IE là cách chậm hơn so với bất kỳ của những người khác (trên thực tế, nó sucks). Bạn có thể thử IE8. Nó tốt hơn ... nhỉnh hơn ...

+0

Trên thực tế, IE8 nhanh hơn rất nhiều - và ở một số khía cạnh, nhanh hơn FF3 tin là không. Ví dụ hoàn hảo là StackOverflow. Tôi có khoảng 21 thẻ "quan tâm", và IE7 render SO rất chậm ... FF là tốt hơn nhiều. Khi tôi nâng cấp lên IE8, IE8 hét lên trên stackoverflow bây giờ. Đến mức mà Firefox IS chậm hơn trên SO bây giờ. Vì vậy, tôi trở lại IE trên SO. :) – eduncan911

+6

Bây giờ hãy thử trên Safari 4 hoặc Chrome. Bạn nói đúng, mặc dù. FireFox đã làm tôi thất vọng gần đây (trừ khi phát triển vì Firebug ... chúng ta sẽ làm gì nếu không có điều đó?). IE8 đã thêm thanh công cụ dành cho nhà phát triển, nó sẽ tải tốt hơn, uh, không có gì ... nhưng, nó vẫn không phải Firebug. Xin lỗi vì sự phán xét của Cựu ước. – KyleFarris

+1

Thanh công cụ dành cho nhà phát triển đã có từ IE6 – John

8

Tôi gặp vấn đề tương tự với động cơ jscript ie7 chậm. Tôi đã thêm cửa sổ bật lên trạng thái cho con người. Tôi cập nhật cửa sổ trạng thái khi JS tiến hành theo khối. Mã giả:

  1. Tạo vùng chứa trạng thái bằng thư viện js yêu thích của bạn. Tôi thích YUI hơn. Xem api vùng chứa của họ.
  2. Thực hiện một số tải dữ liệu của bạn. - trước tiên bạn cần phải chia thành các phần
  3. Cập nhật trạng thái bật lên. (Tăng% tải hoàn thành, tăng chỉ báo thanh, v.v.) Lưu ý rằng màn hình có thể sẽ không thay đổi vào thời điểm này vì chuỗi JS của bạn vẫn đang chạy.
  4. Tiếp theo, gọi
var t = setTimeout("next_step(2)", 0); 
// Where arg of 2 would mean do the second step 
// This will yield to the browser, and the display will then be updated. 
// If you want to maintain the value of "this" in the function, then do 
// something like 
var t = setTimeout("next_step.call(MyContext, 2)", 0); 
// using call to set the function's context.

Điểm mấu chốt là người dùng sẽ thấy một cái gì đó thay đổi trên màn hình. Lưu ý rằng các bước của năng suất với một thời gian chờ của 0 mất khá một thời gian, tương đối nói. Vì vậy, mã của tôi kiểm tra trình duyệt và làm việc nhiều hơn cho mỗi đoạn nếu đó là bất cứ điều gì khác hơn là IE.

Điều rất quan trọng là phải cung cấp phản hồi thay đổi cho người dùng. Nếu không họ nghĩ rằng nó mất nhiều thời gian hơn nó thực sự là.

HTH,

Larry

+0

Tôi đã có vấn đề này nhiều lần bản thân mình và đã thực hiện cùng một "giả" luồng kỹ thuật trong câu trả lời của bạn. Vì vậy, thường xuyên tôi đã phải xây dựng một cơ chế xếp hàng. jQuery 1.3 đã triển khai một Hàng đợi có thể giúp dễ dàng hơn để làm việc với http://docs.jquery.com/Effects/queue –

+0

Đề xuất tuyệt vời. Nên luôn có một số loại phản hồi khi thực hiện cuộc gọi không đồng bộ hoặc các thuật toán có thể rất tốn kém có thể mất nhiều hơn một giây (ngay cả khi nó chỉ là hoạt ảnh 'tải'). Điều này đi cho bất kỳ trình duyệt/thực hiện mặc dù. – KyleFarris

3

tôi sẽ phải xem mã thực tế nhưng phải đối mặt với một vấn đề tương tự tôi phải thoát khỏi jQuery.load(). Thay vào đó, tôi đã sử dụng jQuery.get() với loại dữ liệu "html" và đã viết lời gọi lại của riêng mình, nơi tôi đã tiêm dữ liệu qua .innerHTML. Làm như vậy, tôi cũng nhấn một lỗi khác (đó là một thẻ < chọn > và IE sẽ không cho phép .innerHTML trên đó) vì vậy tôi đã viết một cách giải quyết xấu.

mã kết quả là một cái gì đó như thế này:

// Fetch data (GET method allows me to use browser cache) 
$.get(url, get, function(htmlValues, txtStatus){ 
    that.populateSelects(htmlValues, that.selectContainers); 
}, "html"); 


// Create <select> 
var select = $('<span><select disabled="disabled"></select></span>'); 
$("<option>").attr("value", "").text("Loading...").appendTo(select.find("select")); 


// Populate <select> 
that.populateSelects = function(values, selectContainers){ 
    var span, select, tags; 

    for(var i=0, len=selectContainers.length; i<len; i++){ 
     span = selectContainers[i]; 

     if($.browser.msie){ 
     tags = span.innerHTML.match(/^(<select[^>]+>).*(<\/select>)$/i); 
     span.innerHTML = tags[1] + values + tags[2]; 
     select = span.firstChild; 
     }else{ 
     select = span.firstChild; 
     select.innerHTML = values; 
     } 
     $(select).removeAttr("disabled"); 
    } 
} 
+0

Chúc mừng cho điều này, tôi vừa mới xoay xở để tiết kiệm thời gian tải của ứng dụng bằng cách thay thế $ .load bằng $ .get + innerHTML. –

Các vấn đề liên quan