Um site em que estou trabalhando exibe um grande número (> 50) de imagens SVG complexas em uma janela de rolagem. Ao visualizar o site no Chrome, o desempenho da rolagem da janela de diálogo é muito ruim - é visivelmente lento e lento. No entanto, se eu substituir as imagens SVG por PNG, a rolagem será perfeitamente suave e responsiva.

Aqui está uma demonstração da diferença:https://jsfiddle.net/NathanFriend/42knwc1s/

Por que o desempenho de rolagem SVG é muito pior do que o desempenho de rolagem PNG? Depois que o navegador renderiza uma imagem SVG, eu assumiria que ele não precisa renderizá-la novamente até que a imagem seja manipulada de alguma forma (como redimensionar). A rolagem de um elemento que contém imagens SVG faz com que as imagens sejam renderizadas novamente para cada quadro da animação de rolagem?

                                                                                          `