I have a list of approximately ~1000 items where each item(s) can be selected or unselected i.e something like ui preview here

My implementation (simplified) is essentially this

@State private var selectedIds: UUID[] = []

List {
  Section {
    // Header View
  }

  Section {
    ForEach(items) { item in
      let isSelected = selectedIds.contains(item.uuid)
      ItemView(item: item, isSelected: isSelected, selectedIds: $selectedIds)
    }
  }

  Section {
    // Footer
  }
}

So in essence, different styling gets applied to selected items and they all get a binding to selected id array where they will either add their own id or remove it when user taps on a “checkmark”.

This works well in general, but I noticed an issue when I do the following:

1. I select first list item
2. I scroll really fast to the middle of the list (past many items)
3. I select another item

After I select 2nd item list “jumps” / “readjusts”, not sure how to explain it, but I end up in a random section of it and my selected item is way up. So it feels as if while I was scrolling really fast, some items were not “rendered / included in a list” and after I select 2nd item, state change triggers list to “refresh?” loading in all those previous items?

Not sure how to work around this and keep selection smooth