12 ms·

Ionic React

293 points by asaddhamani 7y ago

l_t 7y ago
This looks pretty neat! First I've heard of Ionic, and I want to use it. I have a question for anyone familiar with it. I mostly make Web apps with very complex UIs that target desktop computers specifically. I'm not as concerned with the mobile app story right now, I just want a batteries included UI framework. Is that a valid use-case for Ionic, or should it only be used if cross-platform deployment is needed?
- xtracto 7y ago
  I´ve used Ionic for both mobile apps and PWA (web sites that access the device hardware). It is pretty straightforward to do both in Ionic. As a side comment, the other day I wanted to do a very simple single page "app" (I jog, so I wanted a "sonar" kind of app that told me how far to my target speed I am, constantly). I thought I was going to give native Andriod Studio a try... as this was a very simple app and I was going to use GPS functionality, it sounded right. I was badly surprised by the way UIs are built in Android Studio, it is so fugly, it took me back to the AWT/Swing framework I worked with in the late 90s. After battling with the ConstraitLayouts and other bullshit, I went back to Ionic to do a simple HTML layout and had the app working in 1 hour. I can't believe in 2019 that is the way Google is making people build interfaces in Android.
  - xenospn 7y ago
    Android studio is awful. Moving from it to Xcode is like climbing to an open field out of a dank old basement.
  - UlisesAC4 7y ago
    Constraint layout is a delight for working, I wish there was something like that in css.
    - xtracto 7y ago
      I really want to understand it. It reminded me of my days migrating from the Vb5/6 UI to java swing. It was painful, but after you groked its logic, it made sense. How can I get to grok Android's Ui layout process?
