如何获得更好的性能，离子使用表滑块盒？

Question

嗨，我用的是https://github.com/saravmajestic/ionic/tree/master/tabbedSlideBox

它对可滚动选项卡非常有用，但我发现，由于我使用了多个可滚动选项卡(超过4-5个选项卡)，性能会大幅下降。这是因为它试图在开始时为所有选项卡幻灯片框创建视图内容。

我尝试使用它与30个可滚动选项卡，它需要大约3-4秒来显示第一个选项卡。

怎样才能将视图内容的创建推迟到所有其他选项卡的幻灯片更改事件(焦点选项卡除外)？这样，焦点选项卡可以更快地加载，当用户点击选项卡时，可以用旋转器显示其他选项卡视图。

Answer 1

我在离子幻灯片盒上也有类似的问题。当我有超过5-6的幻灯片时，性能急剧下降.我花了超过10秒的时间来加载一张幻灯片。

我的解决方案是在任何时候只构建3张幻灯片--当前幻灯片，下一张幻灯片和上一张幻灯片。

我使用了以下技巧:将幻灯片的内容包装在DIV中，并添加ng-如果如下所示

<ion-slide-box class="blackBg" on-slide-changed="slideChanged(index)" show-pager="false" active-slide="photoIndex">

        <ion-slide ng-repeat="photo in photos track by $index">

            <div ng-if="$index >= (photoIndex-1) && $index <= (photoIndex+1)">

                 // You slide content here...

            </div>

       </ion-slide>

</ion-slide-box>