我想我的應用程序（一個靜態網站）使用服務工作者離線運行。如果不緩存來自srcset屬性的所有圖像，我看不到這樣做的方法。我可以看到client hints將如何解決問題，但除此之外，有沒有一種解決方案可以在不涉及服務器的情況下執行任何操作而只是爲請求的文件提供服務？如何使用Service Worker和srcset創建離線應用程序？
我可以看到也許是服務人員如何能夠計算圖像請求中給出的img標記和圖像的命名約定的信息...
有沒有人解決這個問題，或者它認爲在所有？
對於完整的srcset功能，你將不得不緩存所有的分辨率。儘管屏幕密度似乎是設備的固定屬性，但它實際上是動態的，例如，智能手機可以投射/播放電視屏幕。在瀏覽器窗口四處移動時，在具有多個顯示器的桌面（例如帶有外部顯示器的Retina MacBook）屏幕分辨率可能會發生變化。所有這些更改都可能會在您完成緩存後很長時間纔會發生，因此您無法確定將選取哪些分辨率。
一個簡單的解決方案是總是使用2x圖像的一切。較高的DPI使圖像失真不那麼明顯，因此您可以使用compress them more heavily來抵消較高分辨率的成本。
另一種解決方案是在圖像上捕獲加載錯誤，並用您知道緩存的圖像URL替換srcset。順便說一句：您可能需要在標記中添加onerror="…"，因爲錯誤可能會在任何其他腳本有機會在頁面上運行之前觸發，或者在以編程方式添加錯誤處理程序之前檢查所有圖像元素以檢測錯誤事件img.complete && !img.naturalWidth。