- FpUser 7y ago
  For what you mentioned you might consider Sencha (assuming you want to pay as they're not exactly cheap). Here is the demo page with all their visual components: https://examples.sencha.com/extjs/7.0.0/examples/kitchensink/?modern#all https://examples.sencha.com/extjs/7.0.0/examples/kitchensink...
- rgharris 7y ago
  Until now Ionic has been mobile first. But they announced earlier this year [1] that they are working towards better desktop support. So I'm not sure it would be the best choice if you need a mature framework for desktop web apps right now and don't need hybrid/native mobile apps. We're currently adding desktop support to our existing Ionic app that has been mobile only so far so we are banking on being able to work around that and Ionic adding better desktop support over time. [1] https://ionicframework.com/blog/ionic-4-roadmap-new-features-release-schedule-goals-oh-my/ https://ionicframework.com/blog/ionic-4-roadmap-new-features...
- digitaltrees 7y ago
  Quasar framework is awesome and built on vue. https://quasar.dev/ https://quasar.dev/
- lowkeyokay 7y ago
  My company’s main app is built with ionic. Started with v 1.x and is now on 4.11. I love it but, our app was mostly aimed at mobile. It has since become much more desktop focused and we often have to create our own components. (Which is really easy using Stenciljs, also from ionic). Here’s some things you’ll need to work out: Datepickers. The ones provided by ionic are strictly for mobile. I think they are planning to do a desktop version but I have waited 4 years for that. IE 11 support. Forget it. Luckily it is less and less important but if you need I wouldn’t bother. Desktop style menus and lists. Possible to create but is not included. Ionic are improving dekstop features but it still mostly aimed at mobile. If possible, try creating one of the most desktop centric parts of your app and see how far you get. If mobile use is not important at all you might not get many benefits from using ionic.
hmart 7y ago
I feel Ionic is more engaged into open web than big companies trying to enforce their own standards. The question is when Appple and Google will start blocking (outside of walled garden app stores) hybrid apps?
- _bxg1 7y ago
  Why would they block hybrid apps? Apple only cares if your hybrid app loads its code at runtime. They couldn't care less if it's JavaScript. Edit: If by "hybrid app" you meant "progressive web app", then yeah, Apple has made it somewhat inconvenient to pin websites to your home screen as apps. But they'd never really be able to block them altogether without blocking the web itself, because there's no hard distinction between the two.
  - hmart 7y ago
    That's what I thought, also fear to losing control in the audit or approval process.
  - dougmany 7y ago
    I had a Cordova app rejected by the Apple store because it did not use enough native iOS functionality.
    - _bxg1 7y ago
      Were you going out of your way to circumvent native functionality somehow? A calculator app probably "doesn't use much native iOS functionality", but I don't see how that would get it negative points on App Store approval.
      - dougmany 7y ago
        It is basically a search tool to help people find facilities. It does look a lot like a web site though.
        7y ago
traderjane 7y ago
I wonder how people who were on the fence for Flutter will think about this.
- bradstewart 7y ago
  I build the occasional small mobile application. I evaluated Ionic, React Native, and Flutter about 18 months ago; and ultimately landed on Ionic for the projects I needed to ship. Next one will likely use Flutter. The "Hello world" story on Ionic is pretty good--you generate a project and it works. But configuring and maintaining the various layers (Ionic, Cordova, Android Studio and XCode projects for actual building the apps) has been pretty brutal for apps I only touch every few months. So many dependencies that prove very difficult to update correctly. The story looks to be improving with Capacitor though, so I suppose I'll give it another look when that stabilizes.
  - yesimahuman 7y ago
    Hey Brad, definitely take a look at Capacitor. We built it explicitly to solve those issues in Cordova. Also keep in mind Flutter also has to deal with native projects and deps so there are some “hard problems” not unique to Cordova here
    - bradstewart 7y ago
      Oh I have no doubt the grass isn't purely greener on the Flutter side. There's a ton of moving parts here for any solution to deal with. Capacitor does look really nice--it was in early beta (maybe even alpha) last time I started a new app project, haven't looked since. Will definitely give it a fair shake when the opportunity arises. EDIT: Adding a bit context to my earlier comment: one of the bigger points of frustration in managing dependencies was figuring out which versions of ionic, ionic-native, ionic/angular, angular, and angular's 6 dozen peer deps actually work together. Definitely doesn't help that I don't use Angular or Ionic on a regular basis, but documenting the expected versions of other components would be a huge help for me.
- cgs 7y ago
_bxg1 7y ago
This is one of those products that I'm sure has a large value-add, but still makes me feel gross that it exists. The amount of glue in here... yeesh. Edit: I initially read this to be yet another layer on top of React Native, but it appears to be an alternative to it. So less glue than I thought.
- yesimahuman 7y ago
  You can think of it as a "Bootstrap for Mobile/Desktop Apps" if that helps. It's not based on React Native but could be used with it to build out certain screens in the app.
tootie 7y ago
I did an Ionic/Angular project a few years back and it's a perfectly cromulent technology if stay within it's wheelhouse. If the app you're building could easily be a website, but the client wants an app store presence, this is by far the easiest way to get there. For delivering content-heavy screens that aren't a drag on CPU, it works fine. And it's also fine for layering in basic device functionality like location services. If expectations and budget are low, it's a great option.
- yesimahuman 7y ago
  Thanks for teaching me a new word in “cromulent.” While we think Ionic is for more than just low-expectation apps (many brands and consumer apps use Ionic) we appreciate that it fills a need beyond that. Cheers!
  - ezequiel-garzon 7y ago
    And me! Now this is interesting: Cromulent first appeared in the February 18, 1996 episode of The Simpsons called "Lisa the Iconoclast," in what could be considered a throw-away line given during the opening credits. The schoolchildren of Springfield are watching a film about the founding father of Springfield, Jebediah Springfield. The film ends with Jebediah intoning, “A noble spirit embiggens the smallest man.” One teacher at the back of the room leans over to another and says that she’d never heard the word embiggen before she moved to Springfield. “I don't know why,” the other teacher replies. “It's a perfectly cromulent word.” https://www.merriam-webster.com/words-at-play/what-does-cromulent-mean https://www.merriam-webster.com/words-at-play/what-does-crom...
    - evil-olive 7y ago
      It's one of my favorite Simpsons quotes. Wonderful little bit of linguistic hackery. They make up one word, embiggen, and just from the obvious root word of "big" it's clear what it means. Doubly so when taken in context, "A noble spirit embiggens the smallest man." Then they make up a second word, cromulent, and the meaning can be entirely inferred from context. Embiggen is a perfectly cromulent word. Acceptable, adequate, maybe a bit unorthodox but "good enough".
nicoburns 7y ago
I'd definitely consider using this. Mobile browser support used to be painful for this kind these "hybrid web apps", and animation performance wasn't up to scratch. But engine support is much better since Android 5, and phones have only been getting faster. It's not that hard to produce a performance mobile-web app these days.
thoughtpalette 7y ago
Huge congrats to the team! This is a giant milestone in Ionics life. Am a huge fan of the original Angular.js and Angular versions and it's nice to see the flexibility with React.
notyourfatherd 7y ago
> Instead of building an abstraction on top of iOS and Android native UI controls, we wanted to build something that was DOM-native Native is dead, on both phone and desktop.
- _bxg1 7y ago
  I'm a web developer and even I wouldn't agree with this. Especially on mobile.
The_rationalist 7y ago
I espect Ionic React to take a huge share of react native developers on the long term. React native has far less support of web standards/ features than Ionic, especially modern CSS support. Thus ionic give you more power to build feature rich, UX rich apps. Secondly react native has very poor debugging experience, meanwhile ionic support devtools (I couldn't get it to work on RN). Thirdly, contrary to popular belief, I expect ionic to have generally better performance than react native. Chromium evolve quickly and has an army of engineers that bring state of the art optimizations to the web. For example in a few releases, chromium will render elements using Vulkan by default. Lastly, ionic is more native than react could ever be as it supports all 3000+ cordova plugins and seamless Java interop. The ability to reuse the codebase for the web and for electron are also huge advantages. Things will only get better once capacitor stabilize. Still, I really wish that Ionic now focus on Vue.js/ts support.
- ausjke 7y ago
  vuejs got quasar already, the only missing part is react, which ionic just filled up the gap.
  - The_rationalist 7y ago
    I didn't knew about quasar! It seems interesting, still I believe ionic has a far bigger community which is a big time saver.
- yesimahuman 7y ago
  Wow, thanks, we appreciate the vote of confidence! It is interesting to think about the possible performance gains to be had running JS in the browser rather than in a detached JS engine. For example, WKWebView on iOS has access to the full JIT-ed JS engine on iOS, while JavaScriptCore does not (as I understand it).
  - The_rationalist 7y ago
    The challenge for your marketing is to educate people and to update their beliefs. It would be nice if you ran public benchmarcks of two equivalent app one in Ionic, one in RN (and eventually more (flutter, etc)) If you are empirically the fastest (maybe we will need to wait a few chromium milestones or to manually enable Vulkan) You could market those numbers by showing you are the first to have Vulkan rendering, HTTP3, CSS contains, dom fragments, etc (I believe Microsoft is working on moving chromium input handling out of the main thread) And if you showed things you can't do/easily do in react native. For example backdrop-filter has recently been added to chromium and is the future of UX. https://ferdychristant.com/please-help-make-backdrop-filter-a-reality-f81805ba3d52 https://ferdychristant.com/please-help-make-backdrop-filter-... But really there's so many features that you offer and others don't! OpenXR, SVG support, css width auto, css grid, etc If you want an exhaustive list: https://www.chromestatus.com/features https://www.chromestatus.com/features Really if react native was on https://caniuse.com/ https://caniuse.com/ people would see the truth (the feature gap). Your marketing also could just make visualizations about the gap in size between the ionic ecosystem (more plugins than RN + all npm packages) vs RN npm packages, that would show the order of magnitude of order of magnitude difference and so how many billions of dollars of man/hours developpers miss by choosing RN. Unrelated: I hope that you are aware of the cordova maintenance issue https://github.com/apache/cordova/issues/163#issuecomment-542432768 https://github.com/apache/cordova/issues/163#issuecomment-54... And capacitor won't be a true successor until it will have full compatibility with prior cordova plugins.
s1mpl3 7y ago
Kudos! This is a great project. I have one bone to pick, though. Had a show stopper issue a few months back with capacitor and the entire Ionic team was unresponsive, even on github. The issue was sending cookies to the server. Cookie would get set on the response but subsequent requests would not include the cookie. This was extremely aggravating and I had to halt my development. Relevant Github issue: https://github.com/ionic-team/capacitor/issues/1373 https://github.com/ionic-team/capacitor/issues/1373. Would be great to know if a solution was ever found.
- GordonS 7y ago
  I used Ionic for 2 projects a few years back. Support on GitHub was, frankly, crap. I can sympathise to some degree, because they were still trying to figure out a commercialisation model, but they were far more interested in shipping new stuff and breaking things than actually stabilising what they already had. Major bugs affecting lots of people were ignored forever or closed without comment. It made for a horrible dev experience, and I honestly can't see myself touching it again with an extra-long barge pole.
  - yesimahuman 7y ago
    Sorry about that, we definitely had some growing pains given we were a team of < 5 on the OSS side with a user base in the millions. Tried to automate as much as possible on the github side and over-applied our issue robot. I think our process has improved quite a bit recently and hope you give us another shot!
  - chiefalchemist 7y ago
    Sounds exactly like WordPress and Gutenberg.
- xtracto 7y ago
  My main problem with Ionic (having used it for several apps) is that it is very difficult to find answers to question on the web. Reference sites are full of "this is how I fixed it" that work on v1 or v2 or v3 and most of all don't work for v4. Unfortunately the speed in which they are changing things make community references obsolete quickly.
mocha_nate 7y ago
Big fan of this update!
sp33der89 7y ago
How does Capacitor compare to for example Cordova or Flutter or React Native? From their site I gather it's like Cordova 2.0?
- kalev 7y ago
  I believe Capacitor is the absolute life-saver of hybrid development. I've been using Cordova for quite a while and switched to Capacitor last year, and it made my life so much easier. Where Cordova tries to do anything and everything, for all platforms, with its super flaky plugins and buggy config.xml, Capacitor is really focused on doing one thing well: being the shell between your code and native hardware. One of the major points is the code it generates for iOS and Android can be committed to GIT and is yours; you have full control over the native part of your app and could extend it in any way shape or form. I have an app running in production now for almost a year and am so so glad I've chosen Ionic 4 and Capacitor. Kudos to the team.
  - yesimahuman 7y ago
    Glad you're liking it! While we remain big fans of Cordova we do have the fortunate advantage of building Capacitor in 2019 where we have access to much better JS standards, native tooling that is far more mature than before, and a clearer outlook on what devices/platforms need to be supported, not to mention Progressive Web Apps. We've tried to take advantage of those technological leaps and apply them where possible.
  - WA 7y ago
    Do you use any in app purchase plugin for Cordova in your Capacitor app?
ausjke 7y ago
Awesome news. For quite a while we had ionic for Angular, react native for React, quasar for Vue, now glad to see ionic officially supports react from now on. At the moment though, React-Native has 7x downloads comparing to Ionic: https://www.npmtrends.com/ionic-vs-quasar-framework-vs-react-native https://www.npmtrends.com/ionic-vs-quasar-framework-vs-react...
- yesimahuman 7y ago
  re: downloads, it's not quite that simple. `ionic` is our CLI while `react-native` is the actual library that is installed and will be installed frequently for build systems, etc. Also there are multiple versions of Ionic under multiple package names. Not arguing that React Native has more NPM downloads though but Ionic is quite popular on its own!
tschellenbach 7y ago
Nick did a post about this: https://dev.to/nickparsons/how-to-build-an-ionic-chat-app-with-react-and-stream-3c1g https://dev.to/nickparsons/how-to-build-an-ionic-chat-app-wi... I was surprised with how good the performance was. Really, better than unoptimized native apps, which is (at least to me) quite surprising
mLuby 7y ago
Ionic was a huge velocity-booster at my last startup. They caught some (unfair) flak for being Angular-centric when React got hot. Glad to see them constantly improving things! P.S. Can the creator.ionic.io get more love? 0:)
- yesimahuman 7y ago
  Glad to hear that! And while creator.ionic.io likely won't get more love, our new Ionic Studio product is quickly catching up to the simplicity of the drag and drop experience in Creator and will quickly be surpassing it, so I hope you check that out! https://ionicframework.com/studio https://ionicframework.com/studio
dcchambers 7y ago
I love Ionic! Glad to see them reach this milestone. Great product and company and while I am not using them in my current role I wish them the best of luck moving forward. I hope I get a chance to use it again, if not professionally - I'll have to take a look at Ionic React for my next personal project.
- yesimahuman 7y ago
  Thanks :)
