Playable doodle on Google India homepage eats up memory, and causes janks (svg sprite sheets and canvas aren't best friends)

UNCONFIRMED
Unassigned

Status

()

Core
Canvas: 2D
P3
normal
UNCONFIRMED
6 months ago
5 months ago

People

(Reporter: Mayank Bansal, Unassigned)

Tracking

Trunk
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [gfx-noted])

Attachments

(2 attachments)

(Reporter)

Description

6 months ago
Created attachment 8873398 [details]
aboutsupport.txt

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:55.0) Gecko/20100101 Firefox/55.0
Build ID: 20170601030206

Steps to reproduce:

1. Create a local profile
2. Go to google india homepage : google.co.in
3. See the playable doodle. Click on it to start playing
4. Play for ~20-30 seconds


Actual results:

Memory usage grows to ~1.5GB
Plus, the game gets jankier as you keep on playing

I think if you score a 50 runs, the animation stops completely


Expected results:

not so
(Reporter)

Comment 1

6 months ago
Created attachment 8873399 [details]
memory-report.json.gz

taken on a fresh profile
Flags: needinfo?(jmuizelaar)
(Reporter)

Comment 2

6 months ago
https://perfht.ml/2qK6ww2  On a fresh profile
(Reporter)

Comment 3

6 months ago
You actually dont need to play the game.
Just start the game bu clicking on the doodle. The doodle will start animating (to give you instructions), and watch the CPU and memory usage grow.
(Reporter)

Comment 4

6 months ago
there is also some fair amount of time spent under JS
Flags: needinfo?(jdemooij)
So it looks like badness is happening under canvas's drawImage function. It looks like it's drawing svg images and we're perhaps not caching them/leaking them.
Flags: needinfo?(jmuizelaar)
Component: Graphics → Canvas: 2D
The google doodle is using an svg sprite sheet, we may be caching the whole sprite sheet at a bunch of different scales this probably causes the high memory usage and bad performance.
Summary: Playable doodle on Google India homepage eats up memory, and causes janks → Playable doodle on Google India homepage eats up memory, and causes janks (svg sprite sheets and canvas aren't best friends)
Here's a more permanent link: https://www.google.com/doodles/icc-champions-trophy-2017-begins
Whiteboard: [gfx-noted]
Clearing the NI for now. It probably makes sense to fix the canvas issue first and reprofile then.
Flags: needinfo?(jdemooij)
Priority: -- → P3
You need to log in before you can comment on or make changes to this bug.