Tools
Tools: 5 Ways to Take Website Screenshots Automatically in Node.js (2026)
2026-03-06
0 views
admin
1. Puppeteer (Self-Hosted) ## 2. Playwright (Microsoft's Puppeteer Alternative) ## 3. Hosted Screenshot API (SnapAPI) ## 4. Sharp + Puppeteer (Screenshots to Images) ## 5. Browserless.io (Hosted Chrome) ## When to Use Which ## Quick Performance Comparison Whether you need to monitor website changes, generate social previews, create PDF reports, or archive web content, taking screenshots programmatically is a common Node.js task. Here's every approach, with real code examples. The most common approach, but comes with operational overhead: Pros: Full control, free, customizable Cons: Memory-hungry (400MB+), cold starts, needs a server with Chrome installed Same trade-offs as Puppeteer — great locally, painful in production. If you're running on serverless (Vercel, AWS Lambda) or just don't want to maintain headless Chrome: Pros: No server maintenance, works in serverless, scales automatically Cons: Costs money at scale (Pro: $19/mo for 10K calls) Get an API key: opspawn.com/snapapi For image processing after capture: Another managed option for when you need full browser control but not a full server: A simple https://example.com screenshot: For most use cases where screenshots aren't the core product, a hosted API is the pragmatic choice. For pixel-perfect control or complex interactions, self-hosted wins. Got a screenshot use case? Try SnapAPI free — 100 calls/month with no credit card required. Templates let you quickly answer FAQs or store snippets for re-use. Are you sure you want to ? It will become hidden in your post, but will still be visible via the comment's permalink. as well , this person and/or COMMAND_BLOCK: npm install puppeteer COMMAND_BLOCK: npm install puppeteer COMMAND_BLOCK: npm install puppeteer CODE_BLOCK: const puppeteer = require("puppeteer"); const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); await page.screenshot({ path: "screenshot.png", fullPage: true }); await browser.close(); CODE_BLOCK: const puppeteer = require("puppeteer"); const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); await page.screenshot({ path: "screenshot.png", fullPage: true }); await browser.close(); CODE_BLOCK: const puppeteer = require("puppeteer"); const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); await page.screenshot({ path: "screenshot.png", fullPage: true }); await browser.close(); COMMAND_BLOCK: npm install @playwright/test npx playwright install chromium COMMAND_BLOCK: npm install @playwright/test npx playwright install chromium COMMAND_BLOCK: npm install @playwright/test npx playwright install chromium CODE_BLOCK: const { chromium } = require("playwright"); const browser = await chromium.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); await page.screenshot({ path: "screenshot.png", fullPage: true }); await browser.close(); CODE_BLOCK: const { chromium } = require("playwright"); const browser = await chromium.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); await page.screenshot({ path: "screenshot.png", fullPage: true }); await browser.close(); CODE_BLOCK: const { chromium } = require("playwright"); const browser = await chromium.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); await page.screenshot({ path: "screenshot.png", fullPage: true }); await browser.close(); COMMAND_BLOCK: npm install snapapi-js COMMAND_BLOCK: npm install snapapi-js COMMAND_BLOCK: npm install snapapi-js CODE_BLOCK: import SnapAPI from "snapapi-js"; const client = new SnapAPI({ apiKey: "your-api-key", // Free tier: 100 calls/month baseUrl: "https://api.opspawn.com", }); // Take a screenshot const screenshot = await client.capture("https://example.com"); // → Returns PNG buffer // Generate a PDF const pdf = await client.pdf("https://example.com"); // → Returns PDF buffer CODE_BLOCK: import SnapAPI from "snapapi-js"; const client = new SnapAPI({ apiKey: "your-api-key", // Free tier: 100 calls/month baseUrl: "https://api.opspawn.com", }); // Take a screenshot const screenshot = await client.capture("https://example.com"); // → Returns PNG buffer // Generate a PDF const pdf = await client.pdf("https://example.com"); // → Returns PDF buffer CODE_BLOCK: import SnapAPI from "snapapi-js"; const client = new SnapAPI({ apiKey: "your-api-key", // Free tier: 100 calls/month baseUrl: "https://api.opspawn.com", }); // Take a screenshot const screenshot = await client.capture("https://example.com"); // → Returns PNG buffer // Generate a PDF const pdf = await client.pdf("https://example.com"); // → Returns PDF buffer CODE_BLOCK: const puppeteer = require("puppeteer"); const sharp = require("sharp"); const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); const screenshotBuffer = await page.screenshot({ fullPage: true }); // Resize to thumbnail const thumbnail = await sharp(screenshotBuffer) .resize(400, 300, { fit: "cover" }) .toBuffer(); CODE_BLOCK: const puppeteer = require("puppeteer"); const sharp = require("sharp"); const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); const screenshotBuffer = await page.screenshot({ fullPage: true }); // Resize to thumbnail const thumbnail = await sharp(screenshotBuffer) .resize(400, 300, { fit: "cover" }) .toBuffer(); CODE_BLOCK: const puppeteer = require("puppeteer"); const sharp = require("sharp"); const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto("https://example.com"); const screenshotBuffer = await page.screenshot({ fullPage: true }); // Resize to thumbnail const thumbnail = await sharp(screenshotBuffer) .resize(400, 300, { fit: "cover" }) .toBuffer(); CODE_BLOCK: const puppeteer = require("puppeteer"); const browser = await puppeteer.connect({ browserWSEndpoint: `wss://chrome.browserless.io?token=${YOUR_TOKEN}`, }); const page = await browser.newPage(); // ... rest of your puppeteer code CODE_BLOCK: const puppeteer = require("puppeteer"); const browser = await puppeteer.connect({ browserWSEndpoint: `wss://chrome.browserless.io?token=${YOUR_TOKEN}`, }); const page = await browser.newPage(); // ... rest of your puppeteer code CODE_BLOCK: const puppeteer = require("puppeteer"); const browser = await puppeteer.connect({ browserWSEndpoint: `wss://chrome.browserless.io?token=${YOUR_TOKEN}`, }); const page = await browser.newPage(); // ... rest of your puppeteer code - Self-hosted Puppeteer (cold): ~2-4s - Self-hosted Puppeteer (warm): ~500ms - SnapAPI: ~800ms (includes network)
toolsutilitiessecurity toolswebsitescreenshotsautomaticallypuppeteerhosted