In my React app:
I have a side scrolling slider of React components that contain images. The user can scroll to the left and right using the standard
// this contains many (20+) components similar to this:
<img class="contentImage" />
<img class="authorImage" />
I have found the solution in this question: Can I do anything about "repaints on scroll" warning in Chrome for "overflow:scroll" div
I needed to search for "repaint" rather than "re-render".
The solution to allow more fluid scrolling, is to give the .slider div the following css property: