Playwright 截图清晰度取决于 device_scale_factor 和 viewport 设置，需在 new_context() 中指定 device_scale_factor=2 以提升渲染精度，而非仅缩放视口或页面元素。
Playwright 中 page.screenshot() 默认不缩放，需手动控制视口与设备像素比
Playwright 截图本质是按当前页面视口（viewport）像素尺寸抓取，不会自动放大内容来提升清晰度。所谓“高清快照”，实际依赖两个底层参数：device_scale_factor（设备像素比）和 viewport 尺寸。默认值通常是 device_scale_factor=1，哪怕页面用 transform: scale(1.5) 视觉放大，截图仍按原始逻辑像素输出，文字边缘会模糊。
实操建议：
- 优先用
device_scale_factor=2启动浏览器上下文（而非仅设置 viewport），这样 CSS 像素 → 物理像素映射更精细，字体/边框渲染更锐利 - 避免在截图前用 JS 执行
document.body.style.transform = 'scale(1.5)'—— 这会导致布局偏移、元素定位错乱，full_page=True截图可能漏掉底部 - 若必须视觉缩放（如演示响应式断点），应配合调整
viewport宽高，例如缩放 1.5 倍时设viewport={'width': 1200, 'height': 800}，再用device_scale_factor=2输出等效 2400×1600 的高清图
如何用 device_scale_factor 真正提升截图分辨率？
这个参数必须在创建 browser.new_context() 时传入，不能后期修改。它影响整个上下文的渲染管线：CSS 像素单位（如 16px）会被乘以该因子后送入光栅化器，所以文字笔画、SVG 路径、border-radius 圆滑度都会更精细。
常见错误现象：
- 直接对
page对象调用set_viewport_size()并不能提高 DPI —— 它只改视口大小，不改渲染精度 - 在 Chromium 中设
device_scale_factor=3可能触发 GPU 内存超限，报错Failed to allocate memory for raster buffer；推荐稳妥值为2（Retina / 高分屏通用） - Firefox 不支持
device_scale_factor，传入会被忽略；Safari（WebKit）支持但行为略有差异，测试时需单独验证
示例代码片段：
context = browser.new_context(
viewport={'width': 1440, 'height': 900},
device_scale_factor=2,
)
page = context.new_page()
page.goto("https://example.com")
page.screenshot(path="high_dpi.png", full_page=True)
截取局部区域高清图时，clip 和 mask 的精度陷阱
当用 clip={'x': 100, 'y': 200, 'width': 800, 'height': 600} 截指定区域，Playwright 仍基于当前 device_scale_factor 渲染，但坐标值始终按 CSS 像素（即逻辑像素）计算。这意味着：若你通过 JS 获取了某个元素的 getBoundingClientRect()，其 x/y/width/height 可直接用于 clip，无需乘以缩放系数 —— Playwright 内部已自动对齐。
容易踩的坑：
- 手动用
page.evaluate()计算元素位置后，误把返回值当作物理像素再除以device_scale_factor，导致裁剪框偏移 -
mask参数（用于隐藏敏感区域）不支持抗锯齿，边缘会生硬；如需柔化，得截图后用 Pillow 后处理 - 滚动后截屏，若元素刚进入视口但尚未完成 repaint（比如有 CSS 动画或 lazyload 图片），
clip可能截到空白或旧状态 —— 应加page.wait_for_timeout(100)或监听requestfinished
导出 PNG 与 WebP 格式对“高清感”的实际影响
格式本身不提升分辨率，但影响压缩伪影。PNG 是无损格式，适合 UI 截图中带大块纯色、文字、图标等场景；WebP 在同等体积下可保留更多细节，尤其对含阴影、渐变的现代组件更友好。
关键参数差异：
-
screenshot(..., type="png")：默认无压缩，文件较大，但文字边缘绝对锐利 -
screenshot(..., type="webp", quality=95)：quality范围 0–100，低于 80 时文字易出现色带或模糊；注意 WebP 不支持透明通道 alpha（除非源页面背景为透明且启用omit_background=True） - 不要用
animations="disabled"强制禁用动画来“加速截图”——部分 UI 框架（如 MUI）依赖 CSS 动画触发布局重排，禁用后可能导致组件未正确渲染
真正影响观感的，往往不是分辨率数字，而是字体抗锯齿开关、subpixel rendering 是否启用 —— 这些由操作系统 + 浏览器渲染后端决定，Playwright 无法干预。所以同一段代码，在 macOS 上截出的文字通常比 Windows 更细腻。
Python免费学习笔记（深入）：立即使用
在学习笔记中，你将探索 Python 的核心概念和高级技巧！
