¿Por qué el rendimiento de desplazamiento SVG es mucho peor que PNG?

Un sitio en el que estoy trabajando muestra una gran cantidad (> 50) de imágenes SVG complejas en una ventana de diálogo de desplazamiento. Al ver el sitio en Chrome, el rendimiento de desplazamiento de la ventana de diálogo es muy pobre: es notablemente lento y lento. Sin embargo, si reemplazo las imágenes SVG con imágenes PNG, el desplazamiento es perfectamente suave y receptivo.

Aquí hay una demostración de la diferencia:https://jsfiddle.net/NathanFriend/42knwc1s/

¿Por qué el rendimiento de desplazamiento SVG es mucho peor que el rendimiento de desplazamiento PNG? Después de que el navegador muestre una imagen SVG, supongo que no es necesario volver a mostrar la imagen hasta que la imagen se manipule de alguna manera (como cambiar el tamaño). ¿Desplazar un elemento que contiene imágenes SVG hace que las imágenes se vuelvan a procesar para cada cuadro de la animación de desplazamiento?

                                                                                          `