Tab with list performance issue

@daniel_amram wrote:

Hey there, i have an app with 2 tab pages - first page map with markers and and the sconed page is a list.
The list contains something around 400 items, and i have performance issue when im switching to the list page.

At the first time its taking something about 5 seconds (that's after i have the items in the component), and after that its about 2-3 seconds of rendering when im switching to the list tab.

This is the list page:

<ion-header>
  <ion-navbar>
    <ion-title>
      List
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <ion-list [virtualScroll]="list">
  <ion-card *virtualItem="let rest">
    <ion-img [src]="rest.url"></ion-img>
    <ion-fab right top>
      <button ion-fab>
        <ion-icon name="pin"></ion-icon>
      </button>
    </ion-fab>

    <ion-item>
      <ion-icon name="wine" item-left large ></ion-icon>
      <h2>{{rest.name}}</h2>
      <p>{{rest.address}} {{rest.city}}</p>
    </ion-item>

    <ion-item>
      <button ion-button icon-left clear item-right>
        <ion-icon name="navigate"></ion-icon>
        Start
      </button>
    </ion-item>
  </ion-card>
  </ion-list>
</ion-content>

I've tested it on my phone - LG G3 and some other devices, results were the same.
Adding here the ionic info:

global packages:

    @ionic/cli-utils : 1.3.0
    Cordova CLI      : 7.0.1
    Ionic CLI        : 3.3.0

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.3.0
    @ionic/cli-plugin-ionic-angular : 1.3.0
    Cordova Platforms               : android 6.2.3
    Ionic Framework                 : ionic-angular 3.3.0

System:

    Node       : v8.0.0
    OS         : Windows 7
    Xcode      : not installed
    ios-deploy : not installed
    ios-sim    : not installed

Thank you for ur answer.

Posts: 1

Participants: 1

Read full topic