The Quantum Flow and Photon projects have exciting newsletters. The Quantum graphics project (integrating WebRender in Firefox) hasn’t provided a newsletter so far and people have asked for it, so let’s give it a try!

This newsletter will not capture everything that is happening in the project, only some highlights, and some of the terminology might be a bit hard to understand at first for someone not familiar with the internals of Gecko and WebRender. I will try to find the time to write a bit about WebRender’s internals and it will hopefully provide more keys to understanding what’s going on here.

The terms layer-full/layers-free used below refer to the way WebRender is integrated in Gecko. Our first plan was to talk to WebRender using the layers infrastructure in the short term, because it is the simplest approach. This is the “layers-full” integration. Unfortunately the cost of building many layers to transform into WebRender display items is high and we found out that we may not be able to ship WebRender using this strategy. The “layers-free” integration plan is to translate Gecko’s display items into WebRender display items directly without building layers. It is more work but we are getting some encouraging results so far.

Some notable (recent) changes in WebRender

Glyph Cache optimizations – Glenn profiled and optimized the glyph cache and made it a lot faster.

Texture cache rewrite (issue #1572) – The new cache use pixel buffer objects to transfer images to the GPU (previously used glTexSubImage2D), and does not suffer from fragmentation issues the way the previous one did, and has a better eviction policy.

Other text related optimization in the display list serialization.

Sub-pixel positioning on Linux.

Some notable (recent) changes in Gecko

Clipping in layers free mode (Bug 1386483) – This reuses clips instead of having new ones for every display item. This will reduce the display list processing that happens on the Gecko side as well as the WebRender side. This was one of the big things missing from getting functional parity with current layers-full WebRender.

Rounded rectangle clipping in layers free mode (Bug 1370682) – This is a noticeable difference from what we do in layer-full mode. In layer-full mode we currently use mask layers for rounded clipping. Doing this directly with WebRender gives a noticeable performance improvement.

How to get the most exciting WebRender experience today:

Using Firefox nightly, go to about:config and change the following prefs:

turn off layers.async-pan-zoom.enabled

turn on gfx.webrender.enabled

turn on gfx.webrendest.enabled

turn on gfx.webrender.layers-free

add and turn on gfx.webrender.blob-images

if you are on Linux, turn on layers.acceleration.force-enabled

This will give you a peek at the future but beware there are lots of rough edges. Don’t expect the performance of WebRender in Gecko to be representative yet (Probably better to try Servo for that).

All of the integration work is now happening in mozilla-central and bugzilla, WebRender development happens on the servo/webrender github repository.