I am currently using React Profiler to try and diagnose why the load times on my application are so long. When doing this, I saw that my PivotBody component was taking a long time to load:
Image of Flame Chart
The load time says 1580 ms, which is a very long time. In my application this component is a grid that is 100x100 in size, where each cell in the grid is a div with some styling (basic borders, background color, etc...). Each of these divs are rendered in another React component that return just the singular div.
What is strange to me is that according to this flame chart, the PivotBody component has no children that have long render times. If this is the case, why is it taking so long to render? A 100x100 grid is not too unreasonable and should not take this much time.
I guess my question is, what does it mean that this component has no children with long render time but still takes a long time to render?
Thanks!