Performance when using a VStack inside a Scrollview (alternatives to List) in SwiftUI

Question

With the built in List view, it is not possible to remove the line separator between cells. In my design I need to display a label at the right side of each line, and sometimes even hide the lines.

For now the only workaround for this is to use a VStack inside a ScrollView. But what is the performance when doing this? Is it safe to do this for a very long ScrollView? Do we actually need reuse behavior since SwiftUI uses data structures instead of UIViews?

In the video session (https://developer.apple.com/videos/play/wwdc2019/237/) they were also explaining the layout behaviour of SwiftUI, can't imagine that a very long VStack in a ScrollView would be performant when needing to calculate the height of each cell... Of course they could have implemented some sort of layout caching.

Answer 1

I've stumbled across a similar problem. Found that using Metal might be the best solution to keep performance up. .drawingGroup() to be precise. See here for further explanation. It is important to keep in mind that this transforms the view into an image. So active controls like TextField will no longer work. Tap-able areas do still work as well as animations.

/// Composites this view's contents into an offscreen image before final
/// display.
///
/// Views backed by native platform views don't render into the image.
/// Instead, they log a warning and display a placeholder image to highlight
/// the error.
///
/// - Parameters:
///   - opaque: A Boolean value that indicates whether the image is opaque.
///     If `true`, the alpha channel of the image must be one.
///   - colorMode: The working color space and storage format of the image.
/// - Returns: A view that composites this view's contents into an offscreen
///   image before display.
public func drawingGroup(opaque: Bool = false, colorMode: ColorRenderingMode = .nonLinear) -> some View