我目前正在一个投资组合网站上工作，我必须在同一页面上加载大量照片。
这些图像是通过 PHP 动态加载的，目前我选择预先保存这些图像的缩略图版本并加载它们。
然而，我担心的是，如果网站有大量用户，这可能不是最佳解决方案：我基本上会将每张图片的副本乘以用户上传的图片数量。
我的问题是这个问题是否有更好的解决方案？一种在不占用太多空间的情况下尽可能快地加载页面的方法？
万分感谢。
问问题
690 次
5 回答
2
加载一个包含大量图像的网页会很慢。原因是传输这些图像所需的带宽。
你有几个选择
以平铺模式加载完整图像。这些图像将是完整的图像，只是调整大小以适应“缩略图”视图。这样做的好处是您只保存了 1 张图像，但该图像是全尺寸的，并且需要很长时间才能加载。
按照您所说的加载缩略图。这样做的好处是性能，但您需要存储每个图像的两个副本。此外，根据您处理缩略图创建的方式，您可能需要用户上传图像的两个副本以提供他们自己的缩略图......这可能会很糟糕。
加载缩略图，但在上传时动态生成它们。您实际上是在磁盘上保留了两个图像副本，但您是通过一些 php 图像修改 API 动态创建它。这将加载更快，但仍会占用磁盘空间。它还最大限度地减少了提供缩略图的用户/管理要求。
在请求页面时按需加载缩略图。这种方法需要一些测试，因为我从未尝试过。基本上，您将调用 php 图像修改 API（或者更好地外包到本机解决方案！）来创建一次性使用（或缓存）的缩略图以供使用。你可能会说“天啊，那会花很长时间！”。我认为如果您应用适当的缓存机制，这种方法实际上可能是可用的，这样您就不会不断地重新创建相同的缩略图。它将降低带宽，并且由于这里的限制因素是网络连接，因此它可能比仅发送完整图像更快（因为创建缩略图的限制因素现在是 CPU/内存/硬盘）。
我认为#4 是一个有趣的概念，可能值得探索。
于 2012-04-26T20:37:20.767 回答
1
我的想法是：
A. 利用缓存（系统缓存，头中缓存，HTTP缓存..所有缓存）
B. 不要一直生成 Thumb
C. 使用作业排队系统（例如Gearman或beanstalkd来生成拇指，这样您就不必立即进行操作）
D. 使用Imagick更有效
E. 分页
F. 示例仅在原始文件已修改时生成拇指
$file = "a.jpg" ;
$thumbFile = "a.thumb.jpg" ;
$createThumb = true;
if(is_file($thumbFile))
{
if((filemtime($file) - 10) < filemtime($thumbFile));
{
$createThumb = false;
}
}
if($createThumb === true)
{
$thumb = new Imagick();
$thumb->readImage($file);
$thumb->thumbnailImage(50, null);
$thumb->writeImage($thumbFile);
$thumb->destroy();
}
于 2012-04-26T20:31:45.507 回答
1
考虑使用所有图像的精灵或拼贴，以便只加载一个较大的图像，从而节省带宽并减少页面加载时间。
此外，正如已经建议的那样，分页和异步加载可以对其进行一些改进。
参考：
于 2012-04-26T20:33:33.883 回答