What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
Use Playwright’s page.screenshot() method: open the storefront in a browser page, then save the visible viewport—or set fullPage: true to capture the scrollable page. The example below uses JavaScript and Chromium; replace the sample address with a storefront you’re authorized to access.
Capture a Shopify storefront with Playwright
Install Playwright, create a browser context and page, navigate to the storefront, and call page.screenshot() with a file path. This minimal example saves the current viewport as a PNG:
const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch();
try {
const context = await browser.newContext();
const page = await context.newPage();
await page.goto('https://your-storefront.example');
await page.screenshot({ path: 'storefront.png' });
} finally {
await browser.close();
}
})();Save the code as screenshot.js, install Playwright with npm install playwright, then run node screenshot.js. Playwright may need its browser installed separately; if launch reports a missing browser, run npx playwright install chromium. The screenshot is written to the working directory as storefront.png.
The capture call follows Playwright’s Page screenshot API. The sample domain is illustrative, not a live-store capture.
Quick wins for a faster PC:
Clear out junk files and repair common Windows errorsFree Scan →Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →#1 Best Overall
Choose viewport or full-page capture
By default, Playwright captures only the current viewport. To include the page’s scrollable content, use fullPage: true:
await page.screenshot({ path: 'storefront-full.png', fullPage: true });A full-page image can be extremely tall, especially for a product collection or long landing page. Use the default viewport capture when you need a screenshot of what a visitor initially sees; use full-page mode when below-the-fold content matters.
Set image format and pixel scale
Playwright supports PNG, JPEG and WebP screenshots. Set the type option to choose JPEG or WebP; if the file path has a matching extension, Playwright can infer the format. PNG is the default. JPEG is typically useful when you want a smaller photographic image; PNG preserves crisp text and interface edges, while WebP is another compact option. Choose based on your downstream use and verify the resulting file where format compatibility matters.
The scale option controls output pixel density. css creates one image pixel per CSS pixel. device uses device pixels and may produce a larger, higher-resolution image. For example:
Outdated Drivers Are Slowing You Down
One free scan finds every outdated or missing driver and matches the right update for your exact hardware.Free scan · exact hardware matchWindows Errors? Fix Them Before They Spread
Repair common Windows errors and clear accumulated junk for a smoother, more stable PC - no reinstall needed.Free scan · no reinstallawait page.screenshot({
path: 'storefront.webp',
type: 'webp',
scale: 'css',
});For a high-density capture, use scale: 'device' instead. The relevant options and their behavior are documented in the Playwright API reference.
Reduce movement and mask changing content
Animations, rotating banners and other changing elements can make captures harder to compare. Playwright provides screenshot options to disable animations, mask selected locators, and apply a stylesheet during capture. These controls help reduce visual distractions, but do not guarantee identical output across runs.
For example, disable animations for one capture:
await page.screenshot({
path: 'storefront-still.png',
animations: 'disabled',
});To mask a known changing element, pass a locator in mask. To apply capture-only styling, use style with CSS:
await page.screenshot({
path: 'storefront-masked.png',
mask: [page.locator('.dynamic-price')],
style: '.newsletter-popup { visibility: hidden !important; }',
});Replace the selector with one that matches the element in your storefront. A selector that matches nothing will not mask anything; a selector that matches multiple elements may mask each match. These options are described in the screenshot API.
Prepare for visual comparisons
If screenshots are regression-test baselines, capture and compare them in a consistent environment. Playwright notes that browser rendering can vary with the host operating system, browser version, settings, hardware, power source, headless mode and other factors. A baseline created on one machine may therefore differ from a later capture made under different conditions.
Playwright’s visual-comparison guidance explains that screenshot assertions wait for consecutive screenshots to match before comparing against the expected image. This helps with transient rendering changes, but environment consistency still matters. See Playwright’s visual comparisons documentation.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Shopify storefront states to check
A storefront URL does not establish that every visitor—or every automated browser—will see the same page. Password protection, consent prompts, regional storefront behavior or other access conditions may affect what appears, but their presence and handling are specific to the store. Check the captured page rather than assuming a universal Shopify state or a standard workaround.
- If the image shows an access or password page, confirm that the target is the intended public storefront and that you have authorized access.
- If a consent prompt or popup covers content, decide whether the screenshot should document that prompt or capture the page after it is handled. Do not assume Playwright dismisses it automatically.
- If the screenshot is blank or incomplete, inspect the page in a headed browser and check navigation errors before changing capture options.
Troubleshoot common capture problems
- Playwright cannot launch Chromium: Install the browser binary with
npx playwright install chromium, then rerun the script. - The screenshot contains only the top of the page: The default is viewport capture. Set
fullPage: trueif the entire scrollable page is needed. - The output is difficult to compare: Keep the browser and host environment consistent, and consider disabling animations or masking dynamic elements.
- The file has an unexpected format or size: Set
typeandscaleexplicitly, and make the filename extension agree with the chosen format. - The captured storefront is not the expected state: Check the URL, navigation result and any storefront-specific access or consent screen. Shopify states are not established as universal by the Playwright screenshot API.
Or skip the browser setup
ScreenshotNeo offers a screenshot API and MCP server. A single GET request can return a screenshot as PNG, JPEG or WebP, or a PDF. Its clean-shot workflow accepts cookie or consent banners like a visitor and removes more than 60 known consent platforms, newsletter popups and chat widgets; those steps can each be turned off. Bot checks or CAPTCHAs, blank pages, timeouts, failed loads and cache hits cost nothing, and response headers report the page verdict and billing status. Its MCP server provides take_screenshot, get_page_info and capture_pdf tools for AI agents and other MCP clients.
Recommended Free Tools
Example cURL request (replace the URL and use your API key):
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://your-storefront.example -o shot.webpSee the ScreenshotNeo documentation for API options. One thousand screenshots per month are free with no card; paid plans start at $5 for 3,000 screenshots. Sign up for the free plan.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
