我读了几个关于这个主题的问题，我看到的一般反馈是JPG用于照片而PNG用于其他所有内容：
PNG应在以下情况下使用：
- 您需要透明度（1位或Alpha透明度）
- 无损压缩效果很好（例如图表或徽标，或计算机生成的图像）
JPEG应在以下情况下使用：
- 无损压缩效果不佳（例如照片）
- 需要全彩色
GIF应该在以下时间：
- PNG不可用，例如在非常旧的软件或浏览器上
- 动画是必要的
然而，似乎这些讨论更适合图像下载。我的问题更倾向于图像渲染。我打算重复x＆amp; y方向......
background-image: url("/path/to/image.jpg"); /* repeat-x & repeat-y */
...我可以将我的图像存储为JPG ~13K或PNG ~50K。因此，尽管相差很小，但浏览器能够非常快速地提取这个图像。但是，当浏览器在页面上呈现图像时，这种差异是否重要，特别是因为它是重复的背景？
答案 0 :(得分：6)
JPG 对于低带宽图像更好 - 但是它不那么清晰，因此对GUI不太好。
JPG 文件可以保存到更小的文件大小，从而加快交易和在线交付速度。
JPG 可以保存在不同的压缩级别（通常从1到12，12是更高的质量）。
对于色彩较少的清晰图像，PNG 会更好，
PNG 支持100％透明度。无需保存到PSD（Photoshop文档）以保持透明度。
PNG 支持具有基本效果和格式的图层
您可以继续保存完整的 PNG 文件，而不必担心每次都会丢失图像质量。
通常，JPG用于照片和图片，而PNG适用于计算机生成的图形，徽标，网络图标等。
答案 1 :(得分：2)
首先，下载图像并在浏览器中呈现图像没有区别。为了让浏览器呈现图像，必须完整下载。
图像重复的事实并不是很重要。与下载图像相比，渲染图像所花费的时间微不足道。
图像越小越好。你引用的经验法则将有助于猜测，但你总是可以尝试这两种选择，看看哪一种更小而不会失去质量。