• 日常搜索
  • 百度一下
  • Google
  • 在线工具
  • 搜转载

为跨平台应用程序开发引入Fuse

在开发跨平台工作的应用程序时,不乏工具。它最初是从 PhoneGap 开始的,后来变成了cordova。然后是具有接近原生性能的混合框架,例如react Native和nativescript。而最近又出现了谷歌的颤振。 

我的观点是那里有很多这样的框架。如果您只是在 Google 上快速搜索“跨平台移动开发框架”,您就会相信我。如果您才刚刚开始开发移动应用程序,那可能会让人无所适从。这就是为什么了解您的选择很重要的原因。

因此,今天我将向您介绍 Fuse,这是另一个用于开发跨平台移动应用程序的平台。

在本文中,我的目标是回答以下问题:

  • 什么是保险丝?

  • 它的优点和缺点是什么?

  • 它是如何工作的?

  • 它与 React Native 等更流行的替代品相比如何?

什么是保险丝?

Fuse 是一个使用 UX Markup 和javascript开发跨平台应用程序的平台。它与 React Native 和 NativeScript 属于同一类别,但其主要卖点在于提供使开发人员和设计人员能够实时协作的工具。

Fuse 使用 UX 标记,这是一种基于 XML 的语言,它为 UI 提供构建块。它还允许您指定不同组件在用户与其交互时的行为方式,因此名称为“UX”。

开始使用 Fuse 时要了解的另一件重要事情是,它不是像 Cordova 这样的基于浏览器的平台。因此,尽管它允许您使用JavaScript代码,但并非浏览器环境中可用的所有 javaScript 功能都有效。 

Fuse 提供了一个不错的polyfill集合,允许您执行诸如执行ajax请求或设置执行一段代码的时间间隔之类的事情。除此之外,您仅限于核心 JavaScript 功能。

优点

  • 跨平台: 使您能够构建在androidios设备上运行的应用程序。

  • 本机性能:  UX Markup 被编译为本机代码,这就是性能与本机相当的原因(如果不一样的话)。不同的效果和动画是 OpenGL 加速的,这带来了一流的用户体验。

  • 声明性代码: 动画、效果和过渡是通过 UX 标记声明的。因此,在单击按钮时缩放按钮之类的事情纯粹是通过 UX 标记进行管理的。这使您可以将 JavaScript 代码集中在向api发出请求、执行计算和编写业务逻辑等事情上。

  • 对开发人员和设计人员友好:  Fuse 使用 Web 开发人员熟悉和喜爱的技术:用于处理任务的 JavaScript 和用于 UX 的类似 XML 的语言。他们用于构建 UI 的 UX 标记非常简单,即使对于设计师来说也很容易使用。

  • 良好的文档: 不同的功能和 API 都有很好的文档记录。他们也有一系列示例,尽管它主要展示了他们的用户体验。 

  • 可扩展:  Fuse 使用一种称为 Uno 的语言来扩展本机功能。这意味着如果您需要未通过 Fuse 的 JavaScript API 公开的本机功能,您可以自己实现自定义功能。

缺点

  • 年轻社区: 与 React Native 相比,Fuse 的社区还很年轻,还没有那么活跃。他们有一个Slack 频道 和一个 论坛。他们也有一个社区包页面,但是当你查看 GitHub 存储库时,并没有太多的活动。也缺少关于 Fuse 的博文和教程。

  • 不支持现有的 JavaScript 框架:  Fuse 仅支持 vanilla JavaScript。因此,如果您来自vue、React 或angular ,并且您想在 Fuse 平台上使用您的技能,那么遗憾的是这是不可能的。

  • 不支持 Linux: 如果您不在 Windows 或mac OS 上,则无法使用 Fuse 开发应用程序。 

  • 没有 NPM 支持和包系统: 你不能使用 NPM 来安装和使用现有的 JavaScript 库。尽管有一些已知的 JavaScript 库可以工作,但如果没有允许开发人员安装实现特定功能的现有库的包系统,平台就不是真正完整的! 

  • 不支持原生 ES6:  Fuse 仅支持 ECMAScript 5.1 来编写 JavaScript 代码。但是,您可以使用诸如babel之类的转译器将您的 ES6 代码转译为 ES5。

