Lottie performs poorly in SwiftUI #2517
Replies: 3 comments 6 replies
-
|
Can you share a complete sample project demonstrating the issue? e.g. an Xcode project that can be built and ran, and has performance problems. Including a comparison of the performant UIKit integration vs non-performant SwiftUI integration would be helpful. |
Beta Was this translation helpful? Give feedback.
-
|
@calda Attaching the sample project as requested: You can toggle between these 2 dequeue methods to switch between UIKit & SwiftUI. |
Beta Was this translation helpful? Give feedback.
-
|
Thanks. The problem is that cell reuse isn't working. This LottieAnimationView.swiftUIView {
LottieAnimationView( // <--- Called by `UIViewRepresentable.makeUIView` in `SwiftUIView.swift`
animationSource: animationSource,
imageProvider: imageProviderConfiguration?.imageProvider,
textProvider: textProvider,
fontProvider: fontProvider,
configuration: configuration,
logger: logger)
}You need to make it so that the cell registration happens in a way that enables view reuse to work correctly. |
Beta Was this translation helpful? Give feedback.
-
|
I believe this is probably a fundamental limitation of using struct LabelRepresentable: UIViewRepresentable {
func makeUIView(context: Context) -> some UIView {
let label = UILabel()
label.text = "\(labelCount)"
labelCount += 1
return label
}
func updateUIView(_ uiView: UIViewType, context: Context) { }
}let swiftuiCellRegistration = UICollectionView.CellRegistration<UICollectionViewListCell, Item> {
cell, indexPath, item in
cell.contentConfiguration = UIHostingConfiguration {
LabelRepresentable()
}
} |
Beta Was this translation helpful? Give feedback.
-
|
@calda Is there a way to work around this limitation? If I use lottie within SwiftUI container like struct LottiePerf: View {
let range = (1...10)
var body: some View {
ScrollView {
LazyVStack {
ForEach(range, id: \.self) {_ in
LottieView({
await .loadedFrom(url: URL(string: "https://lottie.host/88273770-c18c-4569-a95e-a81c541d1d7a/imkwsJjUVl.json")!)
})
.frame(height: 200)
.frame(maxWidth: .infinity)
}
}
}
}
} |
Beta Was this translation helpful? Give feedback.
-
|
@calda any updates? |
Beta Was this translation helpful? Give feedback.
-
|
@calda Were you able to check this? |
Beta Was this translation helpful? Give feedback.
-
|
Such bug isn't reproduced in 3.4.4 version. But the latest 4.5.2 has got such problem. |
Beta Was this translation helpful? Give feedback.
All reactions
-
|
Has somebody resolved such issue? |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
-
Which Version of Lottie are you using?
Lottie 4.5.0
I'm using a lottie in a collection view. When I use lottie in the UIKit context, i.e. using a UICollectionViewCell subclass via
uikitCellRegistrationas can be seen in the attached code, it performs well without any issues. If I try to add the SwiftUI variant added via UIHostingConfiguration(swiftuiCellRegistration), it starts to stutter with high CPU usage & on occasion results in app termination with memory warning. Shared the code below to reproduce the same. This setup is just to put things into perspective.In a pure SwiftUI setup, using a container such
LazyVStackorListinstead ofUICollectionView, the same performance degradation can be observed.On doing an app profile, it revealed the cause of hangs to be animation layer creation. In SwiftUI case, it seems to be called repeatedly creating the overhead.
Please check this on priority as our app is heavily reliant on Lotties & this issue is a bottleneck for us to build anything on SwiftUI.
Similar issue was reported earlier as well without much traction
App profile screenshot:
Expected Behavior
Performance in UIKit:
uikit_variant.MP4
Actual Behavior
Performance in SwiftUI:
swiftui_variant.MP4
Animation JSON
sample_lottie.json
Beta Was this translation helpful? Give feedback.
All reactions