Hey! I’m new to Compose iOS and got a noob-questio...

# compose-ios

[Max]

Hey! I’m new to Compose iOS and got a noob-question:
Does Compose iOS translate Compose to native SwiftUI, or does it use a custom render engine to draw the elements (like Flutter)?
Curious to know🤓

[mohamed rejeb]

It's using Skia for the rendering.

[andrew]

If you want to use compose for real native UIKit elements, you might want to check out: https://github.com/cashapp/redwood

[andrew]

Some very cool tech, and I’m sure anyone in #squarelibraries would be happy to answer questions

[andrew]

While compose normal canvases use Skia like android does, the tech to use native views has already been proven

[Joel Denke]

Just so you know Swift itself using bindings in LLVM to compile to objC world in similar way Kotlin multiplatform do from Kotlin to objc interop and such. Dont know exact details, but something like that.
Nothing native with SwiftUi itself from my understanding. The interesting part is the ui rendering and compose compile process imo :) As compose using annotations it will be possible compile to multiple targets. This also happens in Android. For Android kind a get a root View and draw on canvas in that. And for iOS I Imagine similar approach but another container using Skiko.

This also means Compose multiplatform can wrap/run SwiftUi and UiKit interop. Not same performance as true native rendering. Compare when people in Android mixing XML and Compose, quite similar.
If I understood correct Compose multiplatform using
https://github.com/JetBrains/skiko

[Max]

Thx @mohamed rejeb, @andrew, @Joel Denke for clarifying!
I’m asking because I was never satisfied with Flutter’s performance on iOS .. as a dev you could always “feel” it laggs a bit and is not as smooth as native iOS UI. Especially if the app grew, and you add animations for large UI elements, the lagginess even on the flagship iPhone Pro models was noticable.

May I ask what are your experiences with Compose iOS in this area? Is it superior to Flutter? I have big hopes in Jetbrains and KMM, but the performance on iOS needs to be great

[Joel Denke]

@Max I now got genuine curious, what is satisfied performance? I understand well the need for good performance in native world, as users expect it.
But what is the level of satisfaction needed? It is very hard imo to compare iOS Native, Flutter and Compose Skia depending which iPhone using and such.
From my experience the most issues relies on the boot time, when launch the app first time. Once started it becomes less problems, as kind of warmed up.
But I am also not a hardcore Apple fan, not used iPhone in a couple of years.

Mostly had issues in the past with bad implementation of screen transitions and such (Even on native Android), but from using Chris Banes / Circuits iOS solution for navigation natively in iOS it feels very smooth to me. The things I know people had somewhat complained on is input fields, but more in terms of implementation and not so much because of performance from my experience.

But also I am primary Android developer professionally myself, and less iOS developer. However building a new Compose multiplatform app, and so far working nice in iOS and Android from what I done so far. Using 100% code sharing for that, to avoid mixing to much in interop, as I know that usually has bad impact on performance regardless platform. Mostly had that issue on Flutter in the past when using to much plugins interop a lot with the native SDK system on core level, or bad architecture.

As native developer in Android I also experienced performances issues if had to use bad frameworks, other devs using bad implementation of animations and such. And some older devices ofc will work slower as often RAM is low on those in combination of expected data to be used in modern apps, like network traffic and such in combination with UI thread work.

[mohamed rejeb]

Here's a demo of an iOS app make with Compose Multiplatform by @Kashismails: https://twitter.com/kashif_mehmood_/status/1744196636081832075
Check it out to have a better understanding of how cmp performs in iOS.

[Joel Denke]

@mohamed rejeb Would not use as a benchmark I think. Short video not tell much.

[Kashismails]

@Joel Denke thats not a small app bro we have 5m+ downloads on android and these are only a few flows that i shared in the video

[mohamed rejeb]

Well, my bad that's not the full video, check this: https://twitter.com/kashif_mehmood_/status/1743564245835333793

[Joel Denke]

Ah ok sorry @Kashismails didnt get the complete context from it. Cool 🙂

[Max]

@Joel Denke I’m also an Android dev, but use a iPhone for my private stuff since years, so I compare them quite frequently:)
All few months i’m looking at the state of the art Flutter apps, and test them how “native” they feel. Some month back I found a Travel app, that was created by an agency paid by Google to create a state of the art Flutter app to showcase its capabilities (I tried to find the link, but cannot remember the name). So Google paying for a Flutter app - that needs to be top nodge - was my thinking. When running this medium complex app on my iPhone it was not “butter smooth”. What I mean by that? Let’s say there is a bigger dropdown and when tapping it there is a slight delay in it opening. Or the ripple on a button would start not when my finger presses the button but shortly after. It just “felt” slow(er) compared to native apps.
What is satisfying performance? Good question. I would answer that question with “it has to be fun using the app”. Maybe that’s me seeing apps 8hrs a day - but I don’t enjoy when I feel a slight lagginess. And because iPhone users are the users that pay for in-app subs mostly, the iOS app needs to be great. so my hopes for Compose iOS are high.

@Kashismails I installed your app on my iPhone and am surprised, I don’t feel the lagginess I know from Flutter in the key areas of the app (like buttons). Great work you guys did there! Considering it’s an Alpha version of Compose, i’m impressed!
The only thing as a die-hard iOS user that I noticed, was that the “swipe right from the left screen edge” to go to the previous page does not work everywhere. I know I know, that’s how Compose works and how the navigation style on Android is - but this could be optimised maybe like this in the future? Then my dev hearth would be satisfied😂
Great app again!

[Joel Denke]

@Max Right then we kind of having the same picture I think of how good native feels like. Also it differs in feeling for me in iOS vs Android. Especially how fling scroll in Android works compared to iOS approach in over scrolling kind a if remember correct. Or transitions when interacting with elements, like a button. On iOS it should feel a certain way, and in Andorid with ripple effect it feels another way, like press the feedback milliseconds differ in each platform.
So not only about performance, also consistent feeling in each platform and between apps I guess. In some cases it could be a branding thing, but most companies doesnt have budgets like Google, Netflix or such 😄

From what I compared so far, it feels very smooth compares to other apps I created in Flutter, React Native when using Compose multiplatform 1.5.0 or later, thats really important as they did a huge leap in the CMP version from Jetbrains 🙂

I am however uncertain if I use ripple effects on iOS, if its fast and smooth, would iOS users be disappointed? 😄 Getting the touch effects Android used for years. Personally I like it, as giving improved accessiblity and not only visual effect.

[Joel Denke]

Also for the navigation part, test using the library Circuit with predictive back gestures in Android and equivalent in iOS edge to edge with peek and such.
For me feels very good, but it was a couple of years I had iPhone and need to go side by side iPhone vs Android soon I think to know for sure 😄

[Joel Denke]

See https://slackhq.github.io/circuit/circuitx/#gesture-navigation for how it looks with Circuit in iOS vs Android 🙂

[Kashismails]

@Max behold the power of compose, swipe has been fixed https://x.com/kashif_mehmood_/status/1744196636081832075?s=20

[Max]

@Joel Denke my personal opinion is we should not use ripple effect on iOS. Makes me cringe every time i see an app on my iPhone have ripple. gives me the feeling the dev cares more about Android than iOS. however that’s my personal taste:)

[Max]

@Kashismails The last video you posted looks great. Solid work! Exactly what i meant, looking forward to test it on my iPhone once the update is rolled out

Can you share the tutorial/library you used for that swipe back effect? Is it the same approach like here?

[Joel Denke]

@Max If ignore Android vs iOS. Isnt ripple effect nice accessibility thing for many users?

[Joel Denke]

@Max If you use circuit library, you get this swipe effect native on both Android and iOS :)

[Kashismails]

@Max i used a similar approach, i am using voyager since its pretty straight forward unlike circuit which is not only a navigation library but effects your architectural decisions as well. You can also use decompose it also has the android predictive back gesture support along with the ios swipe behaviour. At the end of the day it all depends on your domain and needs.

[Kashismails]

as for UX, you can always use platform specific things such as dialogs, pop ups, video players and what not. It depends on your design language rather than what is available in compose or how compose renders a component

[Kashismails]

https://github.com/adrielcafe/voyager/issues/144 you can also check this if you want to go with voyager. @SrSouza has done a great work here

[Joel Denke]

@Kashismails I use circuit only for navigation and nothing else. Their iOS implementation very close to iOS native animation.

[Kashismails]

@Joel Denke i agree that’s very true