Summary: | SVG animation is slow only when the SVG is the background of the <body> | ||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Product: | WebKit | Reporter: | Said Abou-Hallawa <sabouhallawa> | ||||||||||||||||
Component: | SVG | Assignee: | Nobody <webkit-unassigned> | ||||||||||||||||
Status: | NEW --- | ||||||||||||||||||
Severity: | Normal | CC: | simon.fraser, webkit-bug-importer, zimmermann | ||||||||||||||||
Priority: | P2 | Keywords: | InRadar | ||||||||||||||||
Version: | 528+ (Nightly build) | ||||||||||||||||||
Hardware: | Unspecified | ||||||||||||||||||
OS: | Unspecified | ||||||||||||||||||
Attachments: |
|
Created attachment 246050 [details]
svg-animation-div-background
Created attachment 246051 [details]
svg-animation-img-src
The body background case is drawing twice (or more) because of tiling. Does it get faster if you reduce the body size? Created attachment 246056 [details]
svg-animation-body-background-height-500
Created attachment 246057 [details]
svg-animation-body-background-height-1500
(In reply to comment #4) > The body background case is drawing twice (or more) because of tiling. Does > it get faster if you reduce the body size? No. If I reduce the body height, the image is drawn multiple times and if I increase it, the image is drawn only once. In all cases the animation is noticeably slow. So the body background is propagated to the root, so sizing the body has no effect unless you also give <html> some background style ("background: white") which does indeed speed things up. What's the perf when the SVG background is on <html> and the body has no style? Created attachment 246058 [details]
svg-animation-html-background
(In reply to comment #8) > So the body background is propagated to the root, so sizing the body has no > effect unless you also give <html> some background style ("background: > white") which does indeed speed things up. Yes setting the style html {"background: white"} was like a magic. Animation speed is really different. (In reply to comment #9) > What's the perf when the SVG background is on <html> and the body has no > style? It is very slow in this case. Created attachment 246059 [details]
svg-animation-body-background-html-white
You should figure out whether it's just a factor of the tiling area. |
Created attachment 246048 [details] svg-animation-body-background Open the attached test cases. Result: When the SVG is the the source of an <img> tag the animation is fast. When the SVG is the background of a <div> tag the animation is still fast but might be a little bit slower than the <img> case. But when the SVG is the background of the <body> tag, the animation is much slower than the other cases.