MR Page incremental rendering

What does this MR do?

It renders the MR page incremental so the perceived performance is much better. On load all diffFiles get a property renderIt which is set to false. Also we cap the initially rendered lines to max 2000 (of course stuff can be expanded, etc.).

Based on that we show a loading indicator and then through the use of requestAnimationFrame + requestIdleFrame we use then the next spot to set one by one file to actually render their diff's. I have seen with a 5000 line MR already visible interaction after 60ms. As we also use way less memory at once there are less garbage collections and its way faster.

Are there points in the code the reviewer needs to double check?

Does everything on the MR page still work.

Why was this MR needed?

So the actual + perceived performance is much faster.

Screenshots (if relevant)

Does this MR meet the acceptance criteria?

• Changelog entry added, if necessary
• Tests added for this feature/bug
• Conforms to the code review guidelines
  • Has been reviewed by a Frontend maintainer
• Conforms to the merge request performance guidelines
• Conforms to the style guides
• Conforms to the database guides
• If you have multiple commits, please combine them into a few logically organized commits by squashing them
• Internationalization required/considered
• End-to-end tests pass (package-and-qa manual pipeline job)

What are the relevant issue numbers?