Question

我正在为一个学校团体建立一个网站，该网站将有很多关于其活动的图片。我正在使用灯箱，所以图片将以幻灯片形式显示，我更改了图片的尺寸，因此幻灯片中的“当前”图片没有原始图片那么大。我仍然发现打开图片或转到下一张图片有大约5秒的延迟。我想知道是否有办法实现更快的加载时间，甚至是我没有考虑的另一种方法。

我正在为我的网站使用xhtml，css和php。

Answer 1

很抱歉回答，但我现在不能发表评论......

我正在做其他方式，上传后，我重新采样图片到大图和缩略图。

当然，你可以每次重新采样图片，但这是合理的原因，为什么你必须等待这么久，如果你在一个时刻有很多访问者，那么服务器的工作量很大。

所以对我来说最好的方式是说，那个大图像最大为640x480，然后在上传到这个尺寸后保存图片，当然按相同的比例重新采样。

编辑：在您的帖子中，我无法知道您是否通过设置高度和宽度或使用PHP以及在多长时间内以HTML格式调整图像大小和重新采样的位置。

Answer 2

假设您在服务器上有一张图片，其大小为8000x6000。它的大小可能是10 MB。

现在假设您要在网页中显示此图像，并按照以下方式执行此操作：

<img src="largeImage.jpg" width="800" height="600"/>

浏览器将下载大图像（10 MB），这需要花费大量时间，然后将其大小调整为内存中的800x600以将其显示在网页上（这会消耗内存和CPU时间）。总时间：25秒。

现在假设您将此图像的大小调整为800x600并将此调整大小的图像放在服务器上。然后使用

显示图像

<img src="smallImage.jpg" width="800" height="600"/>

小图片看起来与访问您网页的用户完全相同，但浏览器只需下载一张小图片，大小为100 KB（比大图片少100倍）。下载图像所需的时间也将除以100（0.25秒），浏览器不必加载和调整内存中的大图像（内存更少，CPU时间更短）。您的图像几乎可以立即显示。

有许多工具（我自己使用Irfanview）可以拍摄大量图像并立即调整大小。你应该这样做。