WebImage in a LazyVStack in a ScrollView causes stuttering

[chrysb]

Hi folks! If we embed WebImages within a LazyVStack or LazyHStack, it causes the view to stutter.

[Demo video] [StackOverflow post]

I suspect it has something to do with variable view sizing.

Unfortunately, this is a non-starter for any project where we want to embed WebImage within a ScrollView w/ a LazyVStack.

Here's my code, simplified:

ScrollView {
  LazyVStack {
    HStack { 
      Spacer()
      if let imageUrlString = item.assetUrl, let imageUrl = URL(string: imageUrlString) {
        WebImage(url: imageUrl)
          .resizable()
          .scaledToFill()
        }
    }
  }
}

I've tried removing the modifiers as well as adding fixedSize() along with a fixed size frame and it doesn't resolve the issue.

Any help or insight or resolution would be a game changer!

[chrysb]

After further investigation, it seems like a general problem with SwiftUI.

I've documented the issue here: https://stackoverflow.com/questions/68459594/content-with-variable-height-in-a-lazyvstack-inside-a-scrollview-causes-stutteri

Any support in reporting this to Apple would be super appreciated. I think it's the only thing holding back SwiftUI from being production ready.