跳到主要内容

每周项目：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 > 自动布局 (macOS/iOS)。

在构建 Kap 时，您面临哪些挑战？​

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

我们花费了大量时间试图解决 getUserMedia API 性能不佳的问题，这个问题源于 Chromium。当我们着手制作 Kap 时，我们的主要目标之一是使用 Web 技术构建整个应用程序。在尝试了一切可以使其工作的方法（Retina 屏幕上的最低要求为 30 FPS）之后，我们最终不得不找到另一种解决方案。

我在 repo 中看到一些 Swift 代码。那是关于什么的？​

由于被迫寻找 getUserMedia 的替代方案，我们开始尝试 ffmpeg。除了是最好的音频和视频转换工具之一之外，它还具有在几乎任何操作系统中录制屏幕的功能，并且我们能够录制清晰的视频，满足我们在 Retina 屏幕上 30 FPS 的最低要求。问题？性能是“😩”，CPU 使用率变得非常糟糕。因此，我们回到了绘图板，讨论了我们的选择，并意识到我们必须做出妥协。这导致了 Aperture，我们自己的用于 macOS 的屏幕录制库，用 Swift 编写。

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 编写 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，查看 示例 并利用出色的 文档！