如何确定Ionic是否适合您的项目

by Simon Grimm

西蒙·格里姆(Simon Grimm)

如何确定Ionic是否适合您的项目 (How to find out if Ionic is the right choice for your project)

Ionic has been around for quite some years. With the latest release of version 4, it has become an even better option for developing hybrid apps than it was already. Still, there are drawbacks and scenarios where Ionic might not be (or should not be) your first choice.

离子已经存在了很多年。 在最新版本的版本4中 ，它已经成为开发混合应用程序的最佳选择。 尽管如此，在某些缺点和情况下，Ionic可能不是(或不应该)您的首选。

In this article, we’ll take a look at questions you should answer before picking Ionic for your next project. In the end, the result might very likely still be Ionic, but there are other great alternatives as well.

在本文中，我们将介绍在为下一个项目选择Ionic之前应回答的问题。 最后，结果很可能仍然是Ionic，但是还有其他很好的选择。

Software Development is no competition and we don’t need a winner here. We can accept that there are many great frameworks in this world. Each has its unique strengths and tradeoffs. You can embrace a great framework for your job or spend time explaining why framework x is so bad. The decision is up to you, so choose wisely how you want to spend your time.

软件开发不是竞争，这里我们不需要赢家。 我们可以接受这个世界上有许多很棒的框架。 每个都有其独特的优势和权衡。 您可以为工作选择一个好的框架，也可以花时间解释为什么框架x如此糟糕。 该决定取决于您，因此请明智地选择如何度过自己的时间。

Be aware that the term Hybrid Apps can sometimes still be a red flag for decision makers. If they are not convinced after uncovering the 10 Hybrid Myths, this article will give them a clearer path.

请注意， 混合应用程序一词有时对于决策者来说仍然是一个危险信号。 如果在发现10个混合神话之后仍不相信他们，那么本文将为他们提供一条更清晰的道路。

If you’ve already fallen in love with Ionic or want to learn more about it, you can take the next step with my exclusive Ionic learning platform the Ionic Academy. It offers courses, projects, and an awesome community to help you become an Ionic Developer.

如果您已经爱上Ionic或想了解更多有关Ionic的信息，则可以使用我独有的Ionic学习平台Ionic Academy进行下一步。 它提供课程，项目和一个很棒的社区，以帮助您成为Ionic Developer。

你打算做什么 (What’s your project?)

In the beginning, there’s an idea or task that will become a project later. At this stage, you need to find out what platforms you want to support. You also need to decide what are your project’s biggest priorities. If you develop something completely new, it’s easier to pick something new. It is much harder when you already have requirements based on a legacy system.

最初，有一个想法或任务将在以后成为项目。 在此阶段，您需要找出要支持的平台 。 您还需要确定项目的最大优先事项 。 如果您开发了全新的内容，则选择新内容会更容易。 当您已经具有基于旧系统的需求时，要困难得多。

First of all, where do you want to offer the app? Inside the native app stores, on the web, as a PWA or even as a desktop application?

首先， 您想在哪里提供该应用程序 ？ 在本机应用程序商店内部，在Web上，作为PWA还是作为桌面应用程序？

Your answer will be one or a combination of these. If you are targeting many platforms, Ionic would be a good choice.

您的答案将是这些之一或两者结合。 如果您针对许多平台，那么Ionic将是一个不错的选择。

When you only need a web application, create for example a pure Angular project. If you only need desktop apps, use Electron or something completely different. (This is not my main area of focus, really).

仅在需要Web应用程序时，例如，创建一个纯Angular项目。 如果只需要桌面应用程序，请使用Electron或完全不同的工具。 ( 确实，这不是我的主要重点领域 )。

But once you see that you need to target mobile and web, Ionic offers a great way to keep your code in a code base with one language. At this point, it doesn’t matter if you need a native app or PWA, because you can get both with Ionic.

