瀏覽器上拋出耗費大量內存

嗯，我運行到一個奇怪的錯誤，而編程是通過WebSockets將其從服務器接收圖像，Web應用程序後創建圖像斑點的的ObjectURL錯誤。服務器每秒向瀏覽器發送大約8個圖像（.bmp）。每張圖片的大小約爲300KB。那大概是2.4Mbps。瀏覽器上拋出耗費大量內存

瀏覽器接收到的圖像以二進制的blob：

//WebSocket 
var ws = new WebSocket("ws://192.168.0.10:1337"); 
//Image 
var camImg = new Image(); 

ws.onmessage = function(msg) 
{ 
    var data = msg.data; 
    // handle binary messages from server 
    if (data instanceof Blob) camImg.src = window.URL.createObjectURL(data); 
}; 

camImg.onload = function() 
{ 
    //draw image to canvas 
    canvasCont2D.drawImage(this,0,0); 
    //request next frame 
    ws.send("give me the next image!"); 
    //delete ObjectURL 
    window.URL.revokeObjectURL(this.src); 
};

所以直到此時一切都正常運行。現在我來解決第一個問題：正如我在Chrome中測試的那樣，我在TaskManager中看到了這個編碼需要多少資源。我看到有一個啓動於大約90MB內存的Chrome進程。每秒鐘都增加2.4MB。所以它看起來像我收到的每一個圖像留在內存中。有沒有可能防止這種情況？順便說一下，Chrome開發人員工具中收到的blob似乎仍然處於資源狀態。

無論如何，這個問題導致我到第二個：這個過程的內存消耗上升和一段時間後約400-500MB其刷新和再次開始在90MB，再次上升。這麼久，它只是一個記憶問題。但有時候可能會發生，內存不會被刷新並上升到大約600MB。在這一點上，我沒有收到任何新的形象。控制檯顯示一個錯誤，指出：

無法加載資源：
camImg.src = window.URL.createObjectURL(data); 
：服務器與404（未找到）

在此行中會出現此錯誤狀態迴應

目前我通過捕獲錯誤事件來解決此問題：

camImg.onerror = function() 
{ 
    //request next frame anyway and wait for memory flush 
    ws.send("give me the next image!"); 
};

因此，我只是請求新圖像，因爲一段時間後內存再次被刷新（幾秒鐘後），我可以收到新的圖像。

同樣的問題（S）occure使用Opera爲好。我猜想它主要是一個內存消耗的問題。也許在瀏覽器中的錯誤？或者我做了一個大的編程錯誤？

我會是因爲我沒有留下任何想法幫助非常感激，這可能是造成這個問題...

來源

2013-11-27 Fidel90

操作系統：Windows7的64位

的Chrome版本35.0.1916.153米

Chrome版本38.0.2068.0 canary（64位）:(chrome：// flags /＃impl-side-painting設置沒有區別）。

在我正在做的原型中，我在鉻35和最近的金絲雀版本中得到了完全相同的行爲。確定在IE和Firefox。我運行一個localhost C++ websocket服務器，大約10fps，帶有0.5MB圖片。 Chrome內存最終會上升，而且也會造成Chrome瀏覽器崩潰。

向前移動：

1）在image.onerror我請window.URL.revokeObjectURL（this.src）;這似乎把我的內存泄漏排除在外，但不是404的。

2）在F12調試器下運行時，事情非常緩慢，我似乎沒有發現問題。因此，在頁面上我有3個計數器：1）Blob收到計數，2）image.onload計數和3）image.onerror計數。大約900次成功加載後，我開始出現加載失敗。然後在50次故障之後，我再次開始成功加載。這種模式不斷重複，但數字似乎是隨機的（這一切似乎都與GC相關的問題有關，但僅僅是基於經驗的預感）。

3）我可以通過改變ws.binaryType ='arraybuffer'來修復（AKA'bodge'）。我需要一個blob，所以我基於新的Uint8Array（msg.data）構造一個新的blob。一切正常，沒有負載失敗。

我在這裏做了一個不必要的二進制副本，但它似乎沒有造成任何明顯的速度差異。我並不是100％確定這裏發生了什麼，以及修復程序有多穩定。

互聯網上最類似的圖像加載示例沒有onerror處理程序。在我的機器上運行這樣的例子會導致無法解釋的內存泄漏。除非在調試器和幸運之下，否則你不會看到404的。網上有很多人在加載圖像時抱怨內存泄漏。也許它是相關的。

我打算在鉻論壇上提出這個問題。

希望這有助於...亞光

來源

2014-07-04 23:23:24 user2968363

這裏的鉻問題https://code.google.com/p/chromium/issues/detail?id=392161 – Kiril

瀏覽器上拋出耗費大量內存

回答

相關問題