Chrome Memory Leak with moving SVG text and blur filter -
i have page several svg elements , each of them has svg blur filter applied it. noticed chrome running out of memory if elements keep moving continuously.
to reproduce check codepen: http://codepen.io/anon/pen/xzjmvz
<html> <head> <meta charset="utf-8"> <style> body {padding: 0; margin: 0;} </style> <svg height="0" width="0"> <defs> <filter id="f1"> <fegaussianblur in="sourcegraphic" stddeviation="2" /> </filter> </defs> </svg> </head> <body> <svg height="30" style="position: absolute; top: 100px; width: 1000px;height: 500px;"> <text x="0" y="15" fill="black" id="t0">blur test!</text> </svg> <script> (function() { var svgtext = document.getelementbyid('t0'); svgtext.setattribute('filter', 'url(#f1)'); var x = 0; var y = 0; setinterval(function(){ x+=1; y+=1; if(x > 1000) { x = 0; } if( y > 500) { y = 0; } svgtext.setattribute('transform', 'translate(' + x + ',' + y + ')'); }, 100); })(); </script> </body> </html>
open chrome's task manager , notice memory usage tab. filed bug report on chromium's issue tracker. wondering if has run before , if there's work around this.
thanks!
edit: noticing issue on chrome 48.0.2564.97 m on windows 7.
Comments
Post a Comment