SVG是用路径、形状、文本等“数学描述”来绘制图形;PNG是把图像存成像素点阵。两者适用场景不一样。
1)可无损缩放:同一个文件适配多种尺寸。2)可改色与可控:在网页里可用CSS/属性控制填充、描边、动画。3)通常体积小:尤其是简单图标。
复杂渐变、照片级纹理、噪点效果在SVG里并不擅长;过于复杂的路径也可能导致渲染性能与体积问题。
1)支持透明:适合贴图、半透明阴影等。2)呈现稳定:像素级效果在各种环境里一致。3)适合复杂图像:例如UI截图、含纹理的插画导出。
做图标系统:优先SVG,同时提供必要的PNG回退尺寸(如32/64/128)。做图片与复杂视觉:优先PNG或更现代的WebP/AVIF。