@程序员，一文掌握 Web 应用中的图片优化技巧！(16)_：@程序员

目前，有些图片cdn服务可以开启自动兼容webp的模式，即支持webp的浏览器则将原图转换为webp图片并返回，否则直接返回原图。实现这个功能的原理是，根据浏览器发起的请求头中的Accept属性中是否包含webp格式来判断：

有则说明浏览器支持webp格式，这对开发者来说可能是最简单的兼容方案，但是依赖于后端服务。

接下来，谈一谈我认为应该反思的负优化手段。

对Base64Url的反思

首先复习一下Base64的概念，Base64就是一种基于64个可打印字符来表示二进制数据的方法，编码过程是从二进制数据到字符串的过程，在Web应用中我们经常用它来做啥呢——传输图片数据。HTML中，img的SRC和CSS样式的background-image都可以接受Base64字符串，从而在页面上渲染出对应的图片。正是基于浏览器的这项能力，很多开发者提出了将多张图片转换为Base64字符串，放进CSS样式文件中的“优化方式”，这样做的目的只有一个——减少HTTP请求数。但实际上，在如今的应用开发中，这种做法大多数情况是“负优化”效果，接下来让我们细数Base64 Url的“罪状”。