为什么 Chrome 在页面加载完成后加载我的页面图像？
Why does Chrome load an image of my page after the page has finished loading?
这真是一件奇怪的事情，即使只是输入标题也会让我怀疑自己的理智。不管怎样，我想弄清楚为什么我的报告需要这么长时间才能加载，我发现 Chrome 在页面加载完成后正在加载我的页面图像。但是不要相信我的话，请查看来自开发工具的屏幕截图。
您可以看到有两个 report.test.php 实例正在加载。第一个是文档，第二个是 img。 （您可以通过图标和过滤这两种类型的列表来判断）。
所以在这个例子中，报表很小，加载了大约 15 行数据，并在 HTML table 中呈现它们。这是在 710 毫秒后完成的（在此示例中），除了浏览器选项卡中的图标在 img 加载时继续旋转 808 毫秒外，一切看起来都不错。对于像这样的小报告来说没什么大不了的，但是如果你加载更多的数据，例如需要 6 秒才能加载，那么第二张图像也需要额外的 6 秒才能加载，总共 12 秒，这是大不了。
现在正如我所说，当文档加载完成时，我可以看到 HTML 已经完成渲染，所以我基本上可以使用报告并忽略旋转的图标，但是如果我尝试这样做会导致问题在另一个选项卡中加载另一个报告，同时该图标仍在旋转。它被卡住了，基本上让一切都停止了，这一切都很糟糕。总之，我需要阻止这种情况发生。
那么我报告的这个 img 版本是什么？为什么它在那里，我可以阻止它吗？
原来 chrome 正在生成自己的图像，因为我告诉它在我的 body 风格中使用空白背景图像。
背景
我已将 background:url('') 添加到报告页面的 body 标签。
<body style="background:url('')">
我这样做是因为我当时使用的样式sheet 添加了背景图片，我希望我的应用程序中的所有其他页面都需要它，但报告页面不需要，所以这是我的覆盖方式样式 sheet.
解决方案
无论如何，显然当你提交一个空白字符串作为背景图片时 chrome 然后生成它自己的图像，它通过制作整个页面的图像来实现，并且更多 HTML生成此图像所需的时间越长。
解决方案是不要将空字符串传递给 background:url。
这真是一件奇怪的事情，即使只是输入标题也会让我怀疑自己的理智。不管怎样，我想弄清楚为什么我的报告需要这么长时间才能加载，我发现 Chrome 在页面加载完成后正在加载我的页面图像。但是不要相信我的话，请查看来自开发工具的屏幕截图。
您可以看到有两个 report.test.php 实例正在加载。第一个是文档，第二个是 img。 （您可以通过图标和过滤这两种类型的列表来判断）。
所以在这个例子中，报表很小，加载了大约 15 行数据，并在 HTML table 中呈现它们。这是在 710 毫秒后完成的（在此示例中），除了浏览器选项卡中的图标在 img 加载时继续旋转 808 毫秒外，一切看起来都不错。对于像这样的小报告来说没什么大不了的，但是如果你加载更多的数据，例如需要 6 秒才能加载，那么第二张图像也需要额外的 6 秒才能加载，总共 12 秒，这是大不了。
现在正如我所说，当文档加载完成时，我可以看到 HTML 已经完成渲染，所以我基本上可以使用报告并忽略旋转的图标，但是如果我尝试这样做会导致问题在另一个选项卡中加载另一个报告，同时该图标仍在旋转。它被卡住了，基本上让一切都停止了，这一切都很糟糕。总之，我需要阻止这种情况发生。
那么我报告的这个 img 版本是什么？为什么它在那里，我可以阻止它吗？
原来 chrome 正在生成自己的图像，因为我告诉它在我的 body 风格中使用空白背景图像。
背景
我已将 background:url('') 添加到报告页面的 body 标签。
<body style="background:url('')">
我这样做是因为我当时使用的样式sheet 添加了背景图片，我希望我的应用程序中的所有其他页面都需要它，但报告页面不需要，所以这是我的覆盖方式样式 sheet.
解决方案
无论如何，显然当你提交一个空白字符串作为背景图片时 chrome 然后生成它自己的图像，它通过制作整个页面的图像来实现，并且更多 HTML生成此图像所需的时间越长。
解决方案是不要将空字符串传递给 background:url。