sergiotapia 7y ago
My ass has been chewed out by Cordova and PhoneGap too much in the past. I hope this is different, I'll take a peek.
config_yml 7y ago
We've abandoned V3 because of the shift in focus. I wish they would have improved the native build service (I think it's called appflow now?) instead of going for 2 more frameworks and an IDE. Wish them all the luck with their new releases. What we would have needed: - Actually usable and maintained plugins. Getting something like push notifications to work is too difficult. And then the plugins won't even build on their build service. It's a lot of hair pulling but should really be low hanging fruit for the ionic team. - Easier submission into the app stores, because onboarding new people on how to do all the manual steps for every legacy app we maintain updates for is a pain in the ass.
- halfmatthalfcat 7y ago
  To piggyback off this: AppFlow is such a great idea in concept, however their execution is half baked. I would LOVE to have a build pipeline that builds both iOS and Android and automatically submits them to the app store, ready to go (whether that's TestFlight or an actual prod build)...AppFlow gets you 80% of the way there to much frustration. I ended up just using Fastlane myself and building my own pipelines that accomplish the exact same thing. Funny too, if you look in the AppFlow build output, they're also using Fastlane. I wish they would have pushed it out _more_ feature complete and include the publish to app stores (I'd be first in line to shell out).
  - yesimahuman 7y ago
    Stay tuned! Actively working on that...
- yesimahuman 7y ago
  Thanks for the feedback. While I’m sad you had a bad experience, I’m happy to report that we’ve made significant improvements to those areas. Capacitor comes with a solid push API out of the box, and we will be launching App Store submission in Appflow soon! Appflow also supports Capacitor as of this summer.
  - pezo1919 7y ago
sireat 7y ago
What's Ionic's real business model? They have enterprise support version but my gut feeling is that they make more money on the tooling.
- yesimahuman 7y ago
  It's a combo. While we offer support and advisory services to medium-to-large enterprises, increasingly companies are deploying our native solutions for local app security (https://ionicframework.com/identity-vault https://ionicframework.com/identity-vault) or our Mobile DevOps service that has seen a lot of growth recently (https://ionicframework.com/appflow https://ionicframework.com/appflow). Finally, our new Studio product has been growing very quickly and will be getting a lot more "low code" dev features in 2020 (https://ionicframework.com/studio https://ionicframework.com/studio). Those products are sold on a subscription basis, either yearly w/ multi-year contracts for bigger companies, or on a self-service basis. If you're curious I did a 2019 business update with more details: https://ionicframework.com/blog/ionic-2019-business-update/ https://ionicframework.com/blog/ionic-2019-business-update/ At a high level we are generating real revenue, growing > 100% y/y (and our enterprise business is ~1.5 yrs old), and nearing profitability.
lucasverra 7y ago
Any demo URL for : best example of ionic @PWA ? What about iOS ? Camera, gps, webauthn, you know the cool new api's I wish to compare :)
vially 7y ago
I haven't used Ionic React, so I can't comment on that, but I've been working on a medium sized Ionic Angular app and I have mixed feelings about it (to the point where if I were to start a new project today I wouldn't use it). Some random issues that come to mind: 1. Stacked (push/pop navigation) This was really bad in Ionic 3 where you didn't actually have a proper router, so this was the only way you could navigate in an app, but it's still an issue in Ionic 4. Basically you can have multiple (stacked) pages in the DOM at the same time which negatively impacts performance (e.g.: more DOM nodes, more computation during change detection cycles, etc). Also, extra cognitive load because you now have to decide for each link whether you want it to push a new page onto the stack, pop it from the stack or replace the root page. 2. Performance problems and/or memory leaks Simply navigating in an Ionic app is enough to create memory leaks: https://github.com/ionic-team/ionic/issues/19242 https://github.com/ionic-team/ionic/issues/19242 3. Trying to use canvas (or size sensitive components) inside an Ionic app - https://github.com/ionic-team/ionic/issues/17920 https://github.com/ionic-team/ionic/issues/17920 - https://github.com/ionic-team/ionic/issues/17940 https://github.com/ionic-team/ionic/issues/17940 4. Slower developement edit/build/reload cycle I don't have the exact numbers right now but last time I checked, just importing the `IonicModule` into an Angular app module (without using any actual Ionic components) resulted in an order of magnitude slower edit/build/reload cycle (I think plain Angular was something like 100-200 ms; after importing `IonicModule` that jumped to 1-2 seconds; not that bad but significant enough that you could actually feel it). Given the overwhelmingly positive community feedback I hear about Ionic in general, I think there's a good chance I may be doing something wrong, in which case I'd love if someone could point it out. That being said, huge thanks to the Ionic team for giving us Capacitor. My experience from migrating the same app from Cordova to Capacitor was really positive. I feel like it brings a breath of fresh air to hybrid app development.
- WA 7y ago
  Hey, I'm just an Ionic user, but maybe a few comments: 1. Not sure about that, but the default is that it pushes to the stack. Isn't this what anyone would expect? 2. Are you sure that Chrome records the number of currently existing nodes or the number of nodes created? I just gave this a try. I have a very simple script that: empties a container div, creates another div, appends it to the container. All of this executed when a button is pressed. The number of DOM nodes should actually stay the same. But Chrome reports an increasing number of nodes. So I'm not sure what the profiler actually does here. 3. I use Canvas inside an Ionic app. If you render your Canvas at the right point of your component lifecycle, it works just fine. 4. Haven't observed this. What I'm doing now: Instead of using Ionic 4 (I have an app made with Ionic 3), I switched to Stencil with @ionic/core. This gives me very fine-grained control over everything. I like it a lot more than the Angular version of Ionic. Maybe you wanna give this a try as well. Less moving parts :)
rgharris 7y ago
Really excited to see this. We have an Ionic Angular app that is running in production and being actively developed. We probably won't get the chance to use Ionic React soon but really hoping this gets more people excited about Ionic. Being able to deploy to iOS, Android, and web with a single codebase is incredible for starting with a MVP and transforming it into a great product.
- yesimahuman 7y ago
  Thanks! I believe that being able to publish a PWA alongside an App Store app is a magic power for products that have a purpose as a web app through link sharing and an app in the stores. Why risk losing users to a download when you can ease them into your world through a PWA first?
JoshMnem 7y ago
It would be nice if it were possible to not have it load Material Design by default. It's a bad idea in general for people to build their products with Google's visual branding. It basically paves the way for Google to become the entire platform.
- fifafu 7y ago
  that depends on your browser / user agent. If you use chrome it’s material, if you use safari it’s ios. If you enter responsive design mode in the chrome dev tools and switch to e.g. an ipad config, it will use ios styles. I really like ionic and capacitor and have built lots of great apps with it. Performance is really ok nowadays (was a problem in the days of ionic 1)
  - JoshMnem 7y ago
    That's much worse than I thought. The Web is not a Google or Apple product, and your product's design shouldn't change based on which browser you use. That entirely misses the point of the open WWW. It's a terrible idea to build things in that way.
    - nine_k 7y ago
      The web is open. You can design things the way you want, standing out or blending in, depending on what you want. Some apps are web technologically, but are local tools by purpose; that's where blending it could be beneficial for the user.
    - kerryritter 7y ago
      Sure, but this is a tool to build cross-platform mobile apps which look and feel native. Imo, proper UI defaults makes sense for such a purpose.
      - JoshMnem 7y ago
        The open Web is independent of the browsing device. If you play Google's game of using their visual branding, you're making it easier for them to hijack the WWW into a Google product. Having that as a default means that many people will implement it.
ss3000 7y ago
First time hearing about Capacitor. Curious if anyone could share some more concrete differences between Capacitor and Cordova?
- stockkid 7y ago
  One of the main differences is that Capacitor projects treat build artifacts as source code, and hence the artifacts are to be version controlled. I thought such aspect was kind of nice for cases in which you need some customization. Here is an example. In Cordova, when using plugins, a developer would have to use various hooks to produce an artifact with a specific customization. But in Capacitor, they can just make changes in the source code itself. As a result, the build is more predictable. On the other hand, such feature might make it more painful to upgrade stuff if the artifact gets littered with tons of customization. While such problem might be rare due to the infancy of Capacitor, maybe in the future it might come back to bite many projects.
  - yesimahuman 7y ago
    That's a good assessment and we're keeping an eye on that future issue. However, we also see the native project and API structure of Capacitor to be very stable and don't anticipate significant changes that will require native project tweaks.
  - brylie 7y ago
    I might be misunderstanding how Capacitor code generation works, but would re-running the build process overwrite code customizations on the previous build? If so, how would this be avoided?
    - stockkid 7y ago
      I see how my comment was confusing. In capacitor, when you initialize a project for a platform (IOS, Android, etc), a bunch of native source code is generated and they are not overwritten.
Kiro 7y ago
I have a responsive React app that I want to convert to an app. I thought you could just drop it in Ionic and it would work automatically but this is using stuff like IonPage, IonContent etc. Do I need to rewrite a lot in order to get it to work and how can I keep a shared codebase in the future? I really don't understand the appeal vs using React Native if I need to rewrite it using Ionic specific components anyway.
- yesimahuman 7y ago
  Yes you would need to use our components because they have meaningful logic when it comes to building an app experience. Can't make the judgement call on whether it's worth you moving to Ionic vs React Native, but Ionic would be a fit if you prefer a "web-native" approach, using the traditional react dev experience around react-dom, and want to target Electron and the web as a Progressive Web App with the same code.
Yuioup 7y ago
Currently we're working on an angular/ionic 3 hybrid project with libraries shared though git submodules (Ionic does not support symlinks). "Libraries" are shared between the Angular app (1 app) and a half dozen or so Ionic apps. Basically the API calls, pipes, directives and other stuff like that. It works well, even though submodules are a pain. We'll be upgrading to Ionic 4 at some point, probably keeping the architecture the same. I don't think we'll be moving to React.
stockkid 7y ago
Am I right in understanding that `@ionic/react` is a set of UI components that are mobile-friendly?
- yesimahuman 7y ago
  Yes, mobile, desktop, and web (Progressive Web App) friendly!
Diesel555 7y ago
I'm a huge fan of Ionic. Capacitor is a great project and fixes a lot of issues I had with Cordova. I have made a few apps that are websites and apps on both stores and they work pretty well I think.

293 points by asaddhamani 7y ago

l_t 7y ago

This looks pretty neat! First I've heard of Ionic, and I want to use it. I have a question for anyone familiar with it. I mostly make Web apps with very complex UIs that target desktop computers specifically. I'm not as concerned with the mobile app story right now, I just want a batteries included UI framework. Is that a valid use-case for Ionic, or should it only be used if cross-platform deployment is needed?

xtracto 7y ago
I´ve used Ionic for both mobile apps and PWA (web sites that access the device hardware). It is pretty straightforward to do both in Ionic. As a side comment, the other day I wanted to do a very simple single page "app" (I jog, so I wanted a "sonar" kind of app that told me how far to my target speed I am, constantly). I thought I was going to give native Andriod Studio a try... as this was a very simple app and I was going to use GPS functionality, it sounded right. I was badly surprised by the way UIs are built in Android Studio, it is so fugly, it took me back to the AWT/Swing framework I worked with in the late 90s. After battling with the ConstraitLayouts and other bullshit, I went back to Ionic to do a simple HTML layout and had the app working in 1 hour. I can't believe in 2019 that is the way Google is making people build interfaces in Android.
- xenospn 7y ago
  Android studio is awful. Moving from it to Xcode is like climbing to an open field out of a dank old basement.
- UlisesAC4 7y ago
  Constraint layout is a delight for working, I wish there was something like that in css.
  - xtracto 7y ago
    I really want to understand it. It reminded me of my days migrating from the Vb5/6 UI to java swing. It was painful, but after you groked its logic, it made sense. How can I get to grok Android's Ui layout process?
FpUser 7y ago
For what you mentioned you might consider Sencha (assuming you want to pay as they're not exactly cheap). Here is the demo page with all their visual components: https://examples.sencha.com/extjs/7.0.0/examples/kitchensink/?modern#all https://examples.sencha.com/extjs/7.0.0/examples/kitchensink...
rgharris 7y ago
Until now Ionic has been mobile first. But they announced earlier this year [1] that they are working towards better desktop support. So I'm not sure it would be the best choice if you need a mature framework for desktop web apps right now and don't need hybrid/native mobile apps. We're currently adding desktop support to our existing Ionic app that has been mobile only so far so we are banking on being able to work around that and Ionic adding better desktop support over time. [1] https://ionicframework.com/blog/ionic-4-roadmap-new-features-release-schedule-goals-oh-my/ https://ionicframework.com/blog/ionic-4-roadmap-new-features...
digitaltrees 7y ago
Quasar framework is awesome and built on vue. https://quasar.dev/ https://quasar.dev/
lowkeyokay 7y ago
My company’s main app is built with ionic. Started with v 1.x and is now on 4.11. I love it but, our app was mostly aimed at mobile. It has since become much more desktop focused and we often have to create our own components. (Which is really easy using Stenciljs, also from ionic). Here’s some things you’ll need to work out: Datepickers. The ones provided by ionic are strictly for mobile. I think they are planning to do a desktop version but I have waited 4 years for that. IE 11 support. Forget it. Luckily it is less and less important but if you need I wouldn’t bother. Desktop style menus and lists. Possible to create but is not included. Ionic are improving dekstop features but it still mostly aimed at mobile. If possible, try creating one of the most desktop centric parts of your app and see how far you get. If mobile use is not important at all you might not get many benefits from using ionic.

hmart 7y ago

I feel Ionic is more engaged into open web than big companies trying to enforce their own standards. The question is when Appple and Google will start blocking (outside of walled garden app stores) hybrid apps?

_bxg1 7y ago
Why would they block hybrid apps? Apple only cares if your hybrid app loads its code at runtime. They couldn't care less if it's JavaScript. Edit: If by "hybrid app" you meant "progressive web app", then yeah, Apple has made it somewhat inconvenient to pin websites to your home screen as apps. But they'd never really be able to block them altogether without blocking the web itself, because there's no hard distinction between the two.
- hmart 7y ago
  That's what I thought, also fear to losing control in the audit or approval process.
- dougmany 7y ago
  I had a Cordova app rejected by the Apple store because it did not use enough native iOS functionality.
  - _bxg1 7y ago
    Were you going out of your way to circumvent native functionality somehow? A calculator app probably "doesn't use much native iOS functionality", but I don't see how that would get it negative points on App Store approval.
    - dougmany 7y ago
      It is basically a search tool to help people find facilities. It does look a lot like a web site though.
      - 7y ago

traderjane 7y ago

I wonder how people who were on the fence for Flutter will think about this.

bradstewart 7y ago
I build the occasional small mobile application. I evaluated Ionic, React Native, and Flutter about 18 months ago; and ultimately landed on Ionic for the projects I needed to ship. Next one will likely use Flutter. The "Hello world" story on Ionic is pretty good--you generate a project and it works. But configuring and maintaining the various layers (Ionic, Cordova, Android Studio and XCode projects for actual building the apps) has been pretty brutal for apps I only touch every few months. So many dependencies that prove very difficult to update correctly. The story looks to be improving with Capacitor though, so I suppose I'll give it another look when that stabilizes.
- yesimahuman 7y ago
  Hey Brad, definitely take a look at Capacitor. We built it explicitly to solve those issues in Cordova. Also keep in mind Flutter also has to deal with native projects and deps so there are some “hard problems” not unique to Cordova here
  - bradstewart 7y ago
    Oh I have no doubt the grass isn't purely greener on the Flutter side. There's a ton of moving parts here for any solution to deal with. Capacitor does look really nice--it was in early beta (maybe even alpha) last time I started a new app project, haven't looked since. Will definitely give it a fair shake when the opportunity arises. EDIT: Adding a bit context to my earlier comment: one of the bigger points of frustration in managing dependencies was figuring out which versions of ionic, ionic-native, ionic/angular, angular, and angular's 6 dozen peer deps actually work together. Definitely doesn't help that I don't use Angular or Ionic on a regular basis, but documenting the expected versions of other components would be a huge help for me.
cgs 7y ago

_bxg1 7y ago

This is one of those products that I'm sure has a large value-add, but still makes me feel gross that it exists. The amount of glue in here... yeesh. Edit: I initially read this to be yet another layer on top of React Native, but it appears to be an alternative to it. So less glue than I thought.

yesimahuman 7y ago
You can think of it as a "Bootstrap for Mobile/Desktop Apps" if that helps. It's not based on React Native but could be used with it to build out certain screens in the app.

tootie 7y ago

I did an Ionic/Angular project a few years back and it's a perfectly cromulent technology if stay within it's wheelhouse. If the app you're building could easily be a website, but the client wants an app store presence, this is by far the easiest way to get there. For delivering content-heavy screens that aren't a drag on CPU, it works fine. And it's also fine for layering in basic device functionality like location services. If expectations and budget are low, it's a great option.

yesimahuman 7y ago
Thanks for teaching me a new word in “cromulent.” While we think Ionic is for more than just low-expectation apps (many brands and consumer apps use Ionic) we appreciate that it fills a need beyond that. Cheers!
- ezequiel-garzon 7y ago
  And me! Now this is interesting: Cromulent first appeared in the February 18, 1996 episode of The Simpsons called "Lisa the Iconoclast," in what could be considered a throw-away line given during the opening credits. The schoolchildren of Springfield are watching a film about the founding father of Springfield, Jebediah Springfield. The film ends with Jebediah intoning, “A noble spirit embiggens the smallest man.” One teacher at the back of the room leans over to another and says that she’d never heard the word embiggen before she moved to Springfield. “I don't know why,” the other teacher replies. “It's a perfectly cromulent word.” https://www.merriam-webster.com/words-at-play/what-does-cromulent-mean https://www.merriam-webster.com/words-at-play/what-does-crom...
  - evil-olive 7y ago
    It's one of my favorite Simpsons quotes. Wonderful little bit of linguistic hackery. They make up one word, embiggen, and just from the obvious root word of "big" it's clear what it means. Doubly so when taken in context, "A noble spirit embiggens the smallest man." Then they make up a second word, cromulent, and the meaning can be entirely inferred from context. Embiggen is a perfectly cromulent word. Acceptable, adequate, maybe a bit unorthodox but "good enough".

nicoburns 7y ago

I'd definitely consider using this. Mobile browser support used to be painful for this kind these "hybrid web apps", and animation performance wasn't up to scratch. But engine support is much better since Android 5, and phones have only been getting faster. It's not that hard to produce a performance mobile-web app these days.

thoughtpalette 7y ago

Huge congrats to the team! This is a giant milestone in Ionics life. Am a huge fan of the original Angular.js and Angular versions and it's nice to see the flexibility with React.

notyourfatherd 7y ago

> Instead of building an abstraction on top of iOS and Android native UI controls, we wanted to build something that was DOM-native Native is dead, on both phone and desktop.

_bxg1 7y ago
I'm a web developer and even I wouldn't agree with this. Especially on mobile.

The_rationalist 7y ago

I espect Ionic React to take a huge share of react native developers on the long term. React native has far less support of web standards/ features than Ionic, especially modern CSS support. Thus ionic give you more power to build feature rich, UX rich apps. Secondly react native has very poor debugging experience, meanwhile ionic support devtools (I couldn't get it to work on RN). Thirdly, contrary to popular belief, I expect ionic to have generally better performance than react native. Chromium evolve quickly and has an army of engineers that bring state of the art optimizations to the web. For example in a few releases, chromium will render elements using Vulkan by default. Lastly, ionic is more native than react could ever be as it supports all 3000+ cordova plugins and seamless Java interop. The ability to reuse the codebase for the web and for electron are also huge advantages. Things will only get better once capacitor stabilize. Still, I really wish that Ionic now focus on Vue.js/ts support.

ausjke 7y ago
vuejs got quasar already, the only missing part is react, which ionic just filled up the gap.
- The_rationalist 7y ago
  I didn't knew about quasar! It seems interesting, still I believe ionic has a far bigger community which is a big time saver.
yesimahuman 7y ago
Wow, thanks, we appreciate the vote of confidence! It is interesting to think about the possible performance gains to be had running JS in the browser rather than in a detached JS engine. For example, WKWebView on iOS has access to the full JIT-ed JS engine on iOS, while JavaScriptCore does not (as I understand it).
- The_rationalist 7y ago
  The challenge for your marketing is to educate people and to update their beliefs. It would be nice if you ran public benchmarcks of two equivalent app one in Ionic, one in RN (and eventually more (flutter, etc)) If you are empirically the fastest (maybe we will need to wait a few chromium milestones or to manually enable Vulkan) You could market those numbers by showing you are the first to have Vulkan rendering, HTTP3, CSS contains, dom fragments, etc (I believe Microsoft is working on moving chromium input handling out of the main thread) And if you showed things you can't do/easily do in react native. For example backdrop-filter has recently been added to chromium and is the future of UX. https://ferdychristant.com/please-help-make-backdrop-filter-a-reality-f81805ba3d52 https://ferdychristant.com/please-help-make-backdrop-filter-... But really there's so many features that you offer and others don't! OpenXR, SVG support, css width auto, css grid, etc If you want an exhaustive list: https://www.chromestatus.com/features https://www.chromestatus.com/features Really if react native was on https://caniuse.com/ https://caniuse.com/ people would see the truth (the feature gap). Your marketing also could just make visualizations about the gap in size between the ionic ecosystem (more plugins than RN + all npm packages) vs RN npm packages, that would show the order of magnitude of order of magnitude difference and so how many billions of dollars of man/hours developpers miss by choosing RN. Unrelated: I hope that you are aware of the cordova maintenance issue https://github.com/apache/cordova/issues/163#issuecomment-542432768 https://github.com/apache/cordova/issues/163#issuecomment-54... And capacitor won't be a true successor until it will have full compatibility with prior cordova plugins.

s1mpl3 7y ago

Kudos! This is a great project. I have one bone to pick, though. Had a show stopper issue a few months back with capacitor and the entire Ionic team was unresponsive, even on github. The issue was sending cookies to the server. Cookie would get set on the response but subsequent requests would not include the cookie. This was extremely aggravating and I had to halt my development. Relevant Github issue: https://github.com/ionic-team/capacitor/issues/1373 https://github.com/ionic-team/capacitor/issues/1373. Would be great to know if a solution was ever found.

GordonS 7y ago
I used Ionic for 2 projects a few years back. Support on GitHub was, frankly, crap. I can sympathise to some degree, because they were still trying to figure out a commercialisation model, but they were far more interested in shipping new stuff and breaking things than actually stabilising what they already had. Major bugs affecting lots of people were ignored forever or closed without comment. It made for a horrible dev experience, and I honestly can't see myself touching it again with an extra-long barge pole.
- yesimahuman 7y ago
  Sorry about that, we definitely had some growing pains given we were a team of < 5 on the OSS side with a user base in the millions. Tried to automate as much as possible on the github side and over-applied our issue robot. I think our process has improved quite a bit recently and hope you give us another shot!
- chiefalchemist 7y ago
  Sounds exactly like WordPress and Gutenberg.
xtracto 7y ago
My main problem with Ionic (having used it for several apps) is that it is very difficult to find answers to question on the web. Reference sites are full of "this is how I fixed it" that work on v1 or v2 or v3 and most of all don't work for v4. Unfortunately the speed in which they are changing things make community references obsolete quickly.

mocha_nate 7y ago

Big fan of this update!

sp33der89 7y ago

How does Capacitor compare to for example Cordova or Flutter or React Native? From their site I gather it's like Cordova 2.0?

kalev 7y ago
I believe Capacitor is the absolute life-saver of hybrid development. I've been using Cordova for quite a while and switched to Capacitor last year, and it made my life so much easier. Where Cordova tries to do anything and everything, for all platforms, with its super flaky plugins and buggy config.xml, Capacitor is really focused on doing one thing well: being the shell between your code and native hardware. One of the major points is the code it generates for iOS and Android can be committed to GIT and is yours; you have full control over the native part of your app and could extend it in any way shape or form. I have an app running in production now for almost a year and am so so glad I've chosen Ionic 4 and Capacitor. Kudos to the team.
- yesimahuman 7y ago
  Glad you're liking it! While we remain big fans of Cordova we do have the fortunate advantage of building Capacitor in 2019 where we have access to much better JS standards, native tooling that is far more mature than before, and a clearer outlook on what devices/platforms need to be supported, not to mention Progressive Web Apps. We've tried to take advantage of those technological leaps and apply them where possible.
- WA 7y ago
  Do you use any in app purchase plugin for Cordova in your Capacitor app?

ausjke 7y ago

Awesome news. For quite a while we had ionic for Angular, react native for React, quasar for Vue, now glad to see ionic officially supports react from now on. At the moment though, React-Native has 7x downloads comparing to Ionic: https://www.npmtrends.com/ionic-vs-quasar-framework-vs-react-native https://www.npmtrends.com/ionic-vs-quasar-framework-vs-react...

yesimahuman 7y ago
re: downloads, it's not quite that simple. `ionic` is our CLI while `react-native` is the actual library that is installed and will be installed frequently for build systems, etc. Also there are multiple versions of Ionic under multiple package names. Not arguing that React Native has more NPM downloads though but Ionic is quite popular on its own!

tschellenbach 7y ago

Nick did a post about this: https://dev.to/nickparsons/how-to-build-an-ionic-chat-app-with-react-and-stream-3c1g https://dev.to/nickparsons/how-to-build-an-ionic-chat-app-wi... I was surprised with how good the performance was. Really, better than unoptimized native apps, which is (at least to me) quite surprising

mLuby 7y ago

Ionic was a huge velocity-booster at my last startup. They caught some (unfair) flak for being Angular-centric when React got hot. Glad to see them constantly improving things! P.S. Can the creator.ionic.io get more love? 0:)

yesimahuman 7y ago
Glad to hear that! And while creator.ionic.io likely won't get more love, our new Ionic Studio product is quickly catching up to the simplicity of the drag and drop experience in Creator and will quickly be surpassing it, so I hope you check that out! https://ionicframework.com/studio https://ionicframework.com/studio

dcchambers 7y ago

I love Ionic! Glad to see them reach this milestone. Great product and company and while I am not using them in my current role I wish them the best of luck moving forward. I hope I get a chance to use it again, if not professionally - I'll have to take a look at Ionic React for my next personal project.

yesimahuman 7y ago
Thanks :)

sergiotapia 7y ago

My ass has been chewed out by Cordova and PhoneGap too much in the past. I hope this is different, I'll take a peek.

config_yml 7y ago

We've abandoned V3 because of the shift in focus. I wish they would have improved the native build service (I think it's called appflow now?) instead of going for 2 more frameworks and an IDE. Wish them all the luck with their new releases. What we would have needed: - Actually usable and maintained plugins. Getting something like push notifications to work is too difficult. And then the plugins won't even build on their build service. It's a lot of hair pulling but should really be low hanging fruit for the ionic team. - Easier submission into the app stores, because onboarding new people on how to do all the manual steps for every legacy app we maintain updates for is a pain in the ass.

