Jetpack的Photon圖片壓縮畫質不好？試試看關閉Zoom功能

日前從別的筆電看部落格時，發現圖片畫質很差，但只要關閉Jetpack的Photon畫質就會變好。

我上網查了一下，果然也有人反應¹在Jetpack的外掛頁面有兩篇文章反應：Photons messes up image quality與Photon – Quality too low，但官方表示Photon壓縮圖片的方法是採無損的演算法，所以希望對方進一步提供資訊，此後便無下文。我回家檢查了一下自己的圖片，發現畫質並沒有變差，唯獨使用那台筆電才會變差，最後發現是在某些設備檢視時，Photon會判斷需要放大、縮小圖片，所以使用了Zoom，我們只要關閉就好了。

發現的過程

一開始我就將問題鎖定在Photon，但上網都找不到解法，所以我嘗試換了佈景主題，情況仍未改善，所以我繼續找原因，接著便發現若把Photon網址後面的zoom或resize參數刪除，圖片就會便清晰，比對後發現是photon把圖片縮小後（此時畫質已經略差），又被我設定的長寬放大，所以畫質才變（非常）差。

當時的圖片都如下方一樣有兩個參數。

https://i1.wp.com/img.aquirede.net/2017/03-1098/Haikyuu_OP5_01.jpg?zoom=1.25&resize=760%2C428

zoom是用來放大縮小，因為Retina之類的螢幕需要更大張的圖。
resize雖然也是放大縮小，但他還包含了裁切。

非常奇怪的是zoom設定1.25應該要放大1.25倍吧？但他卻是縮小成0.95倍！雖然resize本身也會變糊，但本次的情形是resize維持原本尺寸，所以我判斷是zoom造成的，再加上resize在其他地方仍然很好用，就上網搜尋了一下……我們來關閉zoom吧！

解決辦法

在佈景主題的function.php檔案中加入這段語法。

wp_dequeue_script( 'devicepx' );


如果是子佈景主題（Child Theme）的話，就是在子佈景主題的function.php中加上這段語法。

function remove_devicepx() {
    wp_dequeue_script( 'devicepx' );
}
add_action( 'wp_enqueue_scripts', 'remove_devicepx' );

這樣Jetpack就不會在圖片後面加上zoom的參數啦！

Retina什麼的就之後再說吧。