Bug 218422

Summary: SVG Filter causes a high memory usage (3x more memory than Chrome)
Product: WebKit Reporter: Sergio Carracedo <hi>
Component: SVGAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: rniwa, sabouhallawa, simon.fraser, smoley, tanaka.toshiyuki, webkit-bug-importer, zimmermann
Priority: P2 Keywords: InRadar
Version: Safari 13   
Hardware: Mac   
OS: macOS 10.13   
Attachments:
Description Flags
SVG Image with filters
none
SVG Image with filters after reload twice none

Description Sergio Carracedo 2020-11-01 03:07:24 PST
Using composition filters into an SVG cause a high memory usage / memory leak in Safari

For example, in this PoC https://5emtw.csb.app/index-nofilter.html Safari reports 21Mb of memory usage, but the same images using filters https://5emtw.csb.app/index.html reports 600MB of memory usage, and after reloading this page a couple of times, Safari reports 1.26GB of memory usage

Even with a simple filter, like ```<feFlood flood-opacity="1" result="BackgroundImageFix"/>``` the memory usage goes high: https://5emtw.csb.app/index2.html

Maybe it's related to: 

* Memory leaks in SVG filters https://bugs.webkit.org/show_bug.cgi?id=78814 
* SVG background-image memory usage is absurd https://bugs.webkit.org/show_bug.cgi?id=108999
* SVG with drop shadow effect uses a huge amount of memory https://bugs.webkit.org/show_bug.cgi?id=105557
Comment 1 Smoley 2020-11-02 10:30:38 PST
Thanks for filing. I haven't been able to reproduce this reliably on Safari 13.1.3 or 14.0.1/14.1. I see memory footprints hovering anywhere from 150-500MB for both of the poc links and refreshing the page is not causing a memory spike. Are you still seeing this on STP 115 (Safari 14.1)?
Comment 2 Radar WebKit Bug Importer 2020-11-02 10:30:52 PST
<rdar://problem/70956336>
Comment 3 Sergio Carracedo 2020-11-02 11:44:56 PST
Created attachment 412952 [details]
SVG Image with filters
Comment 4 Sergio Carracedo 2020-11-02 11:45:14 PST
Created attachment 412954 [details]
SVG Image with filters after reload twice
Comment 5 Sergio Carracedo 2020-11-02 11:46:00 PST
I have only access to Safari 13.1.2 (I tested on it) right now. I will try to get access and try on them.
Is normal 500Mb of memory usage for a website with only 2 images?

I attached 2 screenshot of the devtools for more details
Comment 6 Sergio Carracedo 2020-11-02 11:46:41 PST
(In reply to Smoley from comment #1)
> Thanks for filing. I haven't been able to reproduce this reliably on Safari
> 13.1.3 or 14.0.1/14.1. I see memory footprints hovering anywhere from
> 150-500MB for both of the poc links and refreshing the page is not causing a
> memory spike. Are you still seeing this on STP 115 (Safari 14.1)?

I have only access to Safari 13.1.2 (I tested on it) right now. I will try to get access and try on them.
Is normal 500Mb of memory usage for a website with only 2 images?

I attached 2 screenshots of the devtools for more details

Thank you!
Comment 7 Ryosuke Niwa 2020-11-02 16:45:02 PST
Chrome only uses 34.6MB in Chrome Helper process and ~100MB in GPU Process compared to WebKit which uses 450MB and ~650MB after a couple of reloads so there is definitely a massive memory usage difference between Chrome & Safari.