DEV Community

BadDev
BadDev

Posted on

One liner to take page screenshots for your projects

Did you ever have a need to take a screenshot of a page for your project? Did you consider using one of those paid screenshot taking API services? In 99% of use cases you don't need those.

One liner

Ensure you have chrome or chromium installed

chromium --disable-gpu --bwsi  --disable-audio-output  --disable-logging  --disable-notifications  --disable-sync  --disable-smooth-scrolling  --headless  --window-size=1920,1080  --hide-scrollbars  --virtual-time-budget=10000  --incognito  --disable-accelerated-2d-canvas  --disable-accelerated-mjpeg-decode  --disable-accelerated-video-decode  --disable-accelerated-video-encode  --screenshot=screenshot.png  https://dev.to/
Enter fullscreen mode Exit fullscreen mode

In the options I disable a number of parameters most likely not supported on VMs, like GPU acceleration and audio. I disable sync and load browser in headless, incognito mode.

Important params

size=1920,1080 - Select the size in which the page will be rendered
hide-scrollbars - Let's make screenshot clean without scrollbars
screenshot=screenshot.png - Name of the screenshot file
virtual-time-budget=10000 - Amount of time in ms that browser will let page to load before taking screenshot. Necessary for some heavy or SPA pages.

Final parameter is the url of the page to screenshot.

And that's all to it. That's how we do it at pagereview.io

Top comments (0)