1596634 - When blur filter is applied on a large area, it delays the full rendering

Status: NEW

(Core :: Graphics, enhancement)

Description

[Karl Dubost💡 :karlcow]

As reported on https://webcompat.com/issues/43355

The background video loop is running at a very low FPS on my Macbook Pro Late 2016.

When you open this link in Safari and or Chrome you will not see this same issue.

I've also checked on Windows 10 on another PC and it's okay. Seems to be isolated to Firefox.

My Macbook Pro at the time of this is

• Plugged in, fully charged
• GPU: Radeon Pro 460 (4GB DDR5)
• CPU Skylake i7

I can reproduce too.

The difference is noticeable in between Firefox and Safari on macOs
The video itself is smooth https://lolstatic-a.akamaihd.net/frontpage/apps/prod/signup/en_GB/5b674013d14f1633b421da94b203df56a6fb0492/assets/en_GB/assets/summoners-rift.mp4" type="video/mp4

but this the application of the filter which makes it slow. Removing it fixes the issue.

/* Inline #9 | https://signup.euw.leagueoflegends.com/en/signup/redownload */

.background-video video {
		/* filter: blur(4px); */
}

WebRender doesn't change anything.

So that sounds like a performance issue.

Comment 1

[Karl Dubost💡 :karlcow]

Just got a second issue with blur. This time the time it take to blur a full page before displaying a menu.

Comment 2

[Nicolas Silva [:nical]]

It's not too bad on a linux intel laptop with 4k screen, although not great on the GPU side. I see a lot of blurring and blending with the builtin timer queries. Mac may have additional trouble with texture uploads.

Comment 3

[Nicolas Silva [:nical]]

The opacity shader is also taking a bunch of time here.