一款超實(shí)用的圖像處理 JavaScript 庫(kù) —— Sharp.js。Sharp.js 比 Jimp.js 更快，底層使用了libvips庫(kù)，是一個(gè)高性能的圖像處理庫(kù)，專為快速處理大量圖像數(shù)據(jù)而設(shè)計(jì)。

https://github.com/lovell/sharp

Sharp.js 圖像處理界的“瘦身專家”

首先，讓我們來(lái)認(rèn)識(shí)一下Sharp.js。這貨不僅僅是一個(gè)簡(jiǎn)單的圖片處理庫(kù)，它是一個(gè)高性能的Node.js模塊，專門用來(lái)把那些“大腹便便”的圖片文件，轉(zhuǎn)換成“苗條”的Web友好格式，比如 JPEG、PNG、WebP、GIF和AVIF。聽起來(lái)是不是很酷？

下面是演示 Sharp.js 壓縮的示例。

const sharp = require('sharp');

// 原始圖片路徑
const inputPath = './images/image.png';
// 壓縮后圖片的輸出路徑
const outputPath = './output/image_compressed.jpg';

// 設(shè)置壓縮選項(xiàng)，這里我們使用mozjpeg的優(yōu)化功能
const options = {
  compression: 75 // 設(shè)置JPEG的壓縮質(zhì)量，范圍從0到100
};

// 使用sharp處理圖片
sharp(inputPath)
  .resize(null, null, { // 調(diào)整圖片大小，這里不改變?cè)汲叽?/span>
    withoutEnlargement: true
  })
  .toFormat('jpeg', options) // 轉(zhuǎn)換為JPEG格式，并應(yīng)用壓縮選項(xiàng)
  .toFile(outputPath, (err, info) => {
    if (err) {
      console.error(err);
    } else {
      console.log(`圖片壓縮成功，保存為: ${outputPath}`);
    }
  });

壓縮效果原圖 1.89M，壓縮后 148K，壓縮率高達(dá) 93%。關(guān)鍵壓縮后看不出來(lái)圖片質(zhì)量損耗。

Sharp.js 的速度與激情：快到讓你起飛

Sharp.js 之所以這么牛，是因?yàn)樗澈笥幸粋€(gè)強(qiáng)大的“大腦”——libvips ^[1]圖像處理庫(kù)。這個(gè)庫(kù)的速度之快，簡(jiǎn)直讓人驚嘆。它處理圖片的速度，比使用 ImageMagick 和 GraphicsMagick 的最快設(shè)置還要快4到5倍！這就好比是開著一輛超級(jí)跑車在高速公路上飆車，那種快感，你懂的。

而且，Sharp.js 在處理圖片時(shí)，只占用一小部分內(nèi)存，同時(shí)還能充分利用多核 CPU 和各級(jí)緩存。這意味著什么？意味著它不僅快，而且還不會(huì)讓你的電腦因?yàn)樘幚韴D片而過(guò)熱！

格式支持：Sharp.js 的多功能廚房

Sharp.js 支持的圖片格式非常全面，包括JPEG、PNG、WebP、GIF、AVIF、TIFF和SVG。輸出格式也同樣豐富，除了上述格式，還能輸出未壓縮的原始像素?cái)?shù)據(jù)。這就像是走進(jìn)了一個(gè)裝備齊全的廚房，無(wú)論你想做什么菜，這里都有你需要的工具和材料。

色彩、透明度、ICC：Sharp.js 樣樣精通

別以為 Sharp.js 只是速度快，它在處理圖片的色彩空間、嵌入的 ICC 配置文件和透明度通道上也是一把好手。它使用 Lanczos 重采樣算法，確保在追求速度的同時(shí)，圖片的質(zhì)量也不會(huì)被犧牲。這就像是在享受快餐的同時(shí)，還能保證營(yíng)養(yǎng)均衡，簡(jiǎn)直完美！

除了基本的圖片縮放，Sharp.js 還能進(jìn)行旋轉(zhuǎn)、提取、合成等操作。這就像是你的私人廚師，不僅能做出美味的主菜，連甜點(diǎn)和飲料也能一手包辦。

結(jié)語(yǔ)：Sharp.js，你的前端開發(fā)利器

好了，小伙伴們，關(guān)于 Sharp.js 的介紹就到這里。無(wú)論你是前端開發(fā)者，還是對(duì)圖片處理有興趣的愛好者，Sharp.js 都是一個(gè)非常值得嘗試的工具。它不僅能幫你高效地處理圖片，還能讓你的網(wǎng)站加載速度飛快，用戶體驗(yàn)直線上升。所以，還等什么呢？趕緊去試試吧！

記住，Sharp.js 就像是你的圖片處理界的“瘦身”專家，讓你的圖片變得既美觀又高效。