Improve target selector performance in Rapid Diffs

What does this MR do and why?

This MR improves target selector performance in Rapid Diffs.

It also:

  1. Fixes wrong border colors inside the target parallel cell
  2. Fixes missing border for the meta line
  3. Renames nubmer typo to number

Screenshots or screen recordings

Before After
image image

How to set up and validate locally

  1. Enable rapid_diffs and rapid_diffs_on_mr_show feature flags

  2. Go to any large merge request (more than 50 files/1000 lines changed)

  3. Select 'Changes' tab

  4. Add ?rapid_diffs=true to the URL, follow it

  5. Measure selector performance in DevTools while selecting text for 5 seconds

    image

  6. Observe improved selector performance

Edited by Stanislav Lashmanov

Merge request reports

Loading