Php 服务器端映像大小调整性能

我已经注意到越来越多的大型网站（Google、Facebook、Youtube和co）正在调整图像大小，使其“接近”客户端所需的测量值，我想知道这是人们思维方式的转变还是他们的懒惰

以一个场景为例，为一组产品（电子商务）的特定尺寸的标准图像集添加一个新的图像大小，这些产品的数量可以达到上千甚至上百万

想象一下，我有一个300x350或其他的原始图像副本，在客户端，将其调整为200x250。我对每种产品都这样做，一页20种产品

服务器端适应这种新规模的工作和问题真的值得客户端受益吗

如果不是，那么什么是判断何时应该预处理特定尺寸的好方法

如果是，是否曾经有过服务器端处理和缓存过度的情况（即容纳8个110x220、120x230、150x190等图像）？

考虑以下几点： 图像大小调整对于服务器来说是一个繁重的过程。首先，它本身代价高昂。其次是硬盘IO操作非常慢。因此，这完全取决于服务器的负载情况

对于客户而言，it的重要性有两个方面：

1） 缩略图文件较小，因此下载速度更快。因此，它们将以更快的速度出现。但这一切都取决于互联网连接的速度，而互联网连接的速度正日益提高。你看到有多大的图像被加载了吗？它们不会一次显示为一个整体，而是通过“线”显示

2） 如果您尝试以小尺寸显示大图像，质量会低得多。这是因为浏览器如何处理它。他们没有Photoshop的功能，无法进行适当的质量调整

3） 单个页面上的许多大型图像将增加该页面的内存使用量。在一些功能不太强大的计算机上，滚动打开时可能会出现可怕的延迟

作为这个问题的解决方案，我更倾向于做我在Drupal模块中看到的事情（

imagecache

，如果我是对的）

它不会在图像上载时创建缩略图。相反，它使用.htaccess和mod_重写功能在请求时创建它们。它检查请求的文件是否不存在，如果不存在，它会将请求重定向到小而轻的PHP脚本，该脚本将创建缩略图，将其写入文件系统，然后输出到客户端

因此，下一个访问者将已经获得先前创建的缩略图

---

因此，您可以实现延迟/延迟图像大小调整，这将使加载更加平滑（在时间上拉伸）。

我决定首先在页面上的单个图像上测试这一点，并进行乘法运算以预测多个图像。我要指出：

• 我用PNG做这个测试，但是PNG看起来很标准
• 我使用了一个特殊的函数，它可以调整图像的大小，使

  宽度和
  高度始终符合我调整大小的图像的原始纵横比

我得到了一张450x450（大致）的图像，并决定在客户端将其向下调整到200x200（这个答案中的所有测量值都是像素）。我发现，尽管调整大小超过了图像总大小的一半，但几乎没有CPU跳变

所有现代浏览器的质量都很好，Chrome、Opera、Firefox和IE都显示了清晰的图像，就像是在Photoshop或GD中完成的一样

在IE7上，我没有注意到太多的CPU跳转，而且质量很好，前提是我使用了基于图像大小限制的百分位数调整

总的来说，即使是这样大小的缓存服务器端，也需要额外的存储、计算和编码，这似乎对用户端的电源不利

这就是说，如果我开始做这种调整的倍数（比如20倍，就像我的问题中那样），我可能会遇到问题

经过一些调整后，我发现任何小于原始图像大小1/3的图像，只要图像的宽度或高度低于1000px，似乎都会对CPU和一般计算机性能产生负面影响

通过使用添加的功能，我从调整客户端的大小中获得了与服务器端相同的质量。我（针对相关方）使用的具体功能是：

因此，从我自己的测试来看，似乎可以容纳您将要使用的每幅图像的每一个大小，如我在问题中所问的：

如果是，是否曾经有过服务器端处理和缓存过度的情况（即容纳8个110x220、120x230、150x190等图像）

在现代计算中，这似乎有些过分，如果你打算使用许多不同大小的图像，你应该进行仔细的测量

然而，我发现，如果你有一套标准的大小，而且它们很小，那么优点实际上是服务器端调整大小和存储所有大小，因为强制客户端调整大小总是会使他们的计算机速度降低一点，但如果将其缩放到原始大小的1/3以下，似乎不会产生太大的差异

---

所以我相信，像FB、Google和Youtube这样的网站之所以不太担心存储所有图像的精确测量值，是因为“接近测量值”总体而言，缩放性能更高。

1）尺寸相差100px，因此可以将下载大小计算为10kb，以获得完全优化的png。2） 这个调整大小是100px，而且服务器端使用的是gdlibrary而不是photoshop，再加上photoshop给文件添加了大量的膨胀，导致了巨大的下载需求。我的意思是我不能用photoshop处理所有20万张产品图片。3） 不过我不介意知道内存使用的细节。@Sammaye同样，当我在电子商务公司工作时，我们使用Javascript，它会推迟图像的加载，直到它们真正显示出来。所以，如果图像不在屏幕上（您需要滚动d）

function pseudoResize($maxWidth = 0, $maxHeight = 0){

$width = $this->org_width;
$height = $this->org_height;

$maxWidth = intval($maxWidth);
$maxHeight = intval($maxHeight);

$newWidth = $width;
$newHeight = $height;

// Ripped from the phpthumb library in GdThumb.php under the resize() function
if ($maxWidth > 0)
{
    $newWidthPercentage = (100 * $maxWidth) / $width;
    $newHeight          = ($height * $newWidthPercentage) / 100;

    $newWidth = intval($maxWidth);
    $newHeight = intval($newHeight);

    if ($maxHeight > 0 && $newHeight > $maxHeight)
    {
        $newHeightPercentage    = (100 * $maxHeight) / $newHeight;

        $newWidth = intval(($newWidth * $newHeightPercentage) / 100);
        $newHeight = ceil($maxHeight);
    }
}

if ($maxHeight > 0)
{
    $newHeightPercentage    = (100 * $maxHeight) / $height;
    $newWidth               = ($width * $newHeightPercentage) / 100;

    $newWidth = ceil($newWidth);
    $newHeight = ceil($maxHeight);

    if ($maxWidth > 0 && $newWidth > $maxWidth)
    {
        $newWidthPercentage = (100 * $maxWidth) / $newWidth;

        $newHeight = intval(($newHeight * $newWidthPercentage) / 100);
        $newWidth = intval($maxWidth);
    }
}

return array(
    'width' => $newWidth,
    'height' => $newHeight
);
}