1494924 - Bad performance on google docs caused by fallback/blob image/svg filters

Status: VERIFIED FIXED

(Core :: Graphics: WebRender, defect, P3)

Description

[Daniel_A[:daschilean] [Please contact - [e-mail]]]

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

[Affected versions]:
Nightly 64.0a1 (2018-09-27) (64-bit) and Nightly 64.0a1 (2018-09-27) (32-bit)

[Affected platforms]:
Windows 10 x86, Windows 10 x64

[Steps to reproduce]:
1. Launch Firefox with a new profile
2. Navigate to https://docs.google.com/document/u/1/d/1ic5GS4EicF2_oH2Q0ZcYfV90VOXSPvtAnj0EPpJro5g/edit#heading=h.z6ne0og04bp5demos/parallax.html
3. Scroll down the page

[Expected result]:
The content of the document should be displayed without bad performance. 

[Actual result]:
Bad performance is encountered after scroll down the page. For further information please click on this link: http://bit.ly/2OoiR94

Comment 1

[Kartikaya Gupta (email:[e-mail])]

(In reply to Daniel_A[:daschilean] from comment #0)
> [Steps to reproduce]:
> 1. Launch Firefox with a new profile
> 2. Navigate to
> https://docs.google.com/document/u/1/d/
> 1ic5GS4EicF2_oH2Q0ZcYfV90VOXSPvtAnj0EPpJro5g/edit#heading=h.
> z6ne0og04bp5demos/parallax.html

Is this a new profile which has webrender enabled or disabled? Can you please attach your about:support contents?

Comment 2

[Daniel_A[:daschilean] [Please contact - [e-mail]]]

Attachment: AboutSupport.txt

Comment 3

[Jeff Muizelaar [:jrmuizel]]

The cause of this problem is the SVG filter on these <SVG> items. That causes us to go down the single item fallback path on the nsDisplayFilter item. I think we're not properly clipping things and that causes us to filter a much bigger area than we need.

Comment 4

[Jeff Muizelaar [:jrmuizel]]

It would be really valuable to know how the green and red bars were created. This will give us an idea of how common this problem is.

Comment 5

[Daniel_A[:daschilean] [Please contact - [e-mail]]]

Hi Kartikaya,

I verified this issue with a new profile  and webrender enabled. For more information please observe the attached file.

Comment 6

[Jeff Muizelaar [:jrmuizel]]

Re-requesting n-i because only Kats' question was answered.

Comment 7

[Daniel_A[:daschilean] [Please contact - [e-mail]]]

Hi Jeff,

We don't know exactly how the green and red bars were created because this is an old template.

Comment 8

[Jeff Muizelaar [:jrmuizel]]

The SVG filter comes from recoloring using "Image options..."

Comment 9

[Jeff Muizelaar [:jrmuizel]]

Here's the filter that's applied:

<filter filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%" class="kix-image-effect-filter" id="filter-75"><feColorMatrix in="SourceGraphic" type="matrix" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" result="result-0" color-interpolation-filters="sRGB"></feColorMatrix><feComponentTransfer in="result-0" result="result-1" color-interpolation-filters="sRGB"><feFuncR type="table" tableValues="0 0.013071895424836602 0.026143790849673203 0.0392156862745098 0.05228758169934641 0.06535947712418301 0.0784313725490196 0.09150326797385622 0.10457516339869281 0.11764705882352941 0.13071895424836602 0.14379084967320263 0.1568627450980392 0.16993464052287582 0.18300653594771243 0.19607843137254902 0.20915032679738563 0.22222222222222224 0.23529411764705882 0.24836601307189543 0.26143790849673204 0.27450980392156865 0.28758169934640526 0.3006535947712418 0.3137254901960784 0.32679738562091504 0.33986928104575165 0.35294117647058826 0.36601307189542487 0.3790849673202614 0.39215686274509803 0.40522875816993464 0.41830065359477125 0.4313725490196079 0.4444444444444445 0.4575163398692811 0.47058823529411764 0.4836601307189543 0.49673202614379086 0.5098039215686275 0.5228758169934641 0.5359477124183007 0.5490196078431373 0.562091503267974 0.5751633986928105 0.5882352941176471 0.6013071895424836 0.6143790849673203 0.6274509803921569 0.6405228758169935 0.6535947712418301 0.6666666666666667 0.6797385620915033 0.69281045751634 0.7058823529411765 0.7189542483660132 0.7320261437908497 0.7450980392156863 0.7581699346405228 0.7712418300653595 0.7843137254901961 0.7973856209150327 0.8104575163398693 0.823529411764706 0.8366013071895425 0.8496732026143791 0.8627450980392158 0.8758169934640524 0.888888888888889 0.9019607843137255 0.9150326797385622 0.9281045751633987 0.9411764705882353 0.9542483660130718 0.9673202614379086 0.9803921568627452 0.9934640522875817 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1"></feFuncR><feFuncG type="table" tableValues="0 0.008868383954889146 0.01773676790977829 0.026605151864667435 0.03547353581955658 0.04434191977444573 0.05321030372933487 0.06207868768422402 0.07094707163911317 0.0798154555940023 0.08868383954889146 0.09755222350378061 0.10642060745866974 0.1152889914135589 0.12415737536844804 0.13302575932333718 0.14189414327822633 0.15076252723311548 0.1596309111880046 0.16849929514289377 0.17736767909778292 0.18623606305267207 0.19510444700756122 0.20397283096245034 0.21284121491733948 0.22170959887222863 0.2305779828271178 0.23944636678200693 0.24831475073689607 0.2571831346917852 0.26605151864667437 0.2749199026015635 0.28378828655645266 0.29265667051134187 0.30152505446623096 0.3103934384211201 0.3192618223760092 0.3281302063308984 0.33699859028578755 0.3458669742406767 0.35473535819556584 0.36360374215045504 0.37247212610534414 0.3813405100602333 0.39020889401512243 0.3990772779700115 0.40794566192490067 0.4168140458797899 0.42568242983467897 0.43455081378956817 0.44341919774445726 0.45228758169934646 0.4611559656542356 0.47002434960912476 0.47889273356401385 0.48776111751890305 0.49662950147379215 0.5054978854286812 0.5143662693835704 0.5232346533384595 0.5321030372933487 0.5409714212482378 0.549839805203127 0.5587081891580161 0.5675765731129053 0.5764449570677944 0.5853133410226837 0.5941817249775728 0.6030501089324619 0.611918492887351 0.6207868768422402 0.6296552607971294 0.6385236447520184 0.6473920287069076 0.6562604126617968 0.665128796616686 0.6739971805715751 0.6793321250068655 0.6811336299225572 0.6829351348382491 0.6847366397539407 0.6865381446696326 0.6883396495853243 0.6901411545010161 0.6919426594167079 0.6937441643323996 0.6955456692480915 0.6973471741637831 0.699148679079475 0.7009501839951666 0.7027516889108585 0.7045531938265502 0.706354698742242 0.7081562036579337 0.7099577085736255 0.7117592134893174 0.713560718405009 0.7153622233207009 0.7171637282363926 0.7189652331520844 0.7207667380677761 0.7225682429834679 0.7243697478991596 0.7261712528148514 0.7279727577305433 0.7297742626462349 0.7315757675619268 0.7333772724776185 0.7351787773933103 0.736980282309002 0.7387817872246938 0.7405832921403855 0.7423847970560773 0.7441863019717692 0.7459878068874609 0.7477893118031527 0.7495908167188444 0.7513923216345362 0.7531938265502279 0.7549953314659197 0.7567968363816115 0.7585983412973032 0.7603998462129951 0.7622013511286867 0.7640028560443786 0.7658043609600703 0.7676058658757621 0.7694073707914538 0.7712088757071456 0.7730103806228374 0.7748118855385291 0.776613390454221 0.7784148953699127 0.7802164002856045 0.7820179052012962 0.783819410116988 0.7856209150326797 0.7874224199483715 0.7892239248640633 0.791025429779755 0.7928269346954468 0.7946284396111386 0.7964299445268304 0.7982314494425221 0.8000329543582139 0.8018344592739057 0.8036359641895974 0.8054374691052892 0.807238974020981 0.8090404789366727 0.8108419838523645 0.8126434887680563 0.814444993683748 0.8162464985994398 0.8180480035151316 0.8198495084308233 0.8216510133465151 0.8234525182622069 0.8252540231778986 0.8270555280935904 0.8288570330092822 0.8306585379249739 0.8324600428406657 0.8342615477563575 0.8360630526720492 0.837864557587741 0.8396660625034328 0.8414675674191245 0.8432690723348163 0.845070577250508 0.8468720821661998 0.8486735870818916 0.8504750919975834 0.8522765969132751 0.8540781018289669 0.8558796067446587 0.8576811116603504 0.8594826165760421 0.861284121491734 0.8630856264074258 0.8648871313231176 0.8666886362388093 0.8684901411545011 0.8702916460701928 0.8720931509858846 0.8738946559015763 0.8756961608172681 0.8774976657329598 0.8792991706486517 0.8811006755643435 0.8829021804800352 0.8847036853957269 0.8865051903114187 0.8883066952271105 0.8901082001428022 0.8919097050584939 0.8937112099741857 0.8955127148898776 0.8973142198055694 0.8991157247212611 0.9009172296369528 0.9027187345526446 0.9045202394683364 0.9063217443840281 0.9081232492997198 0.9099247542154116 0.9117262591311035 0.9135277640467951 0.9153292689624869 0.9171307738781787 0.9189322787938705 0.9207337837095622 0.9225352886252541 0.9243367935409459 0.9261382984566375 0.9279398033723294 0.9297413082880212 0.9315428132037129 0.9333443181194045 0.9351458230350964 0.9369473279507882 0.9387488328664799 0.9405503377821717 0.9423518426978634 0.9441533476135553 0.9459548525292469 0.9477563574449387 0.9495578623606304 0.9513593672763223 0.9531608721920141 0.9549623771077059 0.9567638820233977 0.9585653869390893 0.9603668918547812 0.962168396770473 0.9639699016861647 0.9657714066018563 0.9675729115175482 0.96937441643324 0.9711759213489317 0.9729774262646235 0.9747789311803152 0.9765804360960071 0.9783819410116987 0.9801834459273907 0.9819849508430823 0.9837864557587741 0.985587960674466 0.9873894655901577 0.9891909705058495 0.9909924754215411 0.992793980337233 0.9945954852529247 0.9963969901686165 0.9981984950843081 1"></feFuncG><feFuncB type="table" tableValues="0 0.0026143790849673205 0.005228758169934641 0.00784313725490196 0.010457516339869282 0.013071895424836602 0.01568627450980392 0.018300653594771243 0.020915032679738564 0.023529411764705882 0.026143790849673203 0.028758169934640525 0.03137254901960784 0.03398692810457517 0.036601307189542485 0.0392156862745098 0.04183006535947713 0.044444444444444446 0.047058823529411764 0.04967320261437909 0.05228758169934641 0.05490196078431373 0.05751633986928105 0.06013071895424836 0.06274509803921569 0.06535947712418301 0.06797385620915034 0.07058823529411765 0.07320261437908497 0.07581699346405228 0.0784313725490196 0.08104575163398693 0.08366013071895426 0.08627450980392158 0.08888888888888889 0.09150326797385622 0.09411764705882353 0.09673202614379087 0.09934640522875818 0.1019607843137255 0.10457516339869281 0.10718954248366015 0.10980392156862746 0.11241830065359479 0.1150326797385621 0.11764705882352941 0.12026143790849672 0.12287581699346406 0.12549019607843137 0.1281045751633987 0.13071895424836602 0.13333333333333336 0.13594771241830067 0.13856209150326798 0.1411764705882353 0.14379084967320263 0.14640522875816994 0.14901960784313725 0.15163398692810456 0.1542483660130719 0.1568627450980392 0.15947712418300655 0.16209150326797386 0.1647058823529412 0.1673202614379085 0.16993464052287582 0.17254901960784316 0.17516339869281047 0.17777777777777778 0.1803921568627451 0.18300653594771243 0.18562091503267975 0.18823529411764706 0.19084967320261437 0.19346405228758173 0.19607843137254902 0.19869281045751636 0.20224089635854342 0.2067226890756303 0.2112044817927171 0.21568627450980393 0.22016806722689075 0.22464985994397765 0.22913165266106447 0.23361344537815126 0.23809523809523808 0.24257703081232498 0.2470588235294118 0.2515406162464986 0.2560224089635854 0.26050420168067234 0.26498599439775916 0.269467787114846 0.2739495798319328 0.2784313725490197 0.2829131652661065 0.2873949579831933 0.29187675070028013 0.296358543417367 0.3008403361344538 0.30532212885154064 0.30980392156862746 0.31428571428571433 0.31876750700280115 0.323249299719888 0.3277310924369748 0.33221288515406167 0.3366946778711485 0.3411764705882353 0.3456582633053221 0.35014005602240905 0.35462184873949587 0.3591036414565827 0.3635854341736695 0.3680672268907563 0.37254901960784315 0.37703081232492996 0.3815126050420168 0.3859943977591037 0.39047619047619053 0.39495798319327735 0.39943977591036417 0.403921568627451 0.4084033613445378 0.4128851540616246 0.41736694677871145 0.4218487394957984 0.4263305322128852 0.430812324929972 0.43529411764705883 0.43977591036414565 0.44425770308123247 0.4487394957983194 0.4532212885154063 0.4577030812324931 0.4621848739495799 0.46666666666666673 0.47114845938375355 0.47563025210084037 0.4801120448179272 0.4845938375350141 0.48907563025210093 0.49355742296918775 0.4980392156862746 0.5025210084033614 0.5070028011204482 0.5114845938375351 0.5159663865546218 0.5204481792717087 0.5249299719887957 0.5294117647058824 0.5338935574229693 0.538375350140056 0.5428571428571429 0.5473389355742296 0.5518207282913166 0.5563025210084035 0.5607843137254903 0.5652661064425771 0.569747899159664 0.5742296918767508 0.5787114845938376 0.5831932773109244 0.5876750700280112 0.592156862745098 0.596638655462185 0.6011204481792718 0.6056022408963586 0.6100840336134454 0.6145658263305322 0.6190476190476191 0.6235294117647059 0.6280112044817928 0.6324929971988796 0.6369747899159665 0.6414565826330533 0.6459383753501401 0.6504201680672269 0.6549019607843137 0.6593837535014005 0.6638655462184876 0.6683473389355743 0.6728291316526612 0.6773109243697479 0.6817927170868349 0.6862745098039216 0.6907563025210085 0.6952380952380952 0.6997198879551821 0.704201680672269 0.7086834733893558 0.7131652661064426 0.7176470588235294 0.7221288515406162 0.726610644257703 0.7310924369747899 0.7355742296918769 0.7400560224089637 0.7445378151260506 0.7490196078431374 0.7535014005602242 0.757983193277311 0.7624649859943978 0.7669467787114846 0.7714285714285715 0.7759103641456583 0.7803921568627451 0.7848739495798319 0.7893557422969187 0.7938375350140056 0.7983193277310924 0.8028011204481792 0.8072829131652662 0.811764705882353 0.8162464985994399 0.8207282913165267 0.8252100840336135 0.8296918767507003 0.8341736694677871 0.838655462184874 0.8431372549019608 0.8476190476190476 0.8521008403361344 0.8565826330532212 0.8610644257703081 0.8655462184873949 0.8700280112044817 0.8745098039215685 0.8789915966386557 0.8834733893557425 0.8879551820728293 0.8924369747899161 0.896918767507003 0.9014005602240898 0.9058823529411766 0.9103641456582634 0.9148459383753502 0.919327731092437 0.9238095238095239 0.9282913165266107 0.9327731092436975 0.9372549019607843 0.9417366946778711 0.946218487394958 0.950700280112045 0.9551820728291318 0.9596638655462186 0.9641456582633054 0.9686274509803923 0.9731092436974791 0.9775910364145659 0.9820728291316527 0.9865546218487395 0.9910364145658264 0.9955182072829132 1"></feFuncB></feComponentTransfer></filter>

Comment 10

[John]

For my setup google docs crashes the browser:
- Firefox 63.0.3 (WEBRENDER flag enabled + gpu acceleration)
- Ubuntu 18.10
- Dell XPS 9530

If need be to provide any logs would be happy to help!

Comment 11

[Jeff Muizelaar [:jrmuizel]]

Can you post a link to the crash from about:crashes?

Comment 12

[Jeff Muizelaar [:jrmuizel]]

I'm going to see if I can reduce the size of the blob image here by clipping it better.

Comment 13

[Jeff Muizelaar [:jrmuizel]]

Attachment: Somewhat reduced test case

Comment 14

[Jeff Muizelaar [:jrmuizel]]

Attachment: Corresponding display list

We're making a blob image that's 124800x1400, but it's not clear to me what the best way of having the overflow:clip make this smaller is.

Comment 15

[Jeff Muizelaar [:jrmuizel]]

I talked with mstange about this and it seems like we should have a way forward using the SetBlobImageVisibleArea with the building rect. I'll try that out.

Comment 16

[Jeff Muizelaar [:jrmuizel]]

Attachment: An attempt

Here's an attempt at this. It doesn't seem to work though :(

Comment 17

[Jeff Muizelaar [:jrmuizel]]

Attachment: A working version

Restricting the paint rect fixes the problem.

Comment 18

[Jeff Muizelaar [:jrmuizel]]

Attachment: Bug 1494924. Redo the calculation of paintRect.

This changes the calculation to match what we do for SVG blobs.
Notably, it takes the residual into account when computing the area
we want to paint into. This makes a difference if the fallback
is happening at a fractional offset.

Comment 19

[Jeff Muizelaar [:jrmuizel]]

Attachment: Bug 1494924. SetPaintRect to GetBuildingRect().

Instead of setting the item PaintRect to paintRect we set it to the BuildingRect. This properly reduces
the size based on clips and gives a big performance improvement for clipped nsDisplayFilter items
because we call CreateSimiliar surface for the size of building rect instead of the bounds of the item.

Depends on D17178

Comment 20

[Jeff Muizelaar [:jrmuizel]]

Attachment: Bug 1494924. Set the visible area of the blob to GetBuildingRect.

This lets us get some of the advantages of clipped blobs by drawing less of the
fallback blob while still not needing to rerecord and redraw the blob
completely during scrolling because of the changing clip rect. It drops
the number of tiles requested on a reduced test case reduced from the Googled
doc from 60 to a much more reasonable number.

Depends on D17179

Comment 21

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/4b841cc68f4d
Redo the calculation of paintRect. r=mattwoodrow

Comment 22

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/2bd66516b97a
SetPaintRect to GetBuildingRect(). r=mattwoodrow

Comment 23

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/0a5759a02d07
Set the visible area of the blob to GetBuildingRect. r=mattwoodrow

Comment 24

[Oana Pop-Rus]

https://hg.mozilla.org/mozilla-central/rev/4b841cc68f4d
https://hg.mozilla.org/mozilla-central/rev/2bd66516b97a
https://hg.mozilla.org/mozilla-central/rev/0a5759a02d07

Comment 25

[Jeff Muizelaar [:jrmuizel]]

The "SetPaintRect to GetBuildingRect()" patch turns out to be wrong. We can't restrict our painting and then draw different parts without repainting.

Comment 26

[Pulsebot]

Backout by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/bc6466d64d96
Backed out changeset 2bd66516b97a as per jrmuizel`s request.

Comment 27

[Jeff Muizelaar [:jrmuizel]]

This still isn't amazing but is good enough not to block MVP

Comment 28

[Rares Doghi, Desktop QA]

Hi, This issue seems to be fixed now, I tried to reproduce it in Nightly 67.0a1 (2019-02-10)) but without any success, I think we can update the status and mark it Accordingly.

Comment 29

[Jeff Muizelaar [:jrmuizel]]

Performance still isn't amazing so I'd like to keep it open until bug 1505871 is fixed.

Comment 30

[Rares Doghi, Desktop QA]

Hi Jeff, Since bug 1505871 is fixed should we close this one as well the document runs smooth on my end with WebRender on.

Comment 31

[Rares Doghi, Desktop QA]

THis issue is verified as fixed in the Latest Firefox Nightly 67.0a1 (2019-02-28), its still a bit laggy in beta 66.0b12