I'm getting Maximum update depth exceeded when i'm using 100k in columns and rows in dynamic example

[estebansolisd]

Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
▶ 4 stack frames were collapsed.
ref
/src/index.js:194:36
  191 | key={virtualColumn.index}
  192 | ref={el => {
  193 |   virtualRow.measureRef(el);
> 194 |   virtualColumn.measureRef(el);
      |                ^
  195 | }}
  196 | className={
  197 |   virtualColumn.index % 2

[tuanddd]

Anyone still getting this error on production only?

[gitcatrat]

@tuanddd It doesn't have to be anything related to react-virtual, i.e I got the error like this:

{virtualizer.virtualItems.map(row => {
  const isLoaderRow = row.index > row.length - 1;
  const post = flatPosts[row.index];

  return (
    <div 
      key={row.index}
      ref={row.measureRef}
      style={{
        position: 'absolute',
        top: 0, left: 0,
        width: '100%',
        height: `${getRandomIntBetween(300, 600)}px`, // <- too many function calls according to React
        transform: `translateY(${row.start}px)`
      }}
    >
      {isLoaderRow
        ? postsQuery.canFetchMore
          ? "Loading more..."
          : "Nothing more to load"
        : post.title}
    </div>
  );
})}

[noerxs]

I got stomach ache because of this. React array is not humane