1

I am having performance issues while looping through large data sets (approx. 10k) records in Lightning component Controller using JavaScript.

Below is the object var wrpr = {Account:Account,Checked:false }; I have a list which has around 10k records of this object. While passing data to the server I need only the Account ids rather than the entire object. To accomplish this I am looping through all the elements in the list and extracting the Account Id as below. var selectedRecordIds = []; for (var i = 0; i < allRecords.length; i++) { if (allRecords[i].Checked) { selectedRecordIds.push(allRecords[i].Account.Id); } }

to execute this loop its taking around 50-60 seconds resulting in bad UI experience. Is there a better way to get the Ids from the object so that it increases the performance?

8
  • 1
    First of all why do you have 10k records in UI?
    – RedDevil
    Nov 14, 2019 at 19:14
  • Have you checked if it’s faster to just pass the array as is and then loop through in the backend controller?
    – nicolevy
    Nov 14, 2019 at 19:14
  • @RedDevil There is a requirement where the users create account groups and they may add around 10k accounts to a group. So I have to display 10k records.
    – samdev
    Nov 14, 2019 at 19:18
  • @nicolevy yes I have tried to loop on the server side as well, it is comparatively faster on the client-side.
    – samdev
    Nov 14, 2019 at 19:20
  • 1
    @samdev can you try putting the account id into some kind of data attribute on whatever dom element is displaying the account and then get the list of them from there (looks like that is maybe checkboxes)? It’s weird that it is taking that long to iterate through these objects, are they large objects? That would also explain why it takes longer for the server to iterate, the delay could be happening during transmission. If so, is it possible to try to reduce the size of these (amount of variables held in each one)?
    – nicolevy
    Nov 14, 2019 at 19:41

1 Answer 1

2

In JavaScript, you can simply write:

var selectedRecordIds = 
    allRecords.filter(row=>row.Checked).map(record=>record.Account.Id);

There might be something else going on, as JavaScript should require only a small fraction of a second on a modern computer to complete this task. I just tested this in a script on my browser:

var x = [];
while(x.length<1e5) {
    x.push({checked:Math.random()<0.5,account:{Id:x.length}});
}
console.log(x.filter(row=>row.checked).map(record=>record.Id));
1
  • @ sfdcfox Thank you! it worked like a charm!
    – samdev
    Nov 14, 2019 at 21:28

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .