Clipchamp 的视频编辑器 PWA 安装量每月增长了 97%

PWA、WebAssembly 和 ChromeOS 如何帮助一款基于 Web 的视频编辑器为 1200 万用户提供更出色的性能和更具吸引力的体验。

Sören Balko

97_%

PWA 安装量的月度增长

2.3_x

效果提升

9_%

PWA 用户留存率更高

Clipchamp 是一款浏览器内在线视频编辑器，可让任何人都能通过视频讲述值得分享的故事。全球超过 1200 万创作者使用 Clipchamp 轻松编辑视频。我们提供简单易用的视频制作解决方案，从剪裁和剪辑等直观工具，到屏幕录制工具等实用功能，甚至还有表情包制作工具。

谁在使用 Clipchamp？

我们的用户（我们称之为日常编辑者）非常多元化。使用 Clipchamp，您无需任何专业知识即可成为视频编辑者。具体而言，我们目前发现销售、支持培训和产品营销团队在使用我们的摄像头和屏幕录制工具制作快速说明内容，并添加文字和 GIF 以提高内容吸引力。我们还发现，许多小型企业会在移动中编辑和发布社交视频。

他们面临哪些挑战？

我们知道，视频编辑一开始可能会让人望而生畏。他们认为这很难，可能是因为之前使用复杂的编辑软件时遇到过令人沮丧的体验。与此相反，Clipchamp 专注于简单易用，提供文字叠加层、库存视频和音乐、模板等支持。

我们发现，大多数普通编辑者并不想制作动画杰作。我们与用户进行大量交流，不断提醒自己，用户很忙，只希望尽可能快速、轻松地向世界分享自己的故事，因此我们会将这点作为重点。

开发 Clipchamp PWA

Clipchamp 致力于帮助用户通过视频讲述自己的故事。为了实现这一愿景，我们很快意识到，允许用户在制作视频项目时使用自己的视频片段非常重要。

这一洞见让 Clipchamp 的工程团队面临着压力，他们需要开发一种能够在 Web 应用中高效处理数 GB 级媒体文件的技术。考虑到网络带宽限制，我们很快就排除了传统的云端解决方案。通过零售互联网连接上传大型媒体文件时，通常需要等待很长时间才能开始编辑，这会导致用户体验不佳。

因此，我们改用完全在浏览器中运行的解决方案，在该解决方案中，视频处理的所有“重活”都是使用最终用户设备上可用的硬件资源在本地完成的。我们从战略层面押注于 Chrome 浏览器，进而押注于 ChromeOS 平台，以帮助我们克服构建浏览器内视频创作平台时不可避免的挑战。

视频处理需要大量资源，会影响计算机和存储资源。我们最初是在 Google 的（可移植）原生客户端 (PNaCl) 之上构建 Clipchamp 的第一个版本。虽然最终被淘汰，但 PNaCl 为我们的团队提供了有力证明，即 Web 应用可以在最终用户硬件上运行，同时又能实现快速运行和低延迟。

后来改用 WebAssembly 时，我们很高兴地看到 Chrome 率先采用了 MVP 后功能，例如批量内存操作、线程处理，以及最近推出的固定宽度矢量操作。我们的工程团队一直期待着后者，因为它让我们能够优化视频处理堆栈，以利用当代 CPU 上常见的 SIMD 操作。利用 Chrome 对 WebAssembly SIMD 的支持，我们能够加快一些特别高要求的工作负载（例如 4K 视频解码和视频编码）的速度。

编码器性能（1080p，30 fps 时为 8.33 秒）。不使用 SIMD 的默认预设：25 秒。使用 SIMD 的默认预设：约 13 秒。不使用 SIMD 的压缩预设：约 83 秒。使用 SIMD 的压缩预设：约 33 秒。不使用 SIMD 的质量预设（新）：约 75 秒。使用 SIMD 的质量预设：约 30 秒。

我们的一位工程师之前几乎没有任何相关经验，但在不到一个月的时间里，他就成功将性能提高了 2.3 倍。虽然这些增强功能目前仍仅限于 Chrome 源代码试用版，但我们已经能够面向大多数用户推出这些 SIMD 增强功能。虽然我们的用户运行的硬件设置截然不同，但我们能够确认生产环境中的性能提升幅度与测试环境大致相同，并且失败率没有受到任何不利影响。

最近，我们集成了新兴的 WebCodecs API，该 API 目前在另一个 Chrome 源试用中提供。借助这项新功能，我们将能够进一步提升许多热门 Chromebook 上低规格硬件的视频解码性能。

创建 PWA 后，请务必鼓励用户采用。与许多 Web 应用一样，我们专注于打造易于访问的应用，包括社交媒体登录（包括 Google 登录），让用户能够快速进入视频编辑界面，然后轻松导出视频。此外，我们还在工具栏中和菜单导航栏中以弹出式通知的形式宣传了 PWA 安装提示。

结果

我们的可安装 Chrome PWA 表现非常出色。我们很高兴地发现，与标准桌面版用户相比，PWA 用户的留存率提高了 9%。自我们推出该 PWA 以来，五个月内其安装量已大幅增加，每月增长率达到 97%。正如前面所提到的，WebAssembly SIMD 增强功能将性能提升了 2.3 倍。

2020 年 6 月：安装量约为 1,000 次。2020 年 7 月：约 5,000 次安装。2020 年 8 月：约 12,000 次安装。2020 年 9 月：安装量约为 2 万次。2020 年 10 月：约 3 万次安装。 — 过去 6 个月内 Clipchamp PWA 的安装量。

未来

我们对用户对 PWA 的互动度和采用率感到惊喜。我们认为，由于用户可以更轻松地安装和访问 PWA，Clipchamp 的用户留存率因此得到了提升。我们还发现，PWA 在编辑器方面的表现更好，这让编辑器更具吸引力，并吸引用户回访。

展望未来，我们很高兴 ChromeOS 为更多用户提供了机会，让他们可以轻松高效地完成更多工作。具体而言，我们很高兴地发现，在处理文件时，可以通过一些便捷的集成方式与本地操作系统进行交互。我们认为，这有助于繁忙的日常编辑者加快工作流程，这也是我们的首要任务之一。