保险丝是如何工作的?

在底层,Fuse 通过 Uno 编译器将 UX 标记转换为原生 C++ 代码。Uno 是一种类似 C# 的语言,用于编写 Fuse 的所有核心类。因此,您编写的 UX 标记与 Fuse 框架一起被编译为 C++。之后,本机平台工具(Android Studio 或 Xcode)采用该 C++ 代码并编译本机应用程序。

至于 JavaScript 代码,它在运行时由 JavaScript VM 解释。这意味着 UI 和业务逻辑是相互独立的。 

Fuse 与 React Native 相比如何?

如果不将新平台与现有平台进行比较,任何关于新平台的介绍性文章都是不完整的。与 Fuse 相媲美的一个平台是 React Native。因此,我们将根据以下标准比较这两个平台:

  • 平台功能

  • 表现

  • 代码

  • 可扩展性

请注意,我只会比较 Fuse 的免费功能,因为 React Native 是一个免费平台。

平台功能

Fuse 和 React Native 都具有以下特性:

  • 热重载: 对代码的更改会自动反映在应用预览中。但是,如果您比较 UI更新发生的速度,Fuse 显然是赢家。他们的热重装几乎是即时的。

  • 用于使用本机功能的 JavaScript API:  Fuse 和 React Native 都允许您通过 JavaScript API 访问本机设备功能,例如相机、地理位置和推送通知。但是,如果您比较文档,很明显 React Native 有更多可用的 API。

以下是仅适用于 Fuse 的功能:

  • 在多个设备上预览: 这使开发人员和设计人员可以在具有不同外形尺寸的多个设备上预览应用程序。唯一的要求是开发机器应该和设备在同一个无线网络上。这非常有用,因为他们会立即查看在特定视口上是否看起来不好看。

  • 桌面预览: 这允许在桌面上预览应用程序。请注意,这对您的计算机性能几乎没有影响。这是因为它实际上不是设备模拟器。桌面预览还允许您在多个视口上预览应用程序。 

  • 预览应用程序: 如果您想快速预览应用程序,还可以使用适用于Android和iOS的客户端应用程序。这使您可以扫描 QR 码,然后在设备上打开应用程序。您可以根据需要对任意数量的设备执行此操作。对源代码的更改会自动反映在这些设备中的每一台上。 

为跨平台应用程序开发引入Fuse  第1张与自定义预览(在设备上预览应用的默认方式)相比,预览应用的唯一缺点是自定义 Uno 代码和第三方包不起作用。地理位置、推送通知和本地通知也不起作用。在这些情况下,您最好使用自定义预览。 

表现

Fuse 的性能与原生相当,因为 UX 标记被编译为特定平台的原生 UI。而且因为所有的动画、效果和过渡都是在标记本身中定义的,所以它已经知道在按下按钮时要做什么。如前所述,JavaScript 运行在单独的线程上,完全不会影响 UI 性能。最重要的是,Fuse 使用了 OpenGL ES,它提供了硬件加速的图形性能。这意味着可以同时使用不同的动画和效果,而不会对 UI 性能产生太大影响。这使得 Fuse 成为非常适合开发手游的平台。

另一方面,React Native 为每个平台使用一个桥接模块。该模块充当 JavaScript API(包括 UI 组件)和本机功能之间的连接,因此它们可以相互通信。由于原生组件和 React Native 对应的 UI 组件之间的通信成本,这使得 React Native 的性能不如 Fuse。 

代码

Fuse 和 React Native 都提供了一种标记语言作为 UI 的构建块。然而,仅仅通过比较 Fuse 和 React Native 的文档,你可以看到 React Native 有更多的组件来代表它们的原生对应物。

