当前位置: 首页 > 工具软件 > Hummingbird > 使用案例 >

Hummingbird 对比 Angular Dart:该选择哪一个?

万俟承望
2023-12-01

Hummingbird在12月4日的flutter发布会上宣布。这个项目将允许我们将我们的fulluer应用程序编译成完整的渐进式Web应用程序。那么...... Angular Dart还值得吗?

我将尝试分享到目前为止我收集到的信息,希望我的发现也能帮助其他人。

他们都准备好了吗?

第一个问题是我们是否可以实际使用这两者。

Angular Dart

当前版本的AngularDart是5.2.0。它是稳定的(已经有几年了),用于谷歌的高影响力项目,以及世界各地的项目。

Hummingbird

有些人会声称Hummingbird目前处于其阿尔法状态。但是,我们所拥有的只是技术概述。更多的声音是比团队彻底讨论他们正在考虑的技术方向的任何其他建议。 (链接

他们实际上在做什么

很高兴你问!我们将尝试了解单页应用程序是什么,渐进式Web应用程序是什么,并查看Angular和Hummingbird的预期输出。这将有助于我们理解他们打算解决的问题。

SPAs vs PWAs

单页应用程序

A single-page application (SPA) is a web application or web site that interacts with the user by dynamically rewriting the current page rather than loading entire new pages from a server. — Wikipedia

包含在URL中的字符#,而不是导致页面重新加载,将导致页面内的一些交互。 SPA使用此浏览器特性。

例如,在维基百科中,如果我们点击索引中的标题,而不是页面重新加载,浏览器会将我们带到页面的该部分。

SPA正在将其提升到新的水平。整个应用程序及其所有屏幕使用基于#Based的网址从单个页面开始工作,以实现其所有功能。

PWAs

Progressive Web Apps are user experiences that have the reach of the web, and are reliable, fast and engaging — developers.google.com

PWAs是以某种方式优化的网站(可以是常规网站,也可以是单页应用)

  • 离线和不可靠的互联网(Lie-Fi)可靠地工作
  • 快速,优化以获得高感知性能
  • 参与 - 感觉就像一个本机应用程序,并没有少其他功能。

AngularDart做了什么?

AngularDart或Angular通常是编写SPAs的框架。它为开发人员提供了一种使用以下功能编写SPA的方法:

  • 双向数据绑定
  • 路由
  • 模板
  • 指令

以及更多。实际的UI仍然使用HTML + CSS编写。 Angular仅提供使Web开发人员能够开发其SPA的所有其他功能。要点是:

  • Angular Dart不是UI框架
  • Angular Dart应用程序可以是也可以不是PWAs

那什么是Angular Web Components呢?

它们是由angular_components包提供的一组材料设计组件,它们充当用于构建应用程序的模板。

  • Internet Explorer不支持它们
  • 它们仍然是用HTML + CSS + Dart编写的

Hummingbird会做什么?

到目前为止,这只是猜测。它的目标是将任何flutter应用程序转换为PWA。它可能是也可能不是SPA(最有可能)。然而,它会尝试做所有那些原来flutter做的事情。

有了它,我们可以使用Flutter UI框架,使用所有flutter的SDK功能,如状态管理小部件和所有......只需点击一下,就可以生成我们已有的Android和iOS应用程序的PWA!

在此过程中存在许多挑战,但如果Google意识到这一点,那将是SDK的所有功能。

All-Dart应用程序的状态

让我们尝试理解Flutter + AngularDart和Flutter + Hummingbird组合之间的区别,如果我们要为web和native编写一套全套的应用程序。

Flutter + Angular Dart

要编写这样的应用程序,我们需要:

  • 编写一个包含所有业务逻辑的核心包,确保它没有angular或flutter的依赖关系,所有这些依赖关系都是从外部注入的

  • 编写Angular PWA订阅核心以获取所有功能

    *使用HTML + CSS或组合angular组件的UI

    *路由,状态管理与Angular的服务方式

  • 编写一个Flutter应用程序,为所有功能订阅相同的核心

    *具有fltter UI框架的UI

    *路由,状态管理等,用颤抖的方式做事

  • 从flutter项目编译到iOS和Android

  • 从Angular项目编译到Web

代码共享是否会减少工作量?

虽然代码共享肯定会减少“代码量”,但根据我的经验,它并没有真正减少需要完成的工作量。这需要我在整个过程中更加周到。

那有什么好处呢?

  • 代码更清晰,架构更好
  • 我被迫,现在更容易在各个平台上维护功能奇偶校验。

未来:Flutter + Hummingbird

要编写这样的应用程序,我们需要:

  • 写一个flutter应用程序

    *带有flutter框架的UI

    *路由,状态管理等flutter方式

  • 在三个不同平台上编译

  • 完成

##工作少了吗? 当然不是~好吧!

结论

这就是我们对flutter,angular,hummingbird和彼此共享代码的了解细分。

如果你现在正在开发什么东西......

使用flutter + angular dart。它不像hummingbird想得那么容易,但仍然是最好的方式。

到目前为止,hummingbird是一个遥远的梦想。一个项目,我们一定希望有一天能够取得成果,并对得起我们所有的努力,但未来仍旧是遥远的。

 类似资料: