我目前正在一个作品集网站上工作，我必须在同一页面上加载大量照片。
这些图像是通过PHP动态加载的，目前我选择事先保存这些图像的缩略图版本并加载这些图像。
然而，我担心的是，如果网站有大量用户，这可能不是最佳解决方案：我基本上会让每张图片的重复项乘以用户上传的图像数量。
我的问题是这个问题是否有更好的解决方案？一种在不影响太多空间的情况下尽可能快地加载页面的方法？
谢谢吨。
加载充满大量图像的网页会很慢。原因是传输这些图像所需的带宽。
您有几个选择
-
在平铺模式下加载完整图像。这些图像将是完整的图像，只是调整大小以适应"缩略图"视图。这样做的好处是，您只保存 1 张图像，但该图像是全尺寸的，并且需要很长时间才能加载。
-
按照您所说的方式加载缩略图。这样做的好处是性能，但您需要存储每个图像的两个副本。此外，根据您如何处理缩略图创建，您可能需要用户上传图像的两个副本以提供他们自己的缩略图......这可能会发臭。
-
加载缩略图，但在上传时动态生成它们。您实际上是在磁盘上保留映像的两个副本，但是您是通过某些php映像修改API动态创建的。这将加载得更快，但仍会占用磁盘空间。它还最大限度地减少了提供缩略图的用户/管理要求。
-
根据请求页面按需加载缩略图。这种方法需要一些测试，因为我从未尝试过。基本上，您将调用php图像修改API（或者更好的是外包给本机解决方案！）来创建要使用的一次性（或缓存）缩略图。你可能会说"天哪，这需要这么长时间！我认为如果您应用适当的缓存机制，这种方法实际上可能是可用的，这样您就不会不断重新创建相同的缩略图。它会降低带宽，并且由于这里的限制因素是网络连接，它可能比仅发送完整图像更快（因为创建缩略图的限制因素现在是CPU/内存/硬盘）。
我认为#4是一个有趣的概念，可能值得探索。
我认为是：
一个。利用缓存（系统缓存，缓存在标头中，HTTP缓存..所有缓存）
B. 不要一直生成拇指
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();
}
考虑使用所有图像的精灵或拼贴，以便只加载一个较大的图像，从而节省带宽并减少页面加载时间。
此外，正如已经建议的那样，分页和异步加载可以对其进行一些改进。
引用：
- http://css-tricks.com/css-sprites/
- http://en.wikipedia.org/wiki/Sprite_（computer_graphics）#Sprites_by_CSS
是的，缓存缩略图是个好主意，如果做得好，效果会很好。这种东西是水平缩放的好地方。
- 您应该考虑使用CDN。（或可能实现类似的东西。缓存系统将生成常见要求大小的图像，并在以下情况下对其进行修饰它们在以后很少被请求。
- 您还可以水平扩展并将此服务移植到另一台服务器或网络或云中的虚拟服务器。
这是一个磁盘密集型和带宽密集型的东西，映像交付。没有视频那么糟糕！
- 即时生成大图像的缩略图。（一些提示）
- 异步加载图像（尝试 JAIL）
- 标页数
- 缓存也是一种选择，从第二次加载站点时开始工作。