跳转到主要内容

本周项目：Kap

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

Electron 社区正在迅速壮大，人们以前所未有的速度创建着强大的新应用程序和工具。为了庆祝这种创造性的势头并让社区了解这些新项目，我们决定开始每周发布一个博客系列，介绍值得关注的 Electron 相关项目。

这篇博文是该系列的第一篇，介绍由 Wulkano（一个地理分布的自由设计师和开发者团队）构建的开源屏幕录制应用程序 Kap。

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 应用可能会占用大量内存，但这实际上是 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，查看 示例，并充分利用出色的 文档！