Virtual list laggy

1

Hi , I’m using the virtual lost media +lazy load + infinite load. After loaded the list about 300+ it’s start to lag when click view and swipe back.

Anybody have the way to make it faster or reduce laggy ?

2

i’d went through this :crossed_fingers:

HOW I RESOLVED :arrow_down:
virtual DOM :ok_hand:

3

Thank you I will try it :slight_smile:

4

Hi , I don’t know how to convert my post data to get the result then return to component page can you help me to change my code ?

normally I use this go get the result

  var postData.do = 'list';
  app.request.post(appUrl, postData, function(data) {
     ... //do something with return data
  });

… to something like this

<script>
  return {
    data: function () {
      return {
        // empty initial user data
        user: null,
      }
    },
    on: {
      pageInit: function () {
        var self = this;
        var app = self.$app;
        // request user data on page init
        app.request.get('http://api.website.com/get-user-profile', (user) => {
          // update component state with new state
          self.$setState({
            user: user,
          });
        });
      },
    },
  };
</script>
5

:checkered_flag: this may help :arrow_down:

  1. on Pageinit

var user = [];
app.request({
url: apiUrl,
method: methodType,
timeout: 3000,
async: false,
dataType: ‘json’,
success: function (data) {
data.map((newData) => {
user.push({
// create your desired key here and assign values from iterate object (i.e. newData)
// for instance:
Quarter: newData.Quarter,
FromDate: newData.FromDate,
ToDate: newData.ToDate,
UserName: newData.userName,
ReportId: newData.QuarterlyReportId,
});
});
self.$setState({
items: user,
});
},
error: function (xhr) {
//preloader.Hide();
self.$setState({
user: null,
});
},
});

  1. data object
data: function () {
 return {
 // empty initial user data

user: null,
}
},

  1. Use expression as you required inside html :page_facing_up:

      inside page content class

 <div>{{this.Quarter}}</div>
<div>{{this.FromDate}}</div>

  2. more here about expressions (apply logic :mage: )
    Template7

6

Thank you so much I will try it