Base64编码原理一、Base64 基础概念定义：Base64 是一种基于 64 个可打印字符（A-Z、a-z、0-

定义：Base64 是一种基于 64 个可打印字符（A-Z、a-z、0-9、+、/）表示二进制数据的编码方式，常用于在文本环境中传输二进制数据（如图片、文件）。

字符转 ASCII 码：

A → 65 → 二进制 01000001  
B → 66 → 01000010  
C → 67 → 01000011

合并二进制位：将 3 个字节（24 位）合并为 4 组 6 位二进制：

01000001 01000010 01000011 → 拆分为  
010000 | 010100 | 001001 | 000011

6 位转 8 位并映射字符：每组前补 2 个 0 转为 8 位，对应 Base64 字符表：
```
00010000 → 16 → Q  
00010100 → 20 → U  
00001001 → 9 → J  
00000011 → 3 → D  
```
最终编码结果：QUJD（末尾无填充时）。
填充规则：若字节数非 3 的倍数，用 = 填充至 4 组（如 2 字节补 2 个 =，1 字节补 1 个 =）。

答：
- 因使用 64 个基本字符进行编码（2^6 = 64），每个字符表示 6 位二进制数据；
- 64 个字符刚好是 ASCII 码中可打印字符的子集（排除控制字符和特殊符号）。

答：
- 标准 Base64 包含 + 和 /，在 URL 中需转义为 %2B 和 %2F；
- 解决方案：使用 Base64URL 变种（将 + 换为 -，/ 换为 _，去除填充符 =）。

答：
- 小图使用：Base64 适合小于 10KB 的图片（如图标），大图会导致 HTML/CSS 体积膨胀；
- 压缩后编码：先通过工具（如 ImageOptim）压缩图片，再转 Base64；
- 懒加载：非首屏 Base64 图片使用懒加载，避免阻塞渲染。

答：
- 传输性能：Base64 数据量比二进制大 33%，适合小数据量场景；
- 解析性能：浏览器解析 Base64 图片的时间略高于二进制图片（需解码为像素数据）；
- 缓存策略：Base64 嵌入代码中无法被浏览器单独缓存，二进制图片可利用强缓存。

图片嵌入：将小图标编码后嵌入 CSS/HTML，减少 HTTP 请求：

.icon {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUg...");
}