2011-06-25 42 views
5

Tôi biết câu hỏi này đã được hỏi trước đây, nhưng không có câu trả lời nào dường như giải quyết vấn đề. Tôi đang thử nghiệm một trang web AJAX cập nhật các phần tử trong DOM thông qua javascript.Cập nhật DOM qua Javascript gây rò rỉ bộ nhớ (chỉ trong Firefox?)

Mỗi phút, máy chủ được truy vấn cho dữ liệu mới và DOM được cập nhật tương ứng. Từ những gì tôi có thể nói, việc sử dụng bộ nhớ cho trang này trong Chrome phát triển, nhưng không quá nhiều (nó bắt đầu khoảng 40 MB và đạt tối đa 80 MB). Tuy nhiên, trong Firefox, mức sử dụng bộ nhớ bắt đầu vào khoảng 120 MB và có thể mở rộng đến hơn 400 MB. Tôi đã bước qua Javascript với Firebug và có vẻ như bộ nhớ mở rộng nhất khi DOM được cập nhật thông qua các phương thức Javascript của tôi.

Các thao tác DOM là đơn giản, chẳng hạn như:

var myTable = document.createElement("table"); 

var thead = document.createElement("thead"); 
var tr = document.createElement("tr"); 
var th = document.createElement("th"); 
th.appendChild(document.createTextNode("column1")); 
tr.appendChild(th); 

for(var test in obj.testObjs){ 
    th = document.createElement("th"); 
    th.appendChild(document.createTextNode(obj.testObjs[test].myVar)); 
    tr.appendChild(th); 
} 

Trước phụ thêm dữ liệu mới vào các nút trong DOM, đầu tiên tôi xóa các dữ liệu hiện có. Tôi đã thử nhiều cách, trong đó có những gì được mô tả ở đây: How to remove DOM elements without memory leaks?

Cũng như một cách đơn giản như:

function clearChildren(node){ 
    if(node != null){ 
     while (node.hasChildNodes()) node.removeChild(node.firstChild); 
    } 
} 

Tôi cũng đã đọc (Cyclic adding/removing of DOM nodes causes memory leaks in JavaScript?) mà các trình duyệt chỉ bắt đầu thu thập rác khi nó đạt đến một mức nhất định? Điều đó có thể được xác nhận không? Tôi cảm thấy rằng máy tính của tôi chạy chậm chạp sau một thời gian do bộ nhớ ngày càng tăng.

Tôi cảm thấy phải có một giải pháp cho điều này, bởi vì các trang web thương mại mà tôi đã thử nghiệm thực hiện các bước chức năng giống nhau không làm cho việc sử dụng bộ nhớ tăng lên.

Mọi trợ giúp sẽ được đánh giá cao.

Cảm ơn bạn.

Trả lời

2
innerHTML='' 

Cách sai để chuẩn bị biến để xử lý GC.
Bạn cần sử dụng hàm delete trên phần tử và mọi phần tử mà phần tử này tham chiếu.
Rất nhiều, phải không?
Đó là lý do tại sao chúng tôi có các thư viện JS được viết cho chúng tôi. Tôi đã kiểm tra mã trong Mootools (tải xuống và tìm kiếm tiêu diệt) và dường như tôi được viết chính xác.
Tôi đoán nó cũng sẽ giống nhau trong các thư viện khác.

+0

Cảm ơn phản hồi - Mootools có can thiệp vào JQuery không? Tôi đã sử dụng JQuery trên trang web của mình và khi cố gắng sử dụng hàm Mootools destroy(), tôi nhận được lỗi JS nói rằng "destroy() không phải là chức năng" – user172092

+0

Bạn cần thiết lập chính xác để chơi cùng nhau (Trong trang web của tôi họ làm rất tốt). Giống như, thay vì sử dụng '$' trong mã Mootools Dependent, bạn cần sử dụng 'document.id ('selectors ...') ' –

+0

Cảm ơn bạn - có vẻ như việc sử dụng bộ nhớ không liên tục tăng lên bây giờ, và tôi thấy nó co lại ở lần. Tôi đánh giá cao sự giúp đỡ của bạn. – user172092

3

Điều đó có thể được xác nhận không?

Tùy theo.

Nói chung, các trình duyệt sẽ GC khi họ cảm thấy thích và các chẩn đoán có thể thay đổi khá thường xuyên. Tôi nghi ngờ rằng nếu bạn thử một Firefox hàng đêm, bạn sẽ thấy hành vi khá khác với những gì bạn mô tả ở trên. Đã có ít nhất 2 thay đổi heuristics GC kể từ khi phát hành Firefox 5.

+0

Phiên bản FF nào bây giờ? Tôi bị mất dấu vết –

+0

Firefox 5 là bản phát hành ổn định hiện tại. 6 được lên lịch vào giữa tháng 8. –

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