Утечка URI данных в Safari (было: Утечка памяти с холстом HTML5)

Я создал веб-страницу, которая получает растровые изображения в кодировке base64 через Websocket, а затем рисует их на холсте. Работает отлично. Кроме того, использование памяти браузером (будь то Firefox, Chrome или Safari) увеличивается с каждым изображением и никогда не снижается. Значит, в моем коде должна быть утечка памяти или какая-то другая ошибка. Если я закомментирую вызов context.drawImage, утечки памяти не произойдет (но тогда, конечно, изображение никогда не отрисовывается). Ниже приведены фрагменты с моей веб-страницы. Любая помощь приветствуется. Спасибо!

// global variables
var canvas;
var context;

...

ws.onmessage = function(evt)
{
    var received_msg = evt.data;
    var display_image = new Image();
    display_image.onload = function ()
    {
        context.drawImage(this, 0, 0);
    }
    display_image.src = 'data:image/bmp;base64,'+received_msg;
}

...

canvas=document.getElementById('ImageCanvas');
context=canvas.getContext('2d');

...

ОБНОВЛЕНИЕ 19.12.2011

Я могу обойти эту проблему, динамически создавая / уничтожая холст каждые 100 изображений или около того с помощью createElement / appendChild и removeChild. После этого у меня больше не будет проблем с памятью в Firefox и Chrome.

Однако у Safari все еще есть проблема с использованием памяти, но я думаю, что это другая проблема, не связанная с Canvas. Кажется, существует проблема с многократным изменением «src» изображения в Safari, как будто это никогда не освободит эту память.

display_image.src = 'data:image/bmp;base64,'+received_msg;  

Это та же проблема, что описана на следующем сайте: http://waldheinz.de/2010/06/webkit-leaks-data-uris/

ОБНОВЛЕНИЕ 21.12.2011

I надеялся обойти эту проблему Safari, преобразовав полученную мной строку base64 в большой двоичный объект (с функцией «dataURItoBlob», которую я нашел на этом сайте) и обратно в URL-адрес с помощью window.URL.createObjectURL, установив src моего изображения на этот URL-адрес , а затем освободив память, вызвав window.URL.revokeObjectURL. У меня все работает, и Chrome и Firefox правильно отображают изображения.К сожалению, похоже, что Safari не поддерживает BlobBuilder, поэтому я не могу использовать это решение. Это странно, поскольку во многих местах, включая книгу О'Рейли «Программирование приложений HTML5», указано, что BlobBuilder поддерживается в Safari / WebKit Nightly Builds. Я загрузил последнюю ночную сборку Windows с http://nightly.webkit.org/ и запустил WebKit.exe, но BlobBuilder и WebKitBlobBuilder все еще не определены.

ОБНОВЛЕНИЕ 01/03/2012

Хорошо, я наконец исправил это, декодировав строку URI данных в кодировке base64 с помощью atob (), а затем создав массив данных пикселей и записав его на холст с помощью putImageData (см. http://beej.us/blog/2010/02/html5s-canvas-part-ii-pixel-manipulation/ ). Делая это таким образом (в отличие от постоянного изменения src изображения и вызова drawImage в функции onload), я больше не вижу утечки памяти в Safari или любом браузере.