跳转到主要内容

本周项目：Kap

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

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

这篇博文是该系列的第一篇，介绍的是由 geodistributed 自由设计师和开发者团队 Wulkano 构建的开源屏幕录制应用 Kap。 访问 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 帧）后，我们最终不得不找到另一个解决方案。

我看到仓库里有一些 Swift 代码。那是什么？​

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

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，查看 示例，并利用优秀的 文档！