文件Commerce實施行動手冊

目錄影像調整大小最佳實務

Last update: Mon Aug 28 2023 00:00:00 GMT+0000 (Coordinated Universal Time)

建立對象：

  • Experienced
  • Developer

在商店投入生產之前，應調整所有目錄影像的大小。 無法在生產前調整影像大小，而會在頁面載入期間強制調整影像大小，這會大幅降低網站速度，並增加伺服器在啟動後第一天到幾週的負載。

慢速方式

使用預設的CLI指令來調整所有影像的大小：

bin/magento catalog:images:resize

此方法的缺點包括：

  • 該程式是單執行緒
  • 此程式會重新調整已調整大小的影像大小
  • 此程式無法中斷，可能需要數天的時間

快速方式

Adobe Commerce 2.4已匯入非同步影像調整大小，且可更快調整影像大小。

  1. 在每部網頁伺服器上，暫時啟動一些額外的佇列處理常式（每部伺服器實體處理器數目的兩倍）：

    code language-bsh 
    for i in {1.."$((2 * `nproc --all`))"};do bin/magento queue:consumers:start media.storage.catalog.image.resize &;done;

  2. 確認佇列處理常式正在執行：

    code language-bash 
    pgrep -fl media.storage.catalog.image.resize

  3. 以所有影像大小調整要求填滿佇列：

    code language-bash 
    bin/magento catalog:images:resize --async

  4. 調整所有影像大小之後，請終止程式：

    code language-bash 
    pkill -f media.storage.catalog.image.resize

快速方式

還有另一種方式可以使用前端來調整影像大小。

此方法的優點包括：

  • 此程式為多執行緒
  • 程式是多伺服器(如果您有多個Web節點、負載平衡器以及共用磁碟空間 media/ directory)
  • 此程式會略過已調整大小的影像

此方法可在8小時內重新調整100,000個影像的大小，而CLI命令需要6天才能完成。

  1. 登入伺服器。
  2. 瀏覽至 pub/media/catalog/product 並記下其中一個雜湊(例如，0047d83143a5a3a4683afdf1116df680)。
  3. 在下列範例中，取代 www.example.com 使用您商店的網域，並將雜湊取代為您注意到的雜湊。
sed
code language-bash 
cd pub/
find ./media/catalog/product -path ./media/catalog/product/cache -prune -o -type f -print | sed 's~./media/catalog/product/~https://www.example.com/media/catalog/product/cache/0047d83143a5a3a4683afdf1116df680/~g' > images.txt
圍城

的缺點 siege 如果並行設為10，則會在10次中造訪所有URL。

code language-bash 
siege --file=./images.txt --user-agent="image-resizer" --no-follow --no-parser --concurrent=10 --reps=once
curl
code language-bash 
xargs -0 -n 1 -P 10 curl -X HEAD -s -w "%{http_code} %{time_starttransfer} %{url_effective}\n" < <(tr \\n \\0 <images.txt)

此 -P 引數決定執行緒的數量。

bash one-liner

的單一內嵌版 find/curl 例如，如果您可以 curl 從相同的機器取得影像：

code language-bash 
find ./media/catalog/product -path ./media/catalog/product/cache -prune -o -type f -print | sed 's~./media/catalog/product/~https://www.example.com/media/catalog/product/cache/0047d83143a5a3a4683afdf1116df680/~g' | xargs -n 1 -P 10 curl -X HEAD -s -w "%{http_code} %{time_starttransfer} %{url_effective}\n"

再次，取代 www.example.com 使用您網站的網域並設定 -P 至您的伺服器可以處理而不會當機的執行緒數目。

輸出會傳回存放區中所有產品影像的清單。 您可以編目影像(使用 siege 或其他任何爬行者程式)，使用所有可用的伺服器和處理器核心，並以比其他方法快得多的速度產生調整大小快取。

造訪一個影像快取URL會在背景產生所有影像大小（如果尚未存在）。 此外，它會略過已調整大小的檔案。

NOTE
  • 雲端基礎結構專案上的Adobe Commerce可將產品影像調整大小解除安裝到Fastly服務。 另請參閱 深度影像最佳化 在 雲端指南.
  • 如果您使用遠端儲存模組，也可以嘗試將影像大小調整解除安裝到nginx。 另請參閱 設定遠端儲存裝置的影像大小調整 在 設定指南.
recommendation-more-help
754cbbf3-3a3c-4af3-b6ce-9d34390f3a60