webrender-firefox

Smooth Animations for the Best Experience

Firefox is an excellent browser — but by default, the modern GPU rendering engine called WebRender is not enabled for many users. As a result, animations and transitions on websites can appear choppy, even though the hardware is fully capable of handling them smoothly.

What is WebRender?

WebRender is Mozilla’s GPU-based rendering engine. Instead of rendering webpages primarily on the CPU, it uses the graphics card directly — similar to how a video game works. The result is smoother 60 fps animations, better scrolling performance, and lower CPU usage.

Enable WebRender Manually (Step by Step)

Step 1 – Open about:config

Enter the following into the Firefox address bar:

about:config

Press Enter and click “Accept the Risk and Continue.”


Step 2 – Search for the Settings and Enable Them

Search for the following four entries one by one and set each of them to true (double-click):

SettingDescription
gfx.webrender.enabledEnable the WebRender engine
gfx.webrender.allForce WebRender for all content
layers.acceleration.force-enabledForce hardware acceleration
layers.gpu-process.enabledRun GPU rendering in a separate process

Step 3 – Restart Firefox

Close Firefox completely and start it again.


Step 4 – Verify That It Works

Enter the following into the address bar:

about:support

Scroll down to:

Graphics → Compositing

It should now display WebRender instead of Basic.

⚠️ Note: layers.acceleration.force-enabled may cause visual glitches on very old GPUs. If anything looks wrong, simply set it back to false.

Result

After enabling WebRender, all animations on the website load and run smoothly — including the hero image animation on the homepage.