但是，一旦您发现需要针对手机和网络，Ionic提供了一种很好的方法来将您的代码保持在一种语言的代码库中。 在这一点上，您是否需要本机应用程序或PWA都无关紧要，因为您可以通过Ionic获得两者。

The result of using a cross-platform framework is potentially higher when you use it as a cross-platform tool. This always means it’s not going to be 100% like doing it with the inherent approach of the respective platform. You can get close to it to a certain degree while your cost decreases.

当您将其用作跨平台工具时，使用跨平台框架的结果可能更高。 这始终意味着它不会像使用相应平台的固有方法那样百分百地做到这一点。 在降低成本的同时，您可以在一定程度上接近它。

Which brings us to the priorities of the project. If your priority is to have the best 3D visuals an app has ever seen, stop reading here. That’s not a use case for Ionic but something like Unity.

这将我们带到了项目的优先事项。 如果您的首要任务是拥有应用程序所见过的最佳3D视觉效果，请在此处停止阅读。 这不是Ionic的用例，而是Unity之类的东西。

If your priority is to offer your customers a solution on all their preferred platforms, Ionic can help you to get there more quickly. Because you can build your one code base into many different forms in the end. You are more flexible and able to target a variety of platforms.

如果您要优先考虑在所有首选平台上为客户提供解决方案，那么Ionic可以帮助您更快地到达那里 。 因为最后您可以将一个代码库构建为许多不同的形式。 您更加灵活，可以针对各种平台。

In the end, every project has a budget and timeline. This means, it’s a business decision based on many variables you can sometimes only estimate upfront. Do your job, outline what’s important and where you want to be. This will give you the first indication of whether to use Ionic or not.

最后，每个项目都有预算和时间表。 这意味着， 这是基于许多变量的业务决策 ，您有时只能预先估算。 做好您的工作，概述重要的事项以及您想成为的地方。 这将为您提供是否使用离子的第一个指示。

您的团队成员的技能是什么？ (What are your team members’ skills?)

When you have a team of 5 non-developers that are just starting to learn what an Array is, there’s no big difference between picking framework a or b. If you have a team of 5 Angular developers, the likelihood of picking Ionic suddenly increases a lot.

当您有一个由5个非开发人员组成的团队开始学习Array是什么时，选择框架a或b并没有太大区别。 如果您有一个由5位Angular开发人员组成的团队，那么选择Ionic的可能性会突然增加很多。

Although you should (of course) always try to use the best tool to deliver the best possible result for your project, it doesn’t mean that this selection makes the most sense or has the highest business value.

尽管您应该(当然)总是尝试使用最佳工具为您的项目提供最佳结果，但这并不意味着此选择最有意义或具有最高业务价值 。

If you have experienced developers with a lot of C# knowledge, why not try something like Xamarin?

如果您有丰富的C＃知识的经验丰富的开发人员，为什么不尝试Xamarin之类的东西呢？

If all your team knows React, why not use React Native?

如果您的团队都知道React，那么为什么不使用React Native ？

As I said in the beginning, there are many great frameworks available. Each with their own unique approach. And if you can benefit from the experience of your developers, you will get started a lot faster. Perhaps also get a better result with something they would have to learn from ground zero.

正如我在开始时所说的，有许多很棒的框架可用。 每个人都有自己独特的方法。 而且，如果您可以从开发人员的经验中受益，则可以更快地上手。 也许他们从零基础学到的东西也可以获得更好的结果。

When you have a handful of web developers with basic JavaScript skills, Ionic is the perfect framework to transition to mobile apps.

如果您只有少数具有基本JavaScript技能的Web开发人员，那么Ionic是过渡到移动应用程序的理想框架 。

Also, in case you have a development team of 100 native developers, chances are high you should go native. It seems like your business focus is on developing the best possible app for your end-user.

另外，如果您有一个由100个本地开发人员组成的开发团队，那么您应该选择本地化的可能性很高。 看来您的业务重点是为最终用户开发最好的应用程序。

But when your team is not at that stage (yet?) evaluate your previous skills. Keep in mind the target platforms of your project from the first step because not all of the mentioned framework can deliver the same result across those platforms like Ionic does.

