CODEWITHSUNDEEP
javascriptjquerygoogle-chromeweb-applicationsbrowser
kingrichard2005
kingrichard2005

Reputation: 7289

Chrome RangeError: Maximum call stack size exceeded when using jQuery $.map

I'm testing a web application for my employers which involves retrieving a large amount of data from the server. The data is returned as a JSON object using the $.ajax function, containing large quantities of sub-objects which I convert to arrays using jQuery's $.map function as follows

data_points = $.map(result.data.LotsOfIt, function(value, ndx){
              return value;
          }); //Throws Maximum call stack size exceeded with large data set.

This seems to be exhausting Chromes stack size limit, everytime I run this function Chrome will throw a RangeError: Maximum call stack size exceeded. If I reduce the amount of data returned, it works just fine. What's interesting is that FireFox and IE9 will process the larger data set just fine, but I thought Chrome had a larger stack size limit than either of these browsers so I would've expected them both to fail as well. Has anyone else encountered this problem? Is there a workaround? Or will I have to update my code to limit the amount of data returned in order to avoid this error?

Upvotes: 4

Views: 3707

Answers (1)

kingrichard2005
kingrichard2005

Reputation: 7289

Ok, so after doing some reading, I suspect that the issue had something to do with a recursive call within the $.map implementation that was causing the Chrome browser stack to overflow. I had to rework the code to iterate over the collection of returned JSON objects manually and in a non-recursive manner. After refactoring the code to use $.map against the entire collection at cone, the stack overflow issue no longer appeared.

Upvotes: 2

Related Questions