Face heavy lagging while clicking ion-select

Ionic Framework
1

Im using Ionic V4…Im having nearly 3000 records in my backend api…i just want to show that all records in ion select…but my device is getting very slow while clicking that ion select field…can anyone give me a solution for this!

2

Paged loading/viewing

Showing 3000 at once seems bad UI for me anyway

So rethink UI and dont try to show all at once

Use searchbox etc? Paged?

3000 items in an ion-list with ionic4 is a performance killer too

2 Likes
3
2 Likes
4

Hi mikrochipkid,

Its working…Thanks for ur response…after i used this ion virtual scroll i don’t get any lag while clicking ion select field…but its showing only 5 values randomly in ion select option can’t able to scroll anymore…its showing only maximum 5 random values in total values…i don’t know why this is happening…give me any solution for this!

Here is my code,

    <ion-select class="common-border" *ngIf="item.field_data_type == 'LOV'" placeholder={{item.form_left_prompt}}
      [(ngModel)]="item.fieldvalue" (ionChange)="DocValueChange(item)">

      <ion-virtual-scroll [items]="item.ChildArray" approxItemHeight="320px" >
        <ion-select-option  *virtualItem="let child" [value]="child.ID">{{child.VALUE}}
        </ion-select-option>
      </ion-virtual-scroll>

    </ion-select>
5

For loop in ion-select-option may be

1 Like
6

yeah @MOHANTHANGARAJ…but i have already bind the array values…but i don’t know why its showing only 5 values randomly…

1 Like
7

well if you have read full documentation about ion-virtual-scroll you might be able to point out the issue

the point is I haven’t worked with ion-virtual-scroll

but as of what I have read about ion-virtual-scroll it only renders some content into DOM and as user scrolls through it adds some more to its list

may be ion-virtual-scroll doesn’t work well in ion-select

and my suggestion would be to add a search bar to ion-select and let the user search for the options

or you may try ion-infinite scroll inside ion-select instead of ion-virtual-scroll