谷歌驅動器帶來的圖像使頁面加載非常慢

Question

我有一個網頁，其中包含一些使用php代碼從Google驅動器下載的圖像：

 $albumURL = $url."host/".$fila['album']."/"; @$doc->loadHTMLFile($albumURL); $xpath = new DOMXPath($doc); $anchors = $xpath->query('//a'); $ref=""; foreach($anchors as $element) { $ref = $element->getAttribute("href"); } $first = true; foreach($anchors as $element) { $src = $element->getAttribute("href"); if($src != "http://drive.google.com"){ if($primero){ $first = false; echo '<div class="item active"><img src='.$url.$element->getAttribute("href").'></div>'."\\n"; } echo '<div class="item"><img src='.$url.$src.'></div>'."\\n"; } 

問題是，當我嘗試加載頁面時，它的運行速度非常慢，我猜這是因為我請求的圖像數量大。 這是我頁面的鏈接： http : //arreglosnavidad.host22.com/arreglos.php

我不知道是否可以通過使用php或html / css壓縮這些圖像。

當然，由於CRUD管理，如果我不必將那些圖像上傳到服務器中會更好（並保持它們為最新）。

Answer 1

一些選擇

1. 使用CSS Sprites。 您可以將所有幾張圖像合並為一個大圖像，並在div中使用相對位置以僅顯示合並圖像的一部分或子圖像，而不是加載發送大量圖像的GET請求，從而增加客戶端到服務器的通信量。

檢查此鏈接此技巧

https://css-tricks.com/css-sprites/

2. 減小實際圖像的大小，並在html文檔中設置圖像標簽的寬度和高度，以便在加載圖像時它會拉伸（這會影響圖像的質量）