![](https://developer.chrome.com/static/docs/puppeteer/images/hero.png?authuser=8&%3Bhl=zh-cn&hl=zh-cn)
木偶操作师
Puppeteer 是一个 JavaScript 库,提供高级 API,可通过 Chrome DevTools 协议和 WebDriver BiDi 自动执行 Chrome 和 Firefox 操作。
您可以使用它在浏览器中自动执行任何操作,从截取屏幕截图和生成 PDF 到浏览和测试复杂的界面以及分析性能。
概念
网页互动
网络拦截
截取屏幕截图
运行模式
博文
Spotify 如何使用 Picture-in-Picture API 构建 Spotify Miniplayer
了解 Spotify 迷你播放器如何从“画布摄影”转变为通过 Document Picture-in-Picture API 实现的精致体验。
滚动条驱动动画案例研究
通过 Policybazaar、redBus 和 Tokopedia 探索滚动条驱动的动画的优势。
:has() 案例研究
了解 Policybazaar 和 Tokopedia 如何使用 :has() 来获益。
容器查询案例研究
从 redBus 和 Tokopedia 了解容器查询的优势。
查看转换案例研究
redBus、Policybazaar 和 Tokopedia 都使用 View Transition API,提升了性能和流畅的界面。
Popover 案例研究
Tokopedia 使用 Popover API 减少其应用中的代码量。
Photoshop 如何处理大于内存大小的文件:
了解 Adobe 如何让用户能够在其标志性 Photoshop 应用的 Web 版本上编辑超大型文件。 (本文还提供视频形式。) 2021 年,Adobe 与 Chrome 工程团队合作, 将 Photoshop 引入到 Web 平台 。该软件创新地使用了 WebAssembly,并提供了 SIMD 、 源私有文件系统 中的高性能存储、适用于画布的 P3 色彩空间 ,以及带有 Lit 的 Web 组件等功能。本文将重点介绍 Adobe Photoshop
矢量图像编辑应用 Boxy SVG 如何使用 Local Font Access API 让用户选择他们喜爱的本地字体
Local Font Access API 提供了一种机制来访问用户本地安装的字体数据,包括名称、样式和字体系列等更高级别的详细信息,以及底层字体文件的原始字节。了解 SVG 编辑应用 Boxy SVG 如何使用此 API。 (本文还提供视频形式。) Boxy SVG 是一款矢量图形编辑器。其主要用例是编辑 SVG 文件格式的绘图,以创建插图、徽标、图标和其他平面设计元素。该插件由波兰开发者 Jarosław Foksa 开发,最初于 2013 年 3 月 15 日发布。Jarosław 运营着
游戏编辑器 Construct 3 如何使用 File System Access API 让用户保存游戏
File System Access API 支持读取、写入和文件管理功能。了解 Construct 3 如何使用此 API。 (本文还提供视频形式。) Construct 3 是由兄弟 Thomas 和 Ashley Gullen 开发的游戏编辑器。在游戏编辑器的第三次迭代中,这两个团队在先前针对 Windows 和 NW.js 构建游戏后,完全 “[押注] 浏览器将成为新的操作系统” 。您可以通过浏览编辑器的 展示版 或完成 导览
LEGO® Education 如何使用网络蓝牙和 Web Serial API
LEGO Education 利用网络的力量来尽可能简化将乐高模型连接到计算机的过程。