Fuse 的 UX 标记允许您在用户与其交互时描述组件的动画。例如,下面是如何创建一个按钮,当它被按下时,它会变成原来大小的三倍。如果您不指定,Fuse 会处理转换的时间长度:

<Rectangle Width="150" Height="50" Fill="#bada55" Margin="10" CornerRadius="4">
  <WhilePressed>
      <Scale Factor="3" />
  </WhilePressed>
</Rectangle>

另一方面,React Native 几乎所有事情都依赖于 JavaScript。在下面的代码中,TextInput 组件依赖于text被初始化的状态。每次用户输入的文本发生变化时,它都会更新它: 

<TextInput
  style={{height: 50, borderColor: '#ccc', borderWidth: 1}}
  onChangeText={(text) => this.setState({text})}
  value={this.state.text}
/>

以下是为文本字段提供默认文本的方式:

constructor(props) {
  super(props);
  this.state = { 
    text: 'Default Text' 
  };
}

在两者之间,Fuse 将业务逻辑与管理 UI 分开的方式有利于开发人员和设计师之间的协作。UX 标记对于设计人员来说非常简单易懂,因此他们可以在开发人员处理业务逻辑的同时进行处理。 

可扩展性

Fuse 允许您使用他们用于所有核心类的相同语言作为扩展本机功能的一种方式。但是,这确实需要您了解如何在 Android 和 iOS 中使用本机 API。从 Fuse 的 Uno 中,您可以使用外部代码来实现本机功能。目前,Uno 仅支持 iOS 的 Objective-C 和 Android 的 Java。然后公开生成的类,以便您可以从 JavaScript 调用它。

类似地,React Native 有一个对应 iOS 和 Android 的桥接模块。这个桥接模块充当原生功能和 JavaScript 之间的桥梁。就像 Fuse 一样,这需要您具备 Objective-C 或 Java 的工作知识。

这两个平台还允许您为每个目标平台扩展本机 UI 组件。那么,例如,如果您想为Android 上的原生工具提示控件实现相应的 UI 组件怎么办?你可以在 Fuse 和 React Native 上做到这一点。

保险丝值得吗?

如果您问我的意见,我会说这取决于您的具体用例。Fuse 绝对可以投入生产。它的主要优势在于它的性能以及从一个想法到一个工作原型的速度有多快。使用 Fuse 创建的应用程序具有高性能,它还使开发人员和设计人员之间的协作变得非常容易。

它的主要缺点是它的社区。Fuse 显然致力于开源,他们发布了使 Fuse 在后台工作的库。然而,他们仍然是一家小公司(至少与 Facebook 相比)。这意味着他们必须以一种或另一种方式赚钱。这就是为什么他们有 更适合团队和企业的专业付费计划。因此,可以假设他们的大部分努力都将用于开发这些付费工具。这使得开源工作成为二等公民。 

如果您在一家每天都在开发应用程序的公司工作,那么 Fuse 是一个不错的选择。但是,如果您是像我这样的独立开发人员,我们通常会坚持使用免费计划。对于大多数用例来说它已经足够好了,但是如果您需要自定义本机功能,那么您必须自己实现它。

归根结底,这完全取决于您的用例。如果您发现您的应用程序不需要使用一大堆服务、工具和原生 API,那么请选择 Fuse。否则,不要。除非您有大量时间可以开发自定义原生模块!

结论

您现在应该对 Fuse 是什么、它的工作原理、它的优缺点以及它是否值得尝试作为更流行的移动开发框架的替代品有一个很好的理解。在本系列的第二部分,我们将了解如何使用 Fuse 开发应用程序。


文章目录
  • 什么是保险丝?
    • 优点
    • 缺点
  • 保险丝是如何工作的?
  • Fuse 与 React Native 相比如何?
    • 平台功能
    • 表现
    • 代码
    • 可扩展性
  • 保险丝值得吗?
  • 结论