告别加载等待：.NET图片秒转WebP的黑科技！

发布于

在逛博客的时候，发现了鱼皮写的一篇文章，他帮助别人解决网站加载慢的问题，一看原因是首页图片太大，10M加载60S，然后优化方案有上传图片限制大小，转webp格式，图片懒加载，异步加载，图片渐进加载，cdn缩略图 等等，其中有转Webp的类库推荐，遇事就试试Net平台下转Webp的类库。当然量比较少的时候可以使用下在线的转换。

什么是WebP

WebP是一种由Google开发的图像格式，主要特点有：

  1. 1. 高压缩率：比JPEG更小的文件大小。
  2. 2. 高图像质量：在压缩的同时保持清晰度。
  3. 3. 支持透明度：可以创建透明背景的图像。
  4. 4. 支持动画：可以制作动态图像，类似GIF。
  5. 5. 现代浏览器兼容：大多数新浏览器支持这种格式。

WebP适用于需要快速加载和节省带宽的网络图像。

ImageMagick的使用

昨天推荐的ImageMagick,一张58M的照片，压缩质量还是默认的75，压缩后还有1.2m，压缩后的文件占压缩前文件大小的2%。可见是相当不错。

代码语言：javascript
复制
ConvertImageToWebPWithMagick("Surface_Laptop_Go_003.png", "Surface_Laptop_Go.webp", 75);
static void ConvertImageToWebPWithMagick(string inputImagePath, string outputImagePath, int quality)
{
    // 读取图片
    using (MagickImage image = new MagickImage(inputImagePath))
    {
        // 设置压缩质量
        image.Quality = quality;
        // 转换为WebP格式
        image.Format = MagickFormat.WebP;
        // 保存到文件
        image.Write(outputImagePath);
    }
}

SkiaSharp

dotnet add package SkiaSharp

转化好后和ImageMagick不相上下，效果也是可以的

代码语言：javascript
复制
// 输入和输出文件路径
string inputFile = "Surface_Laptop_Go_003.png";
string outputFile = "output.webp";
// 加载输入图像
using var inputStream = new FileStream(inputFile, FileMode.Open);
using var inputBitmap = SKBitmap.Decode(inputStream);
// 创建一个新的 SKImage 从 SKBitmap
using var image = SKImage.FromBitmap(inputBitmap);

// 设置 WebP 编码参数，调整质量 (0-100)

var quality = 75; // 调整质量

var webpEncoderOptions = new SKWebpEncoderOptions() { Quality=75 };


// 编码并保存为 WebP

using var outputStream = new FileStream(outputFile, FileMode.Create);

using (var data = image.Encode(SKEncodedImageFormat.Webp, quality))

{

data.SaveTo(outputStream);

}

#webp#编码#科技#浏览器#压缩