Merge pull request #1562 from DimensionDev/feature/ios_performance

optimize ios performance

Author: Tlaster

compose-ui/build.gradle.kts

@@ -104,6 +104,7 @@ skie {
         group {
             DefaultArgumentInterop.Enabled(true)
         }
+        enableFlowCombineConvertorPreview = true
     }
 }
 

iosApp/flare/UI/Component/AdaptiveGrid.swift

@@ -2,18 +2,21 @@ import SwiftUI
 
 struct AdaptiveGrid: Layout {
 
-    public var singleFollowsImageAspect: Bool
-    public var spacing: CGFloat
-    public var maxColumns: Int
+    public let singleFollowsImageAspect: Bool
+    public let singleViewAspectRatio: CGFloat?
+    public let spacing: CGFloat
+    public let maxColumns: Int
 
     public init(
         singleFollowsImageAspect: Bool = true,
+        singleViewAspectRatio: CGFloat? = nil,
         spacing: CGFloat = 4,
         maxColumns: Int = 3
     ) {
         self.singleFollowsImageAspect = singleFollowsImageAspect
         self.spacing = spacing
         self.maxColumns = max(1, maxColumns)
+        self.singleViewAspectRatio = singleViewAspectRatio
     }
 
     public struct Cache {}
@@ -140,9 +143,13 @@ struct AdaptiveGrid: Layout {
 
     private func aspectForSingle(subviews: Subviews) -> CGFloat {
         if singleFollowsImageAspect {
-            let ideal = subviews[0].sizeThatFits(.unspecified)
-            if ideal.width > 0, ideal.height > 0 { return max(0.01, ideal.width / ideal.height) }
-            return 1
+            if let ratio = singleViewAspectRatio {
+                return max(9.0/21.0, ratio)
+            } else {
+                let ideal = subviews[0].sizeThatFits(.unspecified)
+                if ideal.width > 0, ideal.height > 0 { return max(0.01, ideal.width / ideal.height) }
+                return 1
+            }
         } else {
             return 16.0 / 9.0
         }

iosApp/flare/UI/Component/KotlinPresenter.swift

@@ -1,28 +1,32 @@
-import KotlinSharedUI
+@preconcurrency import KotlinSharedUI
 import Foundation
-import Combine
+@preconcurrency import Combine
 
 // using @Observable might init presenter multiple times
 // which is a heavy work since Kotlin Presenter is not designed to do so
 // so we keep using the old ObservableObject and @StateObject
 // see: https://github.com/Dimillian/IceCubesApp/issues/2033
 final class KotlinPresenter<T: AnyObject>: ObservableObject {
+    private var subscribers = Set<AnyCancellable>()
     var presenter: PresenterBase<T>
     let key = UUID().uuidString
 
     init(presenter: PresenterBase<T>) {
         self.presenter = presenter
         self.state = presenter.models.value
-        self.presenter.subscribe { [weak self] newState in
+        self.presenter.models.toPublisher().receive(on: DispatchQueue.main).sink { [weak self] newState in
             self?.state = newState
-        }
+        }.store(in: &subscribers)
     }
 
     @Published
     var state: T
 
-    @MainActor
+//    @MainActor
     deinit {
-        self.presenter.close()
+        subscribers.forEach { cancellable in
+            cancellable.cancel()
+        }
+        presenter.close()
     }
 }

iosApp/flare/UI/Component/MediaView.swift

@@ -17,7 +17,6 @@ struct MediaView: View {
         switch onEnum(of: data) {
         case .image(let image):
             AdaptiveSizeMediaContainerView(
-                aspectRatio: CGFloat(image.aspectRatio),
                 expandToFullSize: expandToFullSize
             ) {
                 NetworkImage(data: image.previewUrl)
@@ -26,7 +25,6 @@ struct MediaView: View {
             MediaVideoView(data: video, expandToFullSize: expandToFullSize)
         case .gif(let gif):
             AdaptiveSizeMediaContainerView(
-                aspectRatio: CGFloat(gif.aspectRatio),
                 expandToFullSize: expandToFullSize
             ) {
                 NetworkImage(data: gif.url)
@@ -38,24 +36,17 @@ struct MediaView: View {
 }
 
 struct AdaptiveSizeMediaContainerView<Content: View>: View {
-    let aspectRatio: CGFloat?
     let expandToFullSize: Bool
     @ViewBuilder let content: () -> Content
 
-    init(aspectRatio: CGFloat? = nil, expandToFullSize: Bool, @ViewBuilder content: @escaping () -> Content) {
-        self.aspectRatio = aspectRatio
+    init(expandToFullSize: Bool, @ViewBuilder content: @escaping () -> Content) {
         self.expandToFullSize = expandToFullSize
         self.content = content
     }
 
     var body: some View {
         if expandToFullSize {
-            if let aspectRatio {
-                content()
-                    .aspectRatio(aspectRatio, contentMode: .fit)
-            } else {
-                content()
-            }
+            content()
         } else {
             Color.gray
                 .opacity(0.2)
@@ -92,7 +83,6 @@ struct MediaVideoView: View {
 
     var body: some View {
         AdaptiveSizeMediaContainerView(
-            aspectRatio: CGFloat(data.aspectRatio),
             expandToFullSize: expandToFullSize
         ) {
             NetworkImage(data: data.thumbnailUrl)

iosApp/flare/UI/Component/NetworkImage.swift

@@ -6,8 +6,7 @@ struct NetworkImage: View {
     let placeholder: URL?
     let customHeader: [String: String]?
     var body: some View {
-        KFAnimatedImage
-            .url(data)
+        KFAnimatedImage(data)
             .requestModifier({ request in
                 if let customHeader {
                     for (key, value) in customHeader {
@@ -24,11 +23,12 @@ struct NetworkImage: View {
                         .redacted(reason: .placeholder)
                 }
             }
-            .if(placeholder == nil, if: { image in
-                image.loadTransition(.blurReplace)
-            }, else: { image in
-                image
-            })
+            .cancelOnDisappear(true)
+//            .if(placeholder == nil, if: { image in
+//                image.loadTransition(.opacity)
+//            }, else: { image in
+//                image
+//            })
 //            .resizable()
             .scaledToFill()
     }

iosApp/flare/UI/Component/PagingView.swift

@@ -8,10 +8,10 @@ struct PagingView<T: AnyObject, EmptyContent: View, ErrorContent: View, LoadingC
     @ViewBuilder
     let errorContent: (KotlinThrowable, @escaping () -> Void) -> ErrorContent
     @ViewBuilder
-    let loadingContent: () -> LoadingContent
+    let loadingContent: (Int, Int) -> LoadingContent
     let loadingCount = 5
     @ViewBuilder
-    let successContent: (T) -> SuccessContent
+    let successContent: (T, Int, Int) -> SuccessContent
     var body: some View {
         switch onEnum(of: data) {
         case .empty: emptyContent()
@@ -20,20 +20,19 @@ struct PagingView<T: AnyObject, EmptyContent: View, ErrorContent: View, LoadingC
         }
         .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)
         case .loading: ForEach(0..<loadingCount, id: \.self) { index in
-            loadingContent()
+            loadingContent(index, loadingCount)
         }
         case .success(let success):
             ForEach(0..<success.itemCount, id: \.self) { index in
-                if let item = success.peek(index: index) {
-                    successContent(item)
-                        .onAppear {
-                            _ = success.get(index: index)
-                        }
-                } else {
-                    loadingContent()
-                        .onAppear {
-                            _ = success.get(index: index)
-                        }
+                ZStack {
+                    if let item = success.peek(index: index) {
+                        successContent(item, Int(index), Int(success.itemCount))
+                    } else {
+                        loadingContent(Int(index), Int(success.itemCount))
+                    }
+                }
+                .onAppear {
+                    _ = success.get(index: index)
                 }
             }
 
@@ -70,7 +69,13 @@ extension PagingView {
                     retry()
                 }
             },
-            loadingContent: loadingContent, successContent: successContent)
+            loadingContent: { index, loadingCount in
+                loadingContent()
+            },
+            successContent: { item, index, itemCount in
+                successContent(item)
+            }
+        )
     }
 }