Browserless v2 is out 🚀! Read more about it here.

Headless Chrome with a GPU instance is fast!

Adrian Antonio Molina
Adrian Antonio MolinaAugust 31, 2023

In our pursuit of providing cutting-edge technology solutions, we are thrilled to introduce headless chrome now with dedicated GPU instances! Harnessing the power of GPU capabilities is now more crucial than ever, especially when working with resource-intensive tasks like 3D images, animations, and stunning graphics. If your use case involves screenshots, scraping, testing or screencasting then keep reading!

The Power of GPU in Headless Chrome: Elevating Performance and Experience

Modern computing demands efficiency and speed, and that’s precisely where the role of hardware acceleration shines. A dedicated GPU (Graphics Processing Unit) can make a world of difference in both performance and responsiveness. But beyond these technical aspects, it also contributes to an overall superior experience for end-users and the development team alike.

  1. Supercharged Performance: Rendering intricate 3D images and animations requires significant computational muscle. With a dedicated GPU, the processing time is drastically reduced, resulting in faster load times and smoother visual transitions.
  2. Empowering Development: For developers and designers, GPU acceleration opens up a world of possibilities. Automating tests, capturing screenshots, and recording videos are fundamental tasks. With GPU support, these processes are not only expedited but also maintain a level of quality that’s essential for creating exceptional digital products. Imagine being able to run complex test suites in a fraction of the time it used to take. With GPU instances, the testing process becomes more efficient, enabling rapid iterations and quicker identification of potential issues. This translates to shorter development cycles, allowing your team to focus on refining the final product rather than waiting for tests to complete.
  3. WebGL and WebGPU: WebGL and the emerging WebGPU standard rely heavily on GPU processing power to create stunning, interactive 3D graphics directly in web browsers. With dedicated GPU instances, these technologies reach their full potential, allowing immersive web experiences, whether it’s 3D visualizations, interactive games, or complex simulations.
  4. Streaming is seamless: For use cases where customers are interacting with the remote browser, using a GPU will make the site render animations smoothly and actions perform similar to how they do on a local browser.

Comparison

Here is a comparison to show the importance of GPU when working with animations. This comparison proves that if you take screenshots or screen records, having a GPU is a great option to consider.

  • The page loads 8 times faster when the GPU is enabled.
  • More natural and fluent animation and experience with hardware acceleration.

Xbox Elite Wireless Controller Series 2 – Core

Loading time GPU enabled: 12.6 secsLoading time GPU disabled: 101.7 secs
headless chrome with GPU
headless chrome without GPU
Performance differences between GPU and non-GPU instances

When Chrome doesn’t have a GPU, it will use the attached CPU instead to perform these animations, making for a slower page load and subpar animations.

How do I know if the GPU is enabled?

You can take a screenshot of chrome://gpu page to identify what features are enabled and play with different chrome flags to enable and disable GPU acceleration.

Here is an example using Puppeteer.

const puppeteer = require('puppeteer');

const BROWSERLESS_TOKEN = 'YOUR_TOKEN';

(async () => {
  const browser = await puppeteer.connect({
    browserWSEndpoint: `wss://chrome.browserless.io?token=${BROWSERLESS_TOKEN}&--use-gl=angle&--use-angle=gl`,
  });
  const page = await browser.newPage();
  await page.goto('chrome://gpu');
  await page.screenshot({ path: `gpu.jpg` });
  browser.close();
})();

Chrome Flags to enable or disable GPU hardware acceleration

These are some chrome flags that let us enable and disable hardware acceleration:

Enable WebGL

--use-gl=angle

--use-angle=gl

Disable WebGL

--use-angle=disabled

Enable WebGPU

--enable-unsafe-webgpu


Here you can find more information about ANGLE and WebGPU

Embrace the GPU Advantage

The introduction of dedicated GPU instances marks a significant milestone in our commitment to providing top-tier technology solutions. If you have questions about dedicated GPU instances feel free to contact us!

Share this article

Ready to try benefits of Browserless?