[developer1]

Courtesy of https://fourword.fourkitchens.com/article/fix-scrolling-perf... , remove the fixed background and instead place it in its own layer with will-chance: transform.

  .wrapper::before {
    content: ' ';
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: url('data:image/png;base64,...');
    will-change: transform;
  }

Tested with Chrome dev tools, the repaint troubles disappear. Unfortunately only supported in Chrome, Firefox, and Opera. But just checked, and at least in Chrome the performance problem goes away with this solution even with the will-change removed. YMMV