跳到主要内容

每周项目：Kap

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

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

这是本系列的第一篇文章，介绍了 Kap，一款由 Wulkano（一个由地理分散的自由设计师和开发者组成的团队）构建的开源屏幕录制应用。

Kap Screencast

什么是 Kap？​

Kap 是一款开源屏幕录制工具，主要为设计师和开发者设计，以便他们轻松捕获工作内容。人们使用它来分享动画原型、记录 bug、制作有趣的 GIF 以及介于两者之间的所有内容。

我们看到各种年龄和背景的人在教育场景、屏幕录像、教程等中使用它……不胜枚举。甚至用于创建生产资产！我们对这个小小的副项目受到如此好评感到非常惊讶。

你为什么构建它？​

这是一个很好的问题，市面上又不缺少屏幕录制工具！我们觉得其他的选择要么过于复杂，要么过于昂贵，要么功能太受限。没有什么感觉 刚刚好，满足我们的日常需求。我们还认为，如果工作中使用 的工具是开源的，那就太棒了，这样每个人都可以帮助塑造它们。构建 Kap 最终更多的是关于我们没有做什么。一切都在细节中，一系列小的改进累积起来，形成了我们想要使用的工具的轮廓。

然而，或许最重要的是，Kap 已成为一个让我们放下烦恼、尽情享受为自己和与我们相似的人构建东西的地方。创造一个可以宣泄、尝试新事物并享受手艺的环境非常重要。没有要求，没有压力，没有期望。设计师和开发者应该做副业项目吗？是的，他们应该。

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

有以下几个原因：

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

我们认为应用的未来在于浏览器，但我们尚未完全实现。Electron 是迈向未来征程中的重要一步。它不仅使应用本身更易访问，也使构建它们的代码更易访问。一个有趣的想法是，设想未来操作系统就是浏览器，而标签页本质上就是 Electron 应用。

此外，作为主要的 Web 开发者，我们非常喜欢 JavaScript 的同构特性，即你可以在客户端、服务器以及现在的桌面运行 JS。使用 Web 技术 (HTML、CSS 和 JS)，许多事情比原生简单得多：更快的原型开发、更少的代码、flexbox 优于自动布局 (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 应用会比较占用 RAM，但再说一次，这实际上是 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。

我们也是构建团队的忠实粉丝，感谢他们的奉献和支持，以及他们所维护的活跃友好的社区。拥抱大家！

Kap 的下一步是什么？​

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

什么是 Wulkano？​

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

有什么对其他开发者可能有用的 Electron 技巧吗？​

利用并参与到这个出色的社区中来，查看Awesome Electron，查看示例，并充分利用优秀的文档！