SVG图像精灵作为背景图像在Chrome浏览器崩溃崩溃53

使用svg图像精灵作为背景图像时出现问题。一切正常工作在100％缩放，但当我放大或缩小背景图像崩溃。也请注意，当边界半径属性设置它并不仅是工作，它适用于Chrome版本52，但不是最新的53 我创建了一个演示：https://jsfiddle.net/t3m9gpeL SVG图像精灵作为背景图像在Chrome浏览器崩溃崩溃53

.icon { 
    display: inline-block; 
    width: 32px; 
    height: 32px; 
    background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/fragment-ready-2.svg") no-repeat; 
} 
.icon-clock { 
    background-size: 32px 96px; 
    background-position: 0 0; 
} 
.icon-heart { 
    background-size: 32px 96px; 
    background-position: 0 -32px; 
} 
.icon-arrow-right { 
    background-size: 32px 96px; 
    background-position: 0 -64px; 
} 
.block-with-border .icon { 
    border: 1px solid red; 
} 
.block-with-border-radius .icon { 
    border-radius: 5px; 
} 
.block-with-border-and-border-radius .icon { 
    border-radius: 5px; 
    border: 1px solid red; 
}

1）它是Chrome 53的错误？ 2）如何避免这种行为？

来源

2016-10-04 Romick