Microsoft Edge 16中的图像被压缩 - Edge中的小图像

Question

Microsoft Edge 16中存在一个错误（已多次报告并已在此处确认：https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7778808/。

将图像调整到30像素的高度。这是一个例子：

为什么会发生这种情况？如何解决？

Answer 1

修复

如果您使用的是Wordpress，请将其插入functions.php文件的底部：

/*
 * Work-around for Microsoft Edge bug ( https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7778808/ )
 */
function custom_edge_browser_fix() {
  global $is_edge;
  if( $is_edge ){
    add_filter('wp_calculate_image_srcset', '__return_false');
  }
}
add_action( 'init', 'custom_edge_browser_fix' );

这样做可以在Microsoft Edge浏览器中禁用（删除）此srcset - 标记。这可能会对Microsoft Edge中页面的加载时间产生轻微影响，但是使用该浏览器的人无论如何都没有灵魂......

解释

我在一家代理机构工作，我们在过去两天内从3个个人来源报告了这一情况，所以我认为它必须发生很多。

该错误（据我所知）仅在Microsoft Edge中与低带宽连接有关。正如可以在错误报告中看到的那样，它似乎不是每次加载，错误发生的连接速度较慢。所以这是一个极端的案例。

srcset是一个标记，可用于根据加载网站时视口的大小显示不同大小的图像。 Wordpress会自动生成不同大小的内容，并自动生成此标记并将其放在图像上。如果删除了标记（如上面编写的代码在Microsoft Edge中），则每次都会加载原始大小的图像，而忽略视图端口的大小。

如果您收到此错误并且您没有使用WordPress，那么您可以通过以其他方式移除srcset - 标记来绕过它...或者等待Edge 17被释放并推出。 :-)

次要添加

我必须清除服务器缓存才能使修复程序在某些页面上生效。人们也可以等待一段时间（比如一天左右）并让缓存自行过期。

Answer 2

我发现此错误也发生在Chrome上，还有其他人吗？到目前为止没有IE Edge那么多，但我在我的wordpress网站上的Chrome上遇到过它。

Answer 3

问题已在Creators Update Fall中发布的Edge版本中修复。

Answer 4

Picturefill polyfill怎么样？