Live data from Hacker News

The web at maximum FPS: How WebRender gets rid of jank

hacks.mozilla.org

51–60 of 212 posts

Re: The web at maximum FPS: How WebRender gets rid of jank

#51

Earlier quoted context omitted.

I don't think this is actually true. If you're looking at a static page that doesn't change in any way, isn't the browser completely idle? Edit: To clarify, I realize that the screen gets refreshed ~60 times per second (depending on refresh rate), but I don't think any rendering actually happens if it doesn't need to.

The GPU is still painting the screen at a set refresh rate (your monitor’s). Some monitors have variable refresh rates, but don’t go any lower than 30hz, and depending on settings like vsync the gpu might still be churning through hundreds of wasted frames. The latest iPads can go down to 24hz to save energy due to their custom 120hz display, but that’s a rarity.

It depends on the GPU arch. Some of them use a separate 2D compositor that uses much less power so if you're just scrolling layers you aren't lighting up the full GPU.

Re: The web at maximum FPS: How WebRender gets rid of jank

#52

Earlier quoted context omitted.

Firefox 57 doesn’t have WebRender on unless you explicitly turn it on; did you? It would be reasonale not to, as it’s still kinda buggy.

Didn’t know that! I’ll be honest I was wondering what the hype was about because it didn’t seem that fast to me...

57 does contain a number of faster things, just not specifically the work the article is talking about. Now that 57 is in beta, I’d imagine that the developer-focused blogs are talking about future things.

Re: The web at maximum FPS: How WebRender gets rid of jank

#53
post #8

Earlier quoted context omitted.

If only it were as simple as just using Loop-Blinn. :) The technique described there will produce unacceptably bad antialiasing for body text. Loop-Blinn is fine if you want fast rendering with medium quality antialiasing, though. (Incidentally, it's better to just use supersampling or MLAA-style antialiasing with Loop-Blinn and not try to do the fancy shader-based AA described in that article.) Additionally, the ori…

Well there's also the problem that it's heavily patented :). Just throwing it out there as a neat thing, the GPU space has all sorts of fun stuff like that. I'll have to take a look at Pathfinder, have any links handy that I can dig into?

FTA: https://github.com/pcwalton/pathfinder

Re: The web at maximum FPS: How WebRender gets rid of jank

#54

Earlier quoted context omitted.

They do, but we're targeting Intel HD quality graphics, not gaming-oriented NVIDIA and AMD GPUs. That said, even Intel GPUs can often deal with large numbers of draw calls just fine. It's mobile where they become a real issue. Aggressive batching is still important to take maximum advantage of parallelism. If you're switching shaders for every rect you draw, then you frequently lose to the CPU.

Will there be a baseline GPU requirement for Firefox to enable this feature? For video games you often see minimum/recommended hardware specifications to run a game.

There will only be minimum requirements for GL/DirectX versions. I believe we require GLES 3.1, and then whatever DX version Angle turns that into.

Re: The web at maximum FPS: How WebRender gets rid of jank

#55

Earlier quoted context omitted.

I don't think this is actually true. If you're looking at a static page that doesn't change in any way, isn't the browser completely idle? Edit: To clarify, I realize that the screen gets refreshed ~60 times per second (depending on refresh rate), but I don't think any rendering actually happens if it doesn't need to.

The GPU is still painting the screen at a set refresh rate (your monitor’s). Some monitors have variable refresh rates, but don’t go any lower than 30hz, and depending on settings like vsync the gpu might still be churning through hundreds of wasted frames. The latest iPads can go down to 24hz to save energy due to their custom 120hz display, but that’s a rarity.

In this case, the GPU just sends the content of the framebuffer to the screen. It does not re-render the content of the framebuffer, which is what the most energy is usually spent on.

Re: The web at maximum FPS: How WebRender gets rid of jank

#56
post #39
post #8

Earlier quoted context omitted.

If only it were as simple as just using Loop-Blinn. :) The technique described there will produce unacceptably bad antialiasing for body text. Loop-Blinn is fine if you want fast rendering with medium quality antialiasing, though. (Incidentally, it's better to just use supersampling or MLAA-style antialiasing with Loop-Blinn and not try to do the fancy shader-based AA described in that article.) Additionally, the ori…

I noticed that Pathfinder went from calculating the intersection of beziers on the GPU with compute back to doing triangulation on the CPU. Any reason for this major switch in approach? I assume you've seen other things like Slug, glyphy, etc., which use a combination of CPU pre-processing and GPU processing to make the bezier intersection as efficient as possible...

Because (1) compute requires newer hardware than what would be ideal; (2) compute cannot take advantage of early Z, which is critical for SVG (neither can Slug or GLyphy, by the way); (3) the two step process is hostile to batching.

Slug is asymptotically slower than Pathfinder at fragment shading; every new path on a scanline increases the work that has to be done for every pixel. (Of course, that's not to say Slug is always slower in practice; constant factors matter a lot!) GLyphy is an SDF approach based on arc segment approximation that does not do Bézier intersection at all.

Re: The web at maximum FPS: How WebRender gets rid of jank

#57
post #31
post #22

Earlier quoted context omitted.

Despite the huge fans and heatsinks on modern desktop GPUs, I presume that a GPU would still use less energy than a CPU for the same workload, yes? Do mobile GPUs have a sleep mode comparable to mobile CPUs? Completely agreed that some measurements would be nice.

A modern high-end GPU can draw upwards of 200w. Edit: Not sure why I'm being downvoted for stating a simple fact. The top-of-the-line AMD and NVidia cards have TDPs of 200-250w.

Your comment is both true and utterly irrelevant to the person you replied to who asked about comparison between CPU and GPU efficiency.

The important information to answer the question is how much power the GPU will use, not how much it can use.

Re: The web at maximum FPS: How WebRender gets rid of jank

#58

Earlier quoted context omitted.

They do, but we're targeting Intel HD quality graphics, not gaming-oriented NVIDIA and AMD GPUs. That said, even Intel GPUs can often deal with large numbers of draw calls just fine. It's mobile where they become a real issue. Aggressive batching is still important to take maximum advantage of parallelism. If you're switching shaders for every rect you draw, then you frequently lose to the CPU.

Speaking of batching, I look at this demo [1] on my mobile phone, and I can get ~3500 sprites without dropping below 60FPS. A web page may not be able to reuse as much image data, I know. But smart game engines frequently look for ways to better batch sprites. And technically speaking, if you're using a Z-buffer, you don't need to sort opaque layers at all . You can draw the layers in back and then draw more layers i…

Interestingly, WebRender renders that demo at about 2fps. It's obviously a bug though, if you hold in the mouse, it's 60fps.

Win 10, latest nightly, WebRender enabled

Re: The web at maximum FPS: How WebRender gets rid of jank

#59

Earlier quoted context omitted.

Firefox 57 doesn’t have WebRender on unless you explicitly turn it on; did you? It would be reasonale not to, as it’s still kinda buggy.

Didn’t know that! I’ll be honest I was wondering what the hype was about because it didn’t seem that fast to me...

The new improvements to Firefox fall under a project called "Quantum". Firefox 57 is merely the first Firefox release to have any Quantum components enabled, in particular Quantum CSS (a.k.a. Servo's CSS engine, Stylo) and Quantum Flow (which is a general umbrella project for making Firefox UI more responsive). Here are the others: https://wiki.mozilla.org/Quantum

Re: The web at maximum FPS: How WebRender gets rid of jank

#60
Humourously enough, when I worked on a team that was writing a graphical web browser for mobile in the late 90's [1], they used a display list for rendering.

The reasoning was somewhat different, web pages were essentially static (we didn't do "DHTML"), if the page rendering process could generate an efficient display list, then the page source could be discarded, and only the display list needed to be held in memory, this rendering could then be pipelined with reading the page over the network, so the entire page was never in memory.

Full Disclosure: while I later wrote significant components of this browser (EcmaScript, WmlScript, SSL, WTLS, JPEG, PNG), the work I'm describing was entirely done by other people!

[1] - I joined in 97, the first public demo was at GSM World Congress Feb 98

Post reply on HN