Fetch response.json() seems slower than response.text()

[mchev2]

Just wanted to document this performance issue (incase it really exists).

fetch_from_network = function() {
  fetch(url, {
      headers: {
        'Cache-Control': 'no-cache'
      }
    })
    .then(function(res){
      // If we do res.json, for unknown reason it is slowing the render of our very complex view. res.text() does not seem to have this issue
      return res.text();
    })
    .then(function(json){
      // setstate is called in this.process
      this.process( JSON.parse(json) );
    }.bind(this));
}.bind(this);

[satya164]

@mchev2 Can you do some profiling and post the results?

[mchev2]

I did some independent tests and did not see any difference between res.text and res.json. I had to add in caching so res.text will work for my use case.

I'm not sure where the issue could be. Perhaps the json is too heavily nested and so there is a bottleneck. I will close this for now and let you know if I find anything else.

Thank you

[MrMotski]

@mchev2 just bringing this guy's issue to your attention, could be similar.

https://stackoverflow.com/questions/36499603/taking-too-much-time-to-call-promises-then-function/36501330#36501330

[rickli1989]

I have encountered the same issue, the responseText comes back straight away in milliseconds, but when it convert to json using .json(), it takes a few seconds, the interesting thing is if I click the screen during the .json() parsing period, it get the json data back straight away

[ide]

Make sure you are:

• profiling on device, not with Chrome debugger
• profiling in production
• measuring just the response.json() time and not anything else like setState.