Ionic has been around for quite some years and with the latest release of version 4 it becomes 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.
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.
Software Development is no competition and we certainly don’t need a winner here. Accept that there are many great frameworks in this world, each having 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 really want to spend your projects time.
Software Development is no competition and we certainly don’t need a winner here.
Click To Tweet
Be aware that the term Hybrid Apps can sometimes still be a red flag for decision makers, so if they are not convinced after uncovering the 10 Hybrid Myths this article will hopefully give them a clearer path.
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 which offers courses, projects and an awesome community to help you become an 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 and what the biggest priorities of your project are. If you develop something completely new it’s of course easier to pick something new then 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?
Your answer will be a part or combination of these, and especially if you are targeting many platforms Ionic is interesting for your.
When you only need a web application, create for example a pure Angular project. If you only need desktop apps, maybe use Electron but perhaps use something completely different (this is not my main area of focus, really).
But once you see that you need to target mobile and web, Ionic offers a great way to keep your code in code base with one language. At this point it doesn’t really matter if you need a native app or PWA because you can get both with Ionic.
The result of using a cross-platform framework is potentially higher when you really 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, but you can get close to it to a certain degree while your cost decrease.
Which brings us to the priorities of the project. If you 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.
If, on the other hand, your priority is to offer your customers a solution on all of 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.
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 very rough upfront. Do your job, outline what’s important and where you want to be. This will give you a first indication whether to use Ionic or not.
What are your teams 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 on the other hand you have a team of 5 Angular developers, the likelihood of picking Ionic suddenly raise a lot.
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 already got experienced developers with a lot of C# knowledge, why not try something like Xamarin?
If all of your team knows React, why not use React Native?
As 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 and 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 into mobile apps.
Also, in case you have a development team of 100 native developers, chances are high you should just go native because it seems like your business focus is developing the best possible app for your end-user.
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.
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.
Codebase
As already mentioned, your result is one codebase which you can use to build for multiple platforms. That not only means the initial development time is faster, but also further maintenance and updates are easier to ships 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 behaviours so you need to add clauses like:
if (this.plt.is('ios')) {
// do ios Stuff
}
if (this.plt.is('android')) {
// do android stuff
}
Ionic is already doing there best to simplify this process by a project called Capacitor that 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.
Platforms
Because Ionic is betting strongly on the web, Ionic apps can run almost anywhere today. An Ionic 4 project is basically a web application that gets packaged into the right container for a specific platform.
On the web, this means it can be deployed directly as it is. As a PWA, you just need to comment in a snippet and it’s ready. For the native app stores (iOS/Android), Cordova will package your application and make the underlying SDKs and device features available. And for desktop, you can use Electron which is already used by applications like Visual Studio or Slack.
UI Elements
If you want to explain Ionic very (very, very) simplified, 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 as its components are now basically web components created with their own tool Stencil.
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.
Ever seen an Android designed iOS App?
It either never get’s through the Apple Submission guidelines check or feels just wrong when used.
Therefore, 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 customised to meet your expectations. It’s not like you have to life with predefined colors or anything, there are just standard values to help you get started faster.
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!
This means, bootstrapping projects, adding new files, 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.
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.
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.
And once more users of other frameworks start to use Ionic, the size of the community will increase more and more over time.
If you are looking for another great Ionic community, you can find a friendly place inside my Ionic Academy.
Also, looking up something inside a documentation can be quite painful but Ionic makes delivering an awesome experience in this area a high priority. Just 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 Pro
Although Ionic is completely 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.
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 and also for smaller companies that take their apps serious it’s something they should thing 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 in every framework, and Ionic is no exception.
Performance
The most and biggest concern of all time against cross-platform apps will always be the performance. Yes, Ionic apps run inside a Webview. They are no real native elements, and therefore they will always be inside this container and at least one level above real native apps.
On the web in general, that’s not really an issue as Ionic apps are a website like everything else.
As a native application, this can become a painpoint 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 unexperienced developers can go wrong which results in slow apps. Josh Morony has a great article on why not the framework but your code might be the real problem to the performance.
You can definitely build super performant apps with Ionic, but it’s easier to mess up with performance than it is with a framework that’s closer to native code (or completely native).
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 exactly same state it was before.
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.
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.
There are Cordova plugins for almost everything you can imagine, but 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.
This doesn’t mean it’s the end of the road, but at this point you might have to touch native code that you feel not comfortable with at all. Also, the connection between our Javascript and the native code through Cordova means we can’t simply access native functionality directly.
With other frameworks like NativeScript it’s a lot easier to work directly with the native SDKs, but for Ionic you currently still need a bridge between.
Maybe this painpoint 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.
And what about the AirBnB and Facebook News?
Coming back to the here and now, you might have heard the news of AirBnB sunsetting their work with React Native or the older news from the Zuck that betting on HTML5 was the biggest mistake of Facebook (while they have certainly done bigger mistakes recently).
Especially in higher positions articles like these 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?
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.
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, and 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 could be right for your next project or not. Don’t let that decision be based on big headlines but your own evaluations.
Ionic could be right for your next project or not. It simply depends on many factors.
Click To Tweet
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. Especially with Ionic 4 and the closer Angular integration it’s a great choice for any web and mobile project, but it always depends on your business case, priorities and factors your value!
Just don’t fall back into preconceptions you have built and fostered over the years.
What’s your currently preferred framework and what are you building with it? I’d love to hear what you are using today and why!
The post Is Ionic the Right Choice for My Project? appeared first on Devdactic.