游戏素材处理4 分钟阅读

下载文件叫 WebP,实际却可能是 PNG?检查 toBlob 导出结果

文件名、请求格式与实际编码需要分别核对。浏览器回退PNG或生成失败时,不应只靠扩展名判断导出成功。

下载文件叫 WebP,实际却可能是 PNG?检查 toBlob 导出结果
药水素材卡片与像素网格概念图
AI生成的图片概念图,不是编码格式检测或压缩收益实测。

导出代码请求某种图片格式,下载文件也用了对应后缀,但体积和预期不符。先检查实际生成的Blob和文件内容,而不是继续降低一个quality值。请求、结果和命名是三份需要对齐的记录。

指定格式不代表一定生成该格式

MDN toBlob参考说明,未指定或不支持的格式会回退为image/png;浏览器必须支持PNG,但其他输出支持不能只凭文件名推断。回调也可能收到null,表示没有生成可用图片。

本篇针对使用该API的浏览器导出集成,不声称Tooliva内部一定采用同一实现,也不认定当前工具有回退故障。

核对四项实际结果

  1. 保留输入图片、画布尺寸与请求的MIME字符串。
  2. 确认回调确实返回Blob,再记录其type与size。
  3. 用合适的图片检查工具核对实际编码和像素尺寸,不能只看后缀。
  4. 让下载名、响应类型与实际内容一致,保留原图作为对照。

若返回null,应记录失败而不是伪造一个成功文件。若已有PNG结果,改名为.webp不会自行重新编码;但仅type字段也不应代替对来源不明文件的实际检查。

quality 不是所有格式通用的体积开关

官方文档将quality说明为支持有损压缩格式的质量参数,范围0到1;未提供或超范围时使用浏览器默认值。不要把它当成目标缩小百分比,或当作PNG统一的有损压缩设置。

确认真实格式后,再比较字节数与视觉结果。同一质量数字也不承诺所有浏览器输出完全相同的体积。

导出格式通过后再验画面

参考游戏图片质量临界点检查保留透明边、颜色与渐变。成功得到想要的编码,不等于视觉质量、接收端解码和实际纹理导入都通过。

测试应固定输入和尺寸,不同时裁切、缩放再改格式后只把差异归给编码器。没有测量时不编造压缩收益。

用真实素材做受控交付

可从资源压缩工具准备交付副本,再检查实际导出。这里不承诺界面显示Blob.type,也不将该API的参数写成工具必有的按钮。

保留请求格式、结果类型、内容、尺寸和文件名;需要改自己的导出脚本时由维护者按目标浏览器验证。本篇未执行跨浏览器编码实验。

准备好实践「下载文件叫 WebP,实际却可能是 PNG?检查 toBlob 导出结果」了吗?

使用本站在线工具,将教程中的步骤立刻应用到你的独立游戏项目。