但是，当您的团队还没有达到这个阶段时(尚未？)，请评估您以前的技能。 第一步要记住项目的目标平台，因为并非所有提到的框架都能像Ionic一样在这些平台上提供相同的结果 。

Combine those 2 elements to see what framework could be a match!

结合这两个元素，看看什么样的框架可以匹配！

离子带来的好处 (Benefits You Get with Ionic)

Once you decided that Ionic might be the right fit, it’s time to look at the potential upsides of using it.

一旦您确定Ionic可能是合适的选择，就该考虑使用它的潜在好处了。

程式库 (Codebase)

As already mentioned, your result is one codebase which you can use to build for multiple platforms. That means the initial development time is faster. Also, further maintenance and updates are easier to ship as it only requires changes in one project.

如前所述，您的结果是一个可用于多个平台构建的 代码库 。 这意味着初始开发时间更快。 而且，由于只需要在一个项目中进行更改，进一步的维护和更新就更容易发布。

While this sounds awesome, it’s never going to be 50% (or more) of the development time compared to creating x projects for each separate platform you target. Sometimes you just need to take care of special behaviors so you need to add clauses like:

虽然这听起来很棒，但是与为目标每个单独的平台创建x个项目相比，它永远不会占开发时间的50％(或更多)。 有时您只需要注意特殊行为，因此需要添加以下子句：

