I currently have a video feed that mirrors that of Tik Tok (video plays, user scrolls new video plays, etc).

The issue I'm currently encountering is when I scroll to the next video, it takes a good few seconds to load the new video, not creating a smooth experience.

I'm thinking a possible workaround could be I display let's say three videos at the same time, but technically only display 1 (keep the other videos out of view until they are called). When I scroll, we push the next video into view and take the previous view out of sight.

  Is that a possible workaround here? Any tips would be greatly appreciated.

ScrollView {
                LazyVStack (spacing: 0){
                    ForEach(feedLogic.videoPosts) { video in
               // let urlString = (FeedLogic.shared.videoURLsFeed as? [String] ?? [])[index]
                        FeedIndividualBox(video: video, player: player,userName: video.name ,isShowingTab: isShowingTab, tabMatrice: .constant(video.tabMatrice), handleLikes: handleUserLikes)
                            .containerRelativeFrame([.horizontal, .vertical])
                            .id(video.id)
                            .task{ playInitialVideo()
                        }
                    }
                    .onAppear { player.play() }
                }
                .scrollTargetLayout()
            }
            .scrollDisabled(isShowingTab ? true : false )
            .scrollPosition(id: $scrollPosition)
            .scrollTargetBehavior(.paging)
           .ignoresSafeArea()
            .onChange(of: scrollPosition) { oldValue, newValue in
                playVideoOnChangeOfScrollPosition(videoID: newValue)
            }