跳到主要内容

本周项目：Kap

·7 分钟阅读
skllcrn
skllcrn
sindresorhus
sindresorhus
zeke
zeke

Electron 社区发展迅速，人们正以惊人的速度创建强大新颖的应用和工具。为了庆祝这一创造力，并让社区了解这些新项目，我们决定启动一个每周博客系列，介绍值得关注的 Electron 相关项目。

这篇文章是该系列的第一篇，介绍了 Kap，一个由 Wulkano 构建的开源屏幕录制应用，Wulkano 是一支由分布式自由设计师和开发者组成的团队。

Kap Screencast

什么是 Kap？​

Kap 是一个开源屏幕录像机，主要为设计师和开发者构建，以便他们轻松捕获自己的工作成果。人们用它来分享动画原型、记录错误、创建有趣的 GIF 等等。

我们看到各个年龄段和背景的人们在教育环境、截屏视频、教程中使用它……清单很长。甚至用来创建生产资产！我们对我们这个小小的副项目获得的良好反响感到非常惊讶。

你为什么要构建它？​

这是个很好的问题，市面上又不缺乏屏幕录像机！我们觉得现有的替代方案要么太复杂、太贵，要么太受限。没有哪个能完美地满足我们日常的需求。我们也认为，当我们用来工作的工具是开源的时候，那真是太棒了，这样每个人都可以帮助塑造它们。构建 Kap 最终更多的是关于我们没有做什么。一切都在细节里，是小改进的累积，构成了我们想要使用的工具的轮廓。

然而，也许最重要的是，Kap 成了我们暂时放下烦恼，为自己和像我们一样的人们有趣地构建一些东西的地方。创造一个可以尽情发泄、尝试新事物、享受手艺的环境至关重要。没有要求，没有压力，没有期望。设计师和开发者应该做副项目吗？是的。他们应该。

你为什么选择在 Electron 上构建 Kap？​

原因有很多

  • Web 技术
  • 团队大多数是 Web 开发者
  • 我们投入了 JavaScript
  • 它为更多人贡献打开了大门
  • Electron 本身是开源的
  • node_modules 的强大且易于维护的模块化
  • 跨平台可能性

我们认为应用的未来在浏览器中，但我们尚未完全达到那个境界。Electron 是通往那个未来的重要一步。它不仅使应用本身更容易访问，也使其构建代码更容易访问。一个有趣的想法是想象一个未来，操作系统是一个浏览器，而选项卡本质上是 Electron 应用。

此外，作为主要的 Web 开发者，我们是 JavaScript 同构性（即可以在客户端、服务器和现在的桌面运行 JS）的忠实拥护者。使用 Web 技术（HTML、CSS 和 JS），许多事情比原生简单得多：更快的原型开发、更少的代码、flexbox > auto-layout (macOS/iOS)。

你在构建 Kap 时遇到过哪些挑战？​

利用 Electron 提供的资源来录制屏幕是最大的挑战。它们的性能不足以满足我们的要求，这将使项目在我们看来以失败告终。虽然这不是 Electron 本身的错误，但原生开发和使用 Web 技术构建桌面应用之间仍然存在差距。

我们花费了大量时间试图解决 getUserMedia API 性能差的问题，这个问题源于 Chromium。我们开始着手构建 Kap 时，主要目标之一就是用 Web 技术构建整个应用。在我们尝试了所有可能的方法使其工作（最低要求是在 Retina 屏幕上达到 30 FPS）后，我们最终不得不寻找其他解决方案。

我在仓库中看到一些 Swift 代码。这是怎么回事？​

被迫寻找 getUserMedia 的替代方案，我们开始尝试 ffmpeg。除了是音频和视频转换的最佳工具之一外，它还具有在几乎任何操作系统中录制屏幕的功能，我们能够录制清晰的视频，满足我们在 Retina 屏幕上 30 FPS 的最低要求。问题呢？性能是"😩"，CPU 使用率失控。所以我们回到了起点，讨论了我们的选择，并意识到我们必须做出妥协。这导致了 Aperture 的诞生，这是我们自己用 Swift 编写的适用于 macOS 的屏幕录制库。

Electron 应该在哪些方面改进？​

我们都知道 Electron 应用可能会比较占用内存，但这又是 Chromium 的问题。这是它工作方式的一部分，而且很大程度上取决于你运行的应用，例如 Kap 和 Hyper 通常使用的内存少于 100MB。

我们看到的一个最大的改进领域是负载大小，特别是 Electron 分发 Chromium 的方式。一个想法是拥有一个共享的 Electron 核心，并让应用安装程序检查系统上是否已经存在。

创建跨平台的 Electron 应用的体验可以更好。目前，不同平台之间存在太多不一致、平台特定的 API 和缺失的功能，导致你的代码库中充斥着 if-else 语句。例如，透明效果（vibrancy）只在 macOS 上受支持，自动更新在 macOS 和 Windows 上的工作方式不同，甚至在 Linux 上不受支持。透明效果在 Linux 上时好时坏，通常是坏。

调用原生系统 API 也应该更容易。Electron 提供了一套非常好的 API，但有时你需要它不提供的功能。创建原生 Node.js 插件是一个选项，但使用起来很痛苦。理想情况下，Electron 应该提供一个良好的 FFI（外部函数接口）API，就像 fastcall。这将使我们能够用 JavaScript 编写 Swift 部分，而不是原生代码。

你最喜欢 Electron 的地方是什么？​

我们最喜欢的是任何了解 Web 开发知识的人都可以构建并贡献多平台原生体验。更不用说在上面开发的便捷和愉悦、出色的文档和蓬勃发展的生态系统。

从前端的角度来看，构建 Kap 与构建一个简单的使用浏览器 API 的网站感觉没什么不同。Electron 在使应用开发与 Web 开发相似（基本上相同）方面做得非常出色。实际上，它如此简单，以至于我们不需要框架或类似工具来帮助我们，只需要干净、模块化的 JS 和 CSS。

我们也是构建 Electron 团队的忠实粉丝，他们的奉献精神和支持，以及他们维护的活跃友好的社区。拥抱所有的人！

Kap 的下一步是什么？​

我们的下一步是审查应用，为 2.0.0 里程碑做准备，这包括用 React 重写以及支持插件，允许开发者扩展 Kap 的功能！我们邀请大家关注项目并在我们的 GitHub 仓库上贡献。我们正在聆听，希望听到尽可能多人的声音，请告诉我们如何让 Kap 成为对您而言最好的工具！

什么是 Wulkano？​

Wulkano 是一家设计工作室和数字集体，一支由远程技术人员组成的团队，他们喜欢一起做客户项目和自己的项目。我们是一个分布式的但紧密联系的团队，来自不同地方和背景，在我们的虚拟办公室（碰巧就是基于 Electron 的 Slack！）分享知识、想法、经验，但最重要的是有趣的 GIF 和表情包。

有哪些对其他开发者有用的 Electron 技巧吗？​

充分利用并参与精彩的 社区，查看 Awesome Electron，看看 示例 并充分利用出色的 文档！