Function slow to iterate through observable array first time function is called, is much quicker after.

50 views
Skip to first unread message

Adam.M

unread,
May 4, 2016, 6:15:20 AM5/4/16
to KnockoutJS
Hi,

I have been using your awesome libraries to create a javascript based search on engine for a site I am working on.

I have been noticing some odd behaviour when iterating through an observablearray. 

So first, some context. The scripts I have written are used to 
  • Populate a search screen with items and filter options returned from ASP repeaters
  • Filter search results 
  • Access items from this page or controls related to it
One odd piece of behaviour I have noticed is that when selecting a filter option (which is bound to a function within it's knockout object), the script is slow to loop through the observablearray containing all of the results (Usually 1000ish items). What happens during this process is that during each loop, the script will check the item against all of the filters that have been selected by the user, and will either hide or show this item depending on the outcome. What's weird is that the first time this function is invoked by the user, it is rather slow, but after that, the functionality becomes a lot faster, almost instantaneous to carry out. 

Pseudocode: for (i = 0; i < self.Items().length; i++) {

                      var currItem = self.Items()[i];
                      currItem.ShowOnResults(true); 

                      //Carries out checks against all filter options
                      //Sets ShowOnResults to false if it fails one of the filter arguments
                     }

In summary, is there a way I could potentially speed this process up, am I doing something wrong or is it a matter of I'm putting too much pressure on the knockout libaries?

Thanks.

Michael Best

unread,
May 4, 2016, 9:00:11 PM5/4/16
to KnockoutJS
Have you tried turning on deferred updates?  http://knockoutjs.com/documentation/deferred-updates.html

-- Michael

Adam.M

unread,
May 5, 2016, 9:57:47 AM5/5/16
to KnockoutJS
Hi Michael,

I followed the advice on that page and I got the following error in my browser's console:

uncaught TypeError: Cannot set property 'deferUpdates' of undefined(…)

Could this be due to a version issue? We're currently using V 3.3.0.

Thanks.
Message has been deleted

Michael Best

unread,
May 6, 2016, 5:26:01 AM5/6/16
to KnockoutJS
Oh Sorry I didn't read your whole post. If you're using 3.3.0, you can try using the plugin: https://github.com/mbest/knockout-deferred-updates

-- Michael

On Thursday, May 5, 2016 at 11:24:18 PM UTC-10, Michael Best wrote:
What version of Knockout are you using? That feature requires the latest version, 3.4.0.

-- Michael

Adam.M

unread,
May 6, 2016, 11:41:49 AM5/6/16
to KnockoutJS
Hi Michael,

I've updated my version of knockout to 3.4.0 and that alone has made a huge difference in performance.

I've also included the change you recommended in the article which has made quite a difference on the larger result sets.

Thanks for your help!

Adam

Michael Best

unread,
May 6, 2016, 6:33:16 PM5/6/16
to KnockoutJS
That's great. Always good to hear that our work is a success.

-- Michael
Reply all
Reply to author
Forward
0 new messages