我正在制作一个脚本,并且Chrome存在问题。

这就是我正在做的事情:1。将大图像加载到DIV中。 2.缩放图像以适合DIV的大小。 3.调整浏览器大小后,使用浏览器放大和缩小图像。

除Chrome之外,所有浏览器都能正常运行。

我在Chrome中查看过分析器,看不到任何异常。 这些是大图像,但在所有其他浏览器中工作得很好(甚至是实时)。

在Chrome中使用缩小图片时,我已经阅读了大量已注意到此问题的地方......但不是解决方案。

没有什么特别的,只是使用一个

var img=new Image();
$(img).load(function(){ .... {);

有谁知道可以在Chrome中使用的变通方法或解决方案? 谢谢!

===============>>#1 票数:3 已采纳

因此,在处理大型图像甚至是不大的图像时,Chrome似乎很糟糕,但只是按比例缩小。 我无休止地搜索,只是为了找到没有决议的类似问题。

仍然不确定为什么所有其他浏览器(甚至IE 7和8)都可以处理大图像(使用7mb缩小的PNG进行测试),但Chrome甚至无法设置700kb缩小的JPG而不会滞后。

所以,我正在回答这个问题:在这种情况下,Chrome很糟糕。

===============>>#2 票数:1

我有完全相同的问题,但最近解决了它。 大量的性能会占用chrome的抗锯齿功能,因为它会在您调整整个图像大小时重新计算整个图像。

所以要解决它,你只需将这一行添加到css中,如果你的图像:

#myImage
{
     image-rendering: -webkit-optimize-contrast;
}

当图像静止时,您可以通过javascript将其关闭。

有关抗锯齿的更多信息: 缩放图像时禁用抗锯齿

===============>>#3 票数:0

你是如何调整图像大小的? 使用高度/宽度或CSS变换? 后者可能会带来更好的表现。

一些信息: 提高HTML5应用程序的性能

===============>>#4 票数:0

当您在Chrome中分析图像调整大小和解码的问题时,最好使用开发人员工具时间轴,因为它可以为您提供相对准确的统计信息,确切地说需要很长时间才能解码。

缩小尺寸(或重新调整尺寸)涉及Chrome必须解码您正在发送的图像(JPEG / PNG / GIF),然后执行额外的工作以将该图像调整为您要显示的容器(div)的大小在可能的情况下,Chrome团队的建议是将图像预分频到所需的正确宽度/高度。

现在你可能想知道:嗯,肯定这个问题只是桌面Chrome吸吮,对吧? 它并不像那样明确。 特别是在浏览器较少访问强大的GPU / CPU的移动设备上,在那里执行那些调整大小操作的成本也很高。 所以简而言之:是的,有时候重新缩放大型图片在Chrome中会很慢。 尝试尽可能预定标,这些性能瓶颈应该消失。

  ask by Aaron translate from so

未解决问题?本站智能推荐: