Chrome: "Not optimized: optimized too many times" for _updateDOMProperties and unmountChildren

[lencioni]

React 15.4.2, Chrome 56.0.2924.87 and 57.0.2987.110

I have been doing some profiling in Chrome of the render performance of some of our components and noticed a couple of deoptimizations in React.

The message Chrome reports is "Not optimized: optimized too many times", which apparently happens when V8 optimizes a function but when running it found a reason to deopt it, and this happened more than max_opt_count setting (currently set to 10). More information: GoogleChrome/devtools-docs#53 (comment)

Clicking through the profile, it looks like most of the time is perhaps spent on this line, but I'm not sure if that is a clue as to what the deopt might be in this case.

nextProp = this._previousStyleCopy = _assign({}, nextProp);

It might be worth spending some time digging into this, but I'm not sure if it will still be relevant after React 16.

[gaearon]

I don't think this line exists in React Fiber implementation.

Please feel free to experiment with react@next and react-dom@next and file any issues about them though!

[aweary]

For reference, that line was removed in 447e0a1, but time spent is not a direct indicator of why a function might deopt, so a profile of react-dom@next would be a great idea!

[thysultan]

Just came across this deopt as well, it's deopting because a named argument nextProps is being reassigned.

function (lastProps, nextProps, transation) {
   // ...
    nextProp = this._previousStyleCopy = _assign({}, nextProp);

So it may affect fiber if there are similar patterns there.

[gaearon]

I think you might be confusing nextProps and nextProp. Also AFAIK it was deopting because lastProps is sometimes null but we're using a for in loop. In either case, I don't think fixing that gave any meaningful effect in my testing a while ago, and Fiber code is structured a bit differently. You're welcome to check it for deopts though (we have alphas published).