Ion Slider stuck a while on the first slide and then slide

I am using a ion-slider with following slide options.

slideOpts = {
    slidesPerView: 3.5,
    loop: true,
    centeredSlides: false
  };

I fetch the data from Firebase to the slider.

this.firedb.list<any>('/2020/sliderTest').valueChanges().subscribe(data => {
      data.forEach(entry => {
        this.dataArray.push(entry);
      });
});

And then, I need my slider to start from a specific point. To do that, I do this.

ionViewDidEnter() {
    this.holidaySlider.slideTo(6, 0);
}

This setup works fine, but only in fast internet connection.

When I switch the network into slow 3G, The slider shows only the first slide for a while, and then slides. In some occasions, it slides to the required position. But in most cases, it stops halfway. (This is in browser debugging)

I experienced the same behavior when I run the app on a low end device. On the devices with enough computational power, it runs smooth as expected on the same network.

Anything I can do about this? any workaround at least?

ezgif-6-eb52f568f12e

UPDATE:

slideTo() doesn’t have to be there. Without it also, the issue takes place. Shows the first slide on the middle and then only it shows the other slides.

I removed the ion slider completely and created a my own slider using bootstrap flex. It does the job.

Thanks…