if (this.plt.is('ios')) {  // do ios Stuff}

if (this.plt.is('android')) {  // do android stuff}

Ionic is already doing their best to simplify this process with fa project called Capacitor. This defines one API that will work both on the web and with native SDKs. At the time writing, this it has not yet reached a stable version, but looks very promising for the future.

Ionic已通过名为Capacitor的项目竭尽全力简化此过程。 这定义了一个既可以在网络上也可以与本机SDK一起使用的API。 在撰写本文时，它还没有达到稳定的版本，但是对于未来来说似乎很有希望 。

平台类 (Platforms)

Because Ionic is betting on the web, Ionic apps can run almost anywhere today. An Ionic 4 project is a web application that gets packaged into the right container for a specific platform.

由于Ionic在网上下注，因此Ionic应用程序几乎可以在任何地方运行。 Ionic 4项目是一个Web应用程序，被打包到特定平台的正确容器中。

On the web, this means it can be deployed directly as it is. As a PWA, you need to comment in a snippet and it’s ready. For the native app stores (iOS/Android), Cordova will package your application. Cordova makes the underlying SDKs and device features available. And for desktop, you can use Electron. It is already used by applications like Visual Studio or Slack.

在网络上，这意味着它可以直接部署。 作为PWA，您需要在摘要中进行注释，并且准备就绪。 对于本机应用程序商店(iOS / Android)， Cordova将打包您的应用程序。 Cordova使基础SDK和设备功能可用。 对于台式机，您可以使用Electron 。 它已经被Visual Studio或Slack之类的应用程序使用。

UI元素 (UI Elements)

If you want to explain Ionic very (very, very) simply, it’s a great UI library of elements. Especially with the version 4 update, Ionic moves towards a direction where it can be easily added to any project. Its components are now web components created with their own tool Stencil.

如果您想非常(非常非常)地解释Ionic，那么它是一个很棒的UI元素库 。 特别是在版本4更新中，Ionic向着可以轻松添加到任何项目的方向发展。 现在，其组件是使用自己的工具Stencil创建的Web组件。

While Bootstrap was and still is great for the web, having platform-specific components is almost a must-have today if you want your users to enjoy your app.

尽管Bootstrap曾经是，现在仍然非常适合Web使用，但要让用户喜欢您的应用程序，拥有特定于平台的组件几乎是当今必不可少的。

Ever seen an Android-designed iOS App?

曾经看过Android设计的iOS应用吗？

It either never gets through the Apple Submission guidelines check or feels just wrong when used.

它要么永远无法通过Apple提交准则检查，要么在使用时感觉不对。

Ionic automatically uses the styling based on the platform where the app is running. While they are already looking good out of the box most of the time, everything can be customized to meet your expectations. It’s not like you have to live with predefined colors or anything. There are standard values to help you get started faster.

Ionic会根据运行应用程序的平台自动使用样式。 尽管他们在大多数情况下已经看起来很不错，但可以自定义所有内容以满足您的期望。 好像您不必使用预定义的颜色或其他任何东西。 有一些标准值可帮助您更快地入门。

工具与开发流程 (Tooling & Development Flow)

If your development environment sucks, your productivity decreases. If you have the right tools and feel comfortable with your flow, your productivity will likewise be a lot higher.

如果您的开发环境糟透了，您的生产率就会下降。 如果您拥有合适的工具并且对流程感到满意，您的生产率同样会更高。

With Ionic 4 you get the power of the Ionic CLI of previous releases. Plus you can also use the Angular CLI without any problems right inside your project!

使用Ionic 4，您可以获得以前版本的Ionic CLI的功能。 另外，您还可以在项目内部直接使用Angular CLI ！

This means bootstrapping projects, adding new files, and creating the right structure becomes a lot easier.

这意味着引导项目，添加新文件以及创建正确的结构变得容易得多。

Also, compared to native development, the live reload of your app is something those developers can only dream of.

而且，与本机开发相比，应用程序的实时重新加载是开发人员只能梦dream以求的。

Combined with the additional safety of TypeScript and a great editor like Visual Studio Code, developing Ionic apps becomes less a job and more pure fun.

结合TypeScript的额外安全性和出色的编辑器(如Visual Studio Code) ，开发Ionic应用程序变得不再是一件容易的事，而是更多的乐趣。

支持与社区 (Support & Community)

While you expect great support and a friendly community from all famous frameworks, it’s not always going to be like you imagine it. Because the main focus of Ionic is still Angular, you can not only get help from fellow Ionites but also benefit from the whole Angular community.

尽管您期望所有著名框架都将提供强大的支持和友好的社区，但这并不总是会像您想象的那样。 由于Ionic的主要重点仍然是Angular，因此您不仅可以从其他Ionite那里获得帮助，还可以从整个Angular社区中受益。

And once more users of other frameworks start to use Ionic, the size of the community will increase more and more over time.

并且，一旦其他框架的更多用户开始使用Ionic，社区的规模将随着时间的推移而越来越大。

If you are looking for another great Ionic community, you can find a friendly place inside my Ionic Academy.

如果您正在寻找另一个很棒的离子社区，可以在我的离子学院内找到一个友好的地方。

Also, looking up something inside documentation can be quite painful. Ionic makes delivering an awesome experience in this area a high priority. Check out there beautiful redesigned Ionic 4 docs to see what I mean. It’s definitely more than you can expect from an open source framework!

此外，在文档中查找内容可能会很痛苦。 Ionic高度重视在此领域提供出色的体验。 查看那里经过重新设计的漂亮的Ionic 4文档 ，了解我的意思。 绝对比您从开源框架中所期望的要多！

离子专业 (Ionic Pro)

Although Ionic is open source and free, you can add another set of tools by using Ionic Pro. This paid service adds additional functionality like visual App creation with the creator, improved deployment process (live app updates), error monitoring or testing channels.

尽管Ionic是开源和免费的 ，但是您可以使用Ionic Pro添加另一套工具。 这项付费服务​​增加了其他功能，例如与创建者一起创建可视化应用程序，改进的部署过程(实时应用程序更新)，错误监控或测试渠道。

While none of these is a must have, it’s an amazing suite of tools that you might want to have if you can afford the price.

虽然这些都不是必须的，但如果您负担得起的价格，它可能是一套令人惊奇的工具。

For enterprise teams, the benefits will clearly pay off. For smaller companies that take their apps seriously, it’s something they should think about to increase the productivity of their development team.

对于企业团队而言，收益将显而易见。 对于认真对待其应用程序的小型公司，这是他们应该考虑的事情，以提高其开发团队的工作效率 。

离子领域内的改进领域 (Areas of Improvement within Ionic)

Until now I’ve blown the trumpet quite hard for Ionic. This is because I’ve fallen in love with it over and over again in the last years. But of course there are drawbacks to every framework, and Ionic is no exception.

到目前为止，我一直为Ionic吹小号。 这是因为在过去的几年中，我一次又一次地爱上它。 但是，当然每个框架都有缺点，而Ionic也不例外。

性能 (Performance)

The biggest concern against cross-platform apps will always be the performance. Yes, Ionic apps run inside a Webview. There are no real native elements. They will always be inside this container and at least one level above real native apps.

跨平台应用程序最大的担忧始终是性能。 是的，Ionic应用程序在Webview中运行。 没有真正的本机元素。 它们将始终位于该容器内，并且至少比真实本机应用程序高一级。

On the web in general, that’s not an issue, as Ionic apps are a website like everything else.

一般来说，在网络上这不是问题，因为Ionic应用程序是一个像其他所有网站一样的网站。

As a native application, this can become a pain point especially if a bridge to a native functionality is the bottleneck that keeps hanging and slows down your app. Again, if your top priority is the best performance ever seen by a mobile application, you might want to go full native.

作为本机应用程序，这可能会成为一个痛点，特别是如果与本机功能的桥梁是不断悬挂并降低应用程序速度的瓶颈 。 同样，如果您的头等大事是移动应用程序所见过的最佳性能，则您可能希望使用本机。

Also, the usage of JavaScript is super easy, but at the same time there are many areas where inexperienced developers can go wrong which results in slow apps. Josh Morony has a great article on why the code, not the framework, might be the real problem with the performance.

同样，JavaScript的使用非常容易，但是同时在很多地方，经验不足的开发人员可能会出错，从而导致应用程序运行缓慢。 Josh Morony撰写了一篇很棒的文章，介绍为什么代码而不是框架可能是性能的真正问题。

You can definitely build super performant apps with Ionic. It’s just easier to mess up with performance than it is with a framework that’s closer to native code (or completely native).

您绝对可以使用Ionic构建性能卓越的应用程序。 与更接近本机代码(或完全本机)的框架相比，搞乱性能要容易得多。

重装 (Reload)

The cool reload was a benefit just some paragraphs ago and now it’s a drawback?

酷重装只是前几段的好处， 而现在是缺点吗？

To understand it, you need to learn the difference between live reload and hot reload.

要了解它，您需要了解实时重新加载和热重新加载之间的区别。

The first is used with Ionic and means your app is updated once you save your code. The second means your app is updated once you save the code in the exact same state it was before.

第一个与Ionic一起使用，意味着您保存代码后便会更新您的应用程序。 第二个意思是，一旦您将代码保存为与以前完全相同的状态，便会更新您的应用程序。

That’s a difference, especially if you are testing your app on a mobile device or simulator where the loading times can really slow down your process.

这是不同的，特别是如果您正在移动设备或模拟器上测试应用程序，而加载时间确实会减慢您的过程。

Of course, this is not a showstopper, but something developers would highly benefit from in the future.

当然，这不是最重要的事情，但是开发人员将来会从中受益匪浅。

本机SDK (Native SDKs)

If one of your platforms is a native app, odds are high that you want to use device features or the underlying SDK. While this is not a problem itself through Cordova, it can be painful sometimes.

如果您的平台之一是本机应用程序，则要使用设备功能或基础SDK的可能性很高。 尽管这不是科尔多瓦本身的问题，但有时可能会很痛苦。

There are Cordova plugins for almost everything you can imagine. Once you need a very unique feature and discover that the only plugin for this was updated 3 years ago you know you gonna have a hard time.

有Cordova插件，几乎可以想象得到的所有内容。 一旦您需要一个非常独特的功能，并且发现唯一的插件已在3年前进行了更新， 您便会遇到困难 。

This doesn’t mean it’s the end of the road. At this point, you might have to touch native code that you don’t comfortable with. With Cordova means we can’t access native functionality directly.

这并不意味着这是路的尽头。 在这一点上，您可能必须触摸您不满意的本机代码。 使用Cordova意味着我们无法直接访问本机功能 。

With other frameworks like NativeScript, it’s a lot easier to work directly with the native SDKs. For Ionic, you currently still need a bridge between.

使用NativeScript等其他框架，直接使用本机SDK会容易得多。 对于Ionic，您目前仍需要两者之间的桥梁。

Maybe this pain point will be removed or decreased once Capacitor is ready for prime time. Until then you must live with what you get or become active by developing your own plugin.

一旦电容器准备就绪，也许可以消除或减轻这种疼痛点。 在此之前，您必须通过开发自己的插件来体验自己所获得或变得活跃的事物。

那AirBnB和Facebook新闻呢？ (And what about the AirBnB and Facebook News?)

You might have heard the news of AirBnB sunsetting their work with React Native. You may have heard older news from the Zuck that betting on HTML5 was the biggest mistake of Facebook.

您可能已经听说过AirBnB将其与React Native一起工作终止的消息。 您可能已经听过Zuck的较早消息，认为押注HTML5是Facebook的最大错误 。

These articles create a lot of doubt against the general cross-platform approach.

这些文章对通用的跨平台方法提出了很多疑问。

Is developing cross-platform still valuable?

开发跨平台是否仍然有价值？

The short answer is: Yes, more than ever.

简短的答案是： 是的，比以往任何时候都多 。

To understand how those companies came to these decisions you would have to truly understand their business and their situation. AirBnB has more than 100 native developers. How many does your company have?

要了解这些公司如何做出这些决定，您必须真正了解他们的业务和状况。 AirBnB有100多个本地开发人员。 您的公司有几个？

If I had a team of 100 experienced natives devs, I guess the last thing I would do is tell them to stop all native work and go for Ionic now.

如果我有一个由100个经验丰富的本地开发人员组成的团队，我想我要做的最后一件事就是告诉他们停止所有本地工作，现在就去Ionic。

This means you shouldn’t be scared by big headlines of big companies.

这意味着您不应该被大公司的头条新闻吓到 。

The decision for or against Ionic or any framework is based on many factors. Just because one company stops using a tool it doesn’t mean the tool sucks. It was just not the right fit for their needs.

是否支持Ionic或任何框架的决定基于许多因素。 仅仅因为一家公司停止使用工具，并不意味着该工具很烂。 这只是不适合他们的需求。

Ionic could be right for your next project or not. Don’t let that decision be based on big headlines, but rather on your own evaluations.

Ionic可能适合您的下一个项目。 不要让这个决定基于头条新闻，而要根据您自己的评估。

结论 (Conclusion)

In this article, we went through many steps to see whether Ionic might be the right fit for your next project or cross-platform app. With the closer Angular integration with Ionic 4, it’s a great choice for any web and mobile project. But it always depends on your business case, priorities, and factors you value!

在本文中，我们经历了许多步骤，以了解Ionic是否适合您的下一个项目或跨平台应用程序。 通过与Ionic 4的更紧密的Angular集成，它是任何Web和移动项目的绝佳选择。 但这始终取决于您的业务案例，优先级和您重视的因素！

Don’t fall back into preconceptions you have built and fostered over the years. Try it out for yourself.

不要回落到您多年来建立和培养的成见中。 自己试试吧。

If you want to learn how to build great apps with Ionic, check out the Ionic Academy!

如果您想学习如何使用Ionic构建出色的应用程序，请访问Ionic Academy ！

Originally published at devdactic.com on August 21, 2018.

最初于2018年8月21日发布在devdactic.com 。

翻译自: https://www.freecodecamp.org/news/is-ionic-the-right-choice-for-my-project-f15774303956/