在变换上舍入CSS子像素

所以,之前出现过这个问题,比如:翻译+ Canvas =模糊文本 ,这里:CSS翻译后是否可以"捕捉到像素"？

似乎没有任何关于这些链接的结论 - 或者我读过的任何其他文章.一些响应者并不认为这很重要,所以这就是为什么在我的情况下它是:Chrome 41.0.2272.104中的屏幕截图

Safari 8.0.4中的屏幕截图(10600.4.10.7)

在Safari中查看详细信息？(看看航天飞机图像中的结构,或第3幅图像中岩石的细节)

这些家伙的CSS是

width: 100%;
height: auto;
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);

因此,在某些情况下 - translateY将以半像素结束.左边的第一个图像最终得到一个变换矩阵,如下所示:

-webkit-transform: matrix(1, 0, 0, 1, 0, -56.5);

目前,Chrome似乎很好地呈现了这一点(我看到一些人说不同的浏览器在不同的版本中创建了这个问题),但目前Safari正在解决这个问题.所以,我修复这个问题的假设是确保只有整个像素,我已经通过数学运算并在Javascript中应用变换来完成,但是当在大量图像上运行时,这会花费更多的性能时间.

我尝试了一些像CSS一样的黑客攻击,比如使用scale3d但没有成功.如果有人有任何JS免费解决方案,我将非常感谢共享的知识.