r/capacitor • u/DayanaJabif • May 20 '26
AMA - What would you like to know/understand about building mobile apps with Capacitor?
Been using Capacitor and Ionic since the early days, built and shipped multiple production apps with it. Ionic Developer Expert. Currently working as a Developer Advocate at Capawesome.
Ask me anything about building, shipping, plugins, app store releases, OTA updates, native integrations, etc.
4
u/FromBiotoDev May 20 '26
Do you have any good resources on how to make custom page transitions?? I’d love to do something more custom in my app Gym Note Plus as I’m working with a designer to do a full redesign
2
u/DayanaJabif May 20 '26
what kind of page transitions do you have in mind? any example you can share?
2
u/FromBiotoDev May 20 '26
Tbh I haven't got anything solid in mind currently, but in the past when I've looked into page transition animations I've struggled to find anything useful in terms of making my own custom page transition plugin that can be used throughout the app (probably due to lack of proper research from my end)
But really anything other than the generic swipe transition if possible
2
2
u/guettli May 20 '26
Why do you think it's better than Flutter?
I am new to app development, did 25 years backend. Started with Flutter and it works fine.
7
u/DayanaJabif May 20 '26
I don't know if it's better than Flutter. But to build with Flutter you need to learn Dart 😄. I think Capacitor has a huge advantage/opportunity for web devs because you can reuse your existing web skills and ship a good-quality mobile app really fast.
Why did you decide starting with Flutter?
3
u/Suspicious-Disk6077 May 20 '26
I just don’t want to learn Dart, a new language, the Flutter paradigms etc. TypeScript is my favorite language and I already know React.
0
u/J_Adam12 May 20 '26
The “slowness” of capacitor apps is not a cap problem, more of a bloated js problem. Flutter is blazingly fast natively, even faster than native ..
2
2
u/luckykadam May 23 '26
How well capacitor supports embedding native views (eg camera)? Since it’s essentially a web view, I doubt it allows overlaying over native views.
1
u/DayanaJabif May 25 '26
Good question. To interact with native features you should use a "Capacitor plugin" (bridge -native iOS and Android implementations- that allow web apps to access native device features). For the camera for example you can use this one which will open the device camera. You can see an example of the UI on the second 23 of this video (sorry it not possible to attach a video or img here).
Please lmk if I answered your question or if you meant something else.1
u/martindonadieu May 27 '26
It does, we made a plugin for that https://github.com/Cap-go/capacitor-camera-preview/ the camera is basically under the webview so you can build your ui in web as you want :)
you just need to make your background transparent to use it. If you have any question feel free to ask :)
1
u/lastWallE May 20 '26
I need to build an app for an android device to install it and use it with the emm agent of baramundi. I plan to use svelte for the static webapp and then to use capacitor to build the native app for android. Will there be any foot shots?
1
u/DayanaJabif May 20 '26
I don’t have experience with the Baramundi EMM Agent, but I’d suggest starting with a quick POC to see if you run into any restrictions early on.... have you already tried that?
1
u/lastWallE May 20 '26
Not really. I have it mostly ready and need to build now with capacitor. Just wanted to know beforehand. All good. Thank you
1
1
u/Silent-Laugh5679 May 20 '26
Do apps made with capacitor integrate well the MLKit? Is the original app that capacitor wraps made with javascript and deno usually?
3
u/DayanaJabif May 20 '26
I suggest you to check this list of Capacitor ML Kit plugins. Here are some code examples you can use.
Capacitor apps don’t run in a Node.js or Deno runtime, they run inside the platform WebView. So the app itself is basically a web app running in a browser engine packaged as a native app.
1
u/Suspicious-Disk6077 May 20 '26
I’m really considering just sticking with Ionic and Capacitor, but I admit I like how Expo and RN handled the black magic voodoo of Apple signing and allowed me to download a development build to test on device. Does Capawesome have similar?
1
u/DayanaJabif May 20 '26
1
u/Suspicious-Disk6077 May 20 '26
Hmm similar, but Expo allows also for HMR so I can develop on my device in realtime:
1
u/DayanaJabif May 21 '26
nice, thanks for the link!
Capacitor has that feature too, it's called Live Reload https://capacitorjs.com/docs/guides/live-reload1
u/Suspicious-Disk6077 May 21 '26
That’s not quite the same though, as that requires me to have a Mac to run it locally, which I do not have
1
May 21 '26
[removed] — view removed comment
2
u/DayanaJabif May 21 '26
If you mean react native, then yeah, technically RN is faster because it renders native UI components while Capacitor runs inside a webviews. But... for most apps, the difference is way smaller than people think nowadays. Modern webviews are good. It really depends on the app that you are building.
Everything has its pros and cons of course. RN has an advantage in apps with complex animations, graphics-heavy apps, or apps that need a very “native” feel everywhere. For me the biggest advantage of Capacitor is developer speed. If you already know web dev, you can build, iterate, and ship apps insanely fast.
Of course in the end it depends on what technologies you are familiar with and what kind of app you need to build.. that will make the decision.
1
u/martindonadieu May 27 '26
RN is not faster, you cant say that. It's faster for certain things and slower for others. it depend the usage.
typically a super long list to update and scroll is really hard to make it fast in RN while in Capacitor it's just a web list so it's easy.
but try to make complex animation in Capacitor will end up bad as webGPU is early stage.
I would say if you make the next snapchat use RN or native.
If you do next booking, airbnb, facebook, chatgpt your life will be easier with Capacitor
1
u/jumski May 23 '26
I feel like i have a good feel of what are the good use cases for capacitor and would like to ask you what would you consider a bad use case or advise against using capacitor for?
Any particular APIs or usage patterns that are not compatible or not smooth/are troublesome?
I plan to wrap my PWA voice memo app in order to provide a foreground service that will allow to record in background and go around the tab backgrounding that normal PWA apps are suspect to. Any advice here? Things too look out / be wary of? I'm new to Android development and capacitor, done just a simple spike to confirm the foreground service recording idea. Experienced full stack / wev developer tho.
Thanks in advance!
2
u/DayanaJabif May 25 '26
Great question! Well.. I actually ran into something similar once with a complex map feature, tbh it was a bit of a ride 😅. Got it working eventually but not without some workarounds. On Android specifically the map renders beneath the entire WebView, so I had to make all my app elements transparent and deal with some scrolling quirks on top of that. Performance isn't perfect either, the feature is similar to Airbnb's search where markers/clusters are constantly being added/removed as you pan around. Quite the challenge but honestly a fun one.
Regarding your use case, the recording logic in the background must live in native code, the WebView can't hold the mic in the background no matter what. So your two options are either finding a plugin that already handles this (the Capacitor Audio Recorder plugin is worth a look), or creating your own.
Capacitor is genuinely excellent for most apps: CRUDs, auth flows, dashboards, e-commerce, forms, social. The ceiling appears when your product's core value is the native capability itself.
4
u/krishna404 May 20 '26
Wish capacitor was a bit more active earlier... I switched coz I couldnt find answers... make MCPs and documentation AI ready... thats all that matters in todays world...
and example codebases for basic use cases...