halfmatthalfcat 7y ago
To piggyback off this: AppFlow is such a great idea in concept, however their execution is half baked. I would LOVE to have a build pipeline that builds both iOS and Android and automatically submits them to the app store, ready to go (whether that's TestFlight or an actual prod build)...AppFlow gets you 80% of the way there to much frustration. I ended up just using Fastlane myself and building my own pipelines that accomplish the exact same thing. Funny too, if you look in the AppFlow build output, they're also using Fastlane. I wish they would have pushed it out _more_ feature complete and include the publish to app stores (I'd be first in line to shell out).
- yesimahuman 7y ago
  Stay tuned! Actively working on that...
yesimahuman 7y ago
Thanks for the feedback. While I’m sad you had a bad experience, I’m happy to report that we’ve made significant improvements to those areas. Capacitor comes with a solid push API out of the box, and we will be launching App Store submission in Appflow soon! Appflow also supports Capacitor as of this summer.
- pezo1919 7y ago

sireat 7y ago

What's Ionic's real business model? They have enterprise support version but my gut feeling is that they make more money on the tooling.

yesimahuman 7y ago
It's a combo. While we offer support and advisory services to medium-to-large enterprises, increasingly companies are deploying our native solutions for local app security (https://ionicframework.com/identity-vault https://ionicframework.com/identity-vault) or our Mobile DevOps service that has seen a lot of growth recently (https://ionicframework.com/appflow https://ionicframework.com/appflow). Finally, our new Studio product has been growing very quickly and will be getting a lot more "low code" dev features in 2020 (https://ionicframework.com/studio https://ionicframework.com/studio). Those products are sold on a subscription basis, either yearly w/ multi-year contracts for bigger companies, or on a self-service basis. If you're curious I did a 2019 business update with more details: https://ionicframework.com/blog/ionic-2019-business-update/ https://ionicframework.com/blog/ionic-2019-business-update/ At a high level we are generating real revenue, growing > 100% y/y (and our enterprise business is ~1.5 yrs old), and nearing profitability.

lucasverra 7y ago

Any demo URL for : best example of ionic @PWA ? What about iOS ? Camera, gps, webauthn, you know the cool new api's I wish to compare :)

vially 7y ago

I haven't used Ionic React, so I can't comment on that, but I've been working on a medium sized Ionic Angular app and I have mixed feelings about it (to the point where if I were to start a new project today I wouldn't use it). Some random issues that come to mind: 1. Stacked (push/pop navigation) This was really bad in Ionic 3 where you didn't actually have a proper router, so this was the only way you could navigate in an app, but it's still an issue in Ionic 4. Basically you can have multiple (stacked) pages in the DOM at the same time which negatively impacts performance (e.g.: more DOM nodes, more computation during change detection cycles, etc). Also, extra cognitive load because you now have to decide for each link whether you want it to push a new page onto the stack, pop it from the stack or replace the root page. 2. Performance problems and/or memory leaks Simply navigating in an Ionic app is enough to create memory leaks: https://github.com/ionic-team/ionic/issues/19242 https://github.com/ionic-team/ionic/issues/19242 3. Trying to use canvas (or size sensitive components) inside an Ionic app - https://github.com/ionic-team/ionic/issues/17920 https://github.com/ionic-team/ionic/issues/17920 - https://github.com/ionic-team/ionic/issues/17940 https://github.com/ionic-team/ionic/issues/17940 4. Slower developement edit/build/reload cycle I don't have the exact numbers right now but last time I checked, just importing the `IonicModule` into an Angular app module (without using any actual Ionic components) resulted in an order of magnitude slower edit/build/reload cycle (I think plain Angular was something like 100-200 ms; after importing `IonicModule` that jumped to 1-2 seconds; not that bad but significant enough that you could actually feel it). Given the overwhelmingly positive community feedback I hear about Ionic in general, I think there's a good chance I may be doing something wrong, in which case I'd love if someone could point it out. That being said, huge thanks to the Ionic team for giving us Capacitor. My experience from migrating the same app from Cordova to Capacitor was really positive. I feel like it brings a breath of fresh air to hybrid app development.

WA 7y ago
Hey, I'm just an Ionic user, but maybe a few comments: 1. Not sure about that, but the default is that it pushes to the stack. Isn't this what anyone would expect? 2. Are you sure that Chrome records the number of currently existing nodes or the number of nodes created? I just gave this a try. I have a very simple script that: empties a container div, creates another div, appends it to the container. All of this executed when a button is pressed. The number of DOM nodes should actually stay the same. But Chrome reports an increasing number of nodes. So I'm not sure what the profiler actually does here. 3. I use Canvas inside an Ionic app. If you render your Canvas at the right point of your component lifecycle, it works just fine. 4. Haven't observed this. What I'm doing now: Instead of using Ionic 4 (I have an app made with Ionic 3), I switched to Stencil with @ionic/core. This gives me very fine-grained control over everything. I like it a lot more than the Angular version of Ionic. Maybe you wanna give this a try as well. Less moving parts :)

rgharris 7y ago

Really excited to see this. We have an Ionic Angular app that is running in production and being actively developed. We probably won't get the chance to use Ionic React soon but really hoping this gets more people excited about Ionic. Being able to deploy to iOS, Android, and web with a single codebase is incredible for starting with a MVP and transforming it into a great product.

yesimahuman 7y ago
Thanks! I believe that being able to publish a PWA alongside an App Store app is a magic power for products that have a purpose as a web app through link sharing and an app in the stores. Why risk losing users to a download when you can ease them into your world through a PWA first?

JoshMnem 7y ago

It would be nice if it were possible to not have it load Material Design by default. It's a bad idea in general for people to build their products with Google's visual branding. It basically paves the way for Google to become the entire platform.

fifafu 7y ago
that depends on your browser / user agent. If you use chrome it’s material, if you use safari it’s ios. If you enter responsive design mode in the chrome dev tools and switch to e.g. an ipad config, it will use ios styles. I really like ionic and capacitor and have built lots of great apps with it. Performance is really ok nowadays (was a problem in the days of ionic 1)
- JoshMnem 7y ago
  That's much worse than I thought. The Web is not a Google or Apple product, and your product's design shouldn't change based on which browser you use. That entirely misses the point of the open WWW. It's a terrible idea to build things in that way.
  - nine_k 7y ago
    The web is open. You can design things the way you want, standing out or blending in, depending on what you want. Some apps are web technologically, but are local tools by purpose; that's where blending it could be beneficial for the user.
  - kerryritter 7y ago
    Sure, but this is a tool to build cross-platform mobile apps which look and feel native. Imo, proper UI defaults makes sense for such a purpose.
    - JoshMnem 7y ago
      The open Web is independent of the browsing device. If you play Google's game of using their visual branding, you're making it easier for them to hijack the WWW into a Google product. Having that as a default means that many people will implement it.

ss3000 7y ago

First time hearing about Capacitor. Curious if anyone could share some more concrete differences between Capacitor and Cordova?

stockkid 7y ago
One of the main differences is that Capacitor projects treat build artifacts as source code, and hence the artifacts are to be version controlled. I thought such aspect was kind of nice for cases in which you need some customization. Here is an example. In Cordova, when using plugins, a developer would have to use various hooks to produce an artifact with a specific customization. But in Capacitor, they can just make changes in the source code itself. As a result, the build is more predictable. On the other hand, such feature might make it more painful to upgrade stuff if the artifact gets littered with tons of customization. While such problem might be rare due to the infancy of Capacitor, maybe in the future it might come back to bite many projects.
- yesimahuman 7y ago
  That's a good assessment and we're keeping an eye on that future issue. However, we also see the native project and API structure of Capacitor to be very stable and don't anticipate significant changes that will require native project tweaks.
- brylie 7y ago
  I might be misunderstanding how Capacitor code generation works, but would re-running the build process overwrite code customizations on the previous build? If so, how would this be avoided?
  - stockkid 7y ago
    I see how my comment was confusing. In capacitor, when you initialize a project for a platform (IOS, Android, etc), a bunch of native source code is generated and they are not overwritten.

Kiro 7y ago

I have a responsive React app that I want to convert to an app. I thought you could just drop it in Ionic and it would work automatically but this is using stuff like IonPage, IonContent etc. Do I need to rewrite a lot in order to get it to work and how can I keep a shared codebase in the future? I really don't understand the appeal vs using React Native if I need to rewrite it using Ionic specific components anyway.

yesimahuman 7y ago
Yes you would need to use our components because they have meaningful logic when it comes to building an app experience. Can't make the judgement call on whether it's worth you moving to Ionic vs React Native, but Ionic would be a fit if you prefer a "web-native" approach, using the traditional react dev experience around react-dom, and want to target Electron and the web as a Progressive Web App with the same code.

Yuioup 7y ago

Currently we're working on an angular/ionic 3 hybrid project with libraries shared though git submodules (Ionic does not support symlinks). "Libraries" are shared between the Angular app (1 app) and a half dozen or so Ionic apps. Basically the API calls, pipes, directives and other stuff like that. It works well, even though submodules are a pain. We'll be upgrading to Ionic 4 at some point, probably keeping the architecture the same. I don't think we'll be moving to React.

stockkid 7y ago

Am I right in understanding that `@ionic/react` is a set of UI components that are mobile-friendly?

yesimahuman 7y ago
Yes, mobile, desktop, and web (Progressive Web App) friendly!

Diesel555 7y ago

I'm a huge fan of Ionic. Capacitor is a great project and fixes a lot of issues I had with Cordova. I have made a few apps that are websites and apps on both stores and they work pretty well I think.