Laggy UI with LottieView in LazyVStack

Lottie in Mobile
1

Hi, I’m using a LottieView in my SwiftUI project, where I’m passing a URL to download the Lottie animation. This view is embedded in a LazyVStack. However, I’m experiencing significant UI lag when scrolling through the stack. Any suggestions on how to improve the performance or fix this issue? I have also tried downloading and caching the lottie file and loading the lottie from cache for subsequent loads, that is also not working properly.

enum ImageViewType {
    case image
    case lottie
}

struct TestLottieView: View {
    
    private let urlSession: URLSession = URLSession.shared
    let data : [ImageViewType] = [.lottie, .image, .image, .image, .image, .lottie, .image, .image, .lottie, .image, .image, .image, .image, .image, .image, .lottie, .image]
    
    var body: some View {
        ScrollView {
            LazyVStack {
                ForEach(data.indices, id: \.self) { index in
                    switch data[index] {
                    case .image:
                        ImageTempView()
                    case .lottie:
                        LottieTempView()
                    }
                }
            }
        }
    }
}

struct LottieTempView: View {
    var body: some View {
        LottieView {
            await LottieAnimation.loadedFrom(url: URL(string: "https://lottie.host/43f6f908-fe95-48d7-a3df-5129bb3419d4/PkLlMPmFbe.json")!)
        } placeholder: {
            Rectangle().fill(Color.red)
        }
    }
}

struct ImageTempView: View {
    var body: some View {
        Image("img1")
            .resizable()
            .frame(width: 300, height: 200)
    }
}