狠狠色丁香婷婷综合尤物/久久精品综合一区二区三区/中国有色金属学报/国产日韩欧美在线观看 - 国产一区二区三区四区五区tv

前情

WebP是一種同時提供了有損壓縮與無損壓縮（可逆壓縮）的圖片文件格式，最初在2010年發(fā)布，目標(biāo)是減少文件大小，相較于傳統(tǒng)的 PNG、JPG，甚至是動圖 GIF 的格式，WebP 比它們的空間更小。根據(jù)谷歌的測試，WebP 格式的圖片可以比 JPEG 格式的圖片小 26%-34%，比 PNG 格式的圖片小 25%-34%，所以在最近的小程序項目中，我嘗試引入WebP格式圖片以來減小包體積。

坑位

一開始我負責(zé)的小程序是發(fā)布在抖音端和快手端，在抖音端使用WebP是沒啥問題的，一切都挺順利，但是直到在快手端自測時候發(fā)現(xiàn)，在iOS上部分有帶透明的圖片會顯示異常。

我還給官方提了BUG：webp小圖標(biāo)顯示異常，官方回復(fù)說是已經(jīng)解決，雖然回復(fù)已經(jīng)解決，但發(fā)版更新是需要時間的，后面不得不快速過了小程序的相關(guān)頁面，把顯示異常的小圖標(biāo)都換成了PNG格式圖片，想到等后續(xù)穩(wěn)定了再用回WebP吧。

最近公司項目又有變化，公司希望小程序有發(fā)布微信端，項目也落在了我名下，于是我又踩到了另一深坑，我一直以為在所有小程序端中微信是鼻祖，應(yīng)該是最穩(wěn)定的了，我一開始也是這么認(rèn)為的，因為在開發(fā)者工具上并沒有發(fā)現(xiàn)有什么大的問題，直到我在真機上測試，大顛眼睛，頁面上到處是空白，一開始懷疑是布局出現(xiàn)兼容問題，直到定位代碼才發(fā)現(xiàn)，全部是webp格式圖片不支持，于是查看了微信的文擋，文擋是寫得好好的，翻到最下面，說需要添加webp=“true”才可以，而且只支持網(wǎng)絡(luò)圖片，真的是腦袋發(fā)脹，心里惡狠狠的罵了回自己，給自己找事用什么WebP嘍。

Why?

快手的問題就是平臺的BUG，微信就是平臺的限制，對于這些問題，我們開發(fā)者只能提BUG等待官方修復(fù)，但這一段修復(fù)的時間你不得不想辦法繞開，但是微信小程序這個完全就是平臺的限制了，你無能為力。

解決方案

方案1：使用網(wǎng)絡(luò)WebP格式圖片

個人親測使用網(wǎng)絡(luò)WebP格式圖片確實是可以的，但是微信文擋又在瞎說，如果你用網(wǎng)絡(luò)WebP格式圖片的話，webp=”true”有沒有都不影響圖片的展示的，但是再微信小程序論壇搜搜，你又會發(fā)現(xiàn)WebP圖片顯示問題還挺多的，而且全換成網(wǎng)絡(luò)圖片工作量不會小，同時也會增加公司的CDN流量費用。

方案2：全部圖片換成PNG

在一次次被惡心過后我最終還是決定所有WebP格式圖片全部換回PNG圖片，在替換過程中我發(fā)現(xiàn)如果你用PNG圖片再通過 tinypng壓縮后你的PNG圖片也并不一定會比WebP格式圖片小，我隨便選了幾張?zhí)鎿Q的圖片做了下大小對比。

我在做圖片替換的時候并不是重切所有圖片，重切的話主要是找尋源圖會點麻煩，我的做法是所有圖片通過FreeConvert工具轉(zhuǎn)PNG，再通過TinyNG做圖片壓縮以保證圖片大小適當(dāng)。

總結(jié)

此文并不是web項目，按目前情況，web項目是可以放心使用WebP的， WebP確實能在一定程序上減小項目資源大小，小程序項目還是推薦用PNG+tinypng壓縮的方式使用吧，即保證圖片體積適當(dāng)，又避免踩到奇奇怪怪的問題。

• 抖音小程序可以放心使用WebP格式圖片

• 如果你的小程序要發(fā)布快手端，推薦你先嘗試嘗試幾個透明圖片看看官方修復(fù)情況

• 微信小程序你想使用WebP的話，你得使用網(wǎng)絡(luò)圖片

轉(zhuǎn)自https://www.cnblogs.com/xwwin/p/18611076