-
Notifications
You must be signed in to change notification settings - Fork 47.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Bug: Maximum call stack size exceeded (React Devtools) #22293
Comments
@wavesoft Can you share a repro case with me please? I'd love to verify the fix (and if possible maybe even add an automated regression test– although this might not be possible, given the underlying problem seems to be with the generated code not the source code). |
That is interesting! I don't think this is true for the native spread operator. For example, this runs okay for me in Chrome: [...new Array(1_000_000).fill(true)] I'm pretty sure this has to do with the code that's generated in the build (for backwards compat): function utfDecodeString(array) {
return String.fromCodePoint.apply(String, _toConsumableArray(array));
}
// Babel generated polyfill code below...
function _toConsumableArray(arr) {
return (
_arrayWithoutHoles(arr) ||
_iterableToArray(arr) ||
utils_unsupportedIterableToArray(arr) ||
_nonIterableSpread()
);
}
function _nonIterableSpread() {
throw new TypeError(
"Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."
);
}
function _iterableToArray(iter) {
if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter))
return Array.from(iter);
}
function utils_unsupportedIterableToArray(o, minLen) {
if (!o) return;
if (typeof o === "string") return utils_arrayLikeToArray(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))
return utils_arrayLikeToArray(o, minLen);
}
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return utils_arrayLikeToArray(arr);
}
function utils_arrayLikeToArray(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) {
arr2[i] = arr[i];
}
return arr2;
} This throws as you describe: test(new utfDecodeString(1_000_000)) |
Actually I think this depends on the function. Indeed your array example works as expected, but try this: String.fromCharCode(...Array(1_000_000)) For me it fails natively on chrome 😉 EDIT: I just realised you are doing a spread operator on an array. This is trivially translated into a
Unfortunately my project structure is pretty complex to identify just one possible code path that is causing that issue. My best guess is that it's happening when I am replacing (un-mounting and re-mounting) a couple of thousand of child elements at once. I can try to isolate a reproducible example it but it will take some time... If it suits you though, I can easily give you a JSON dump of the contents of the said "operations" event that caused the exception. |
Nice follow up information! Thanks!
Fair enough. I think we can proceed without a repro in this case. |
I encountered the same issue as #20640 but using
react-devtools
as a stand-alone app instead of from the the browser.The bottom line is that the profiler becomes unresponsive after any interaction with a heavily loaded react page.
React version:
Steps To Reproduce
yarn run react-devtools
) to a sessionDiagnostics
I actually went through and found out the origin of the issue, however I am not sure what would be the best approach to fix it.
It seems the the origin is a (very) big incoming message:
That eventually causes a maximum call stack exceeded error:
Coming from
util.js:128
:And interestingly enough, doing spread operator with an array with 235124 elements actually causes a
Maximum call stack size exceeded
error 😄I tried replacing the code above with the following replacement and it seems to work:
The text was updated successfully, but these errors were encountered: