什么是 Data URL？

Data URL 是一种特殊的 URL 方案，允许将数据直接嵌入到文档中，而不需要通过外部文件引用。格式为：data:[<mediatype>][;base64],<data>

功能特点

• 减少 HTTP 请求，提高页面加载速度
• 支持 Base64 和 URL 编码两种方式
• 适合嵌入小文件（图标、小图片、字体等）
• 可用于 HTML、CSS 和 JavaScript

应用场景

• 在 HTML 中嵌入小图片（<img src="data:...">）
• 在 CSS 中嵌入背景图片
• 生成可下载的文本文件
• 邮件中嵌入图片（内联图片）

最佳实践

• 仅用于小文件（建议 < 10KB）
• 大文件会增加文档体积，影响性能
• Base64 编码会增加约 33% 的体积
• 考虑浏览器缓存策略
• 注意 URL 长度限制（某些浏览器有限制）

示例

• 文本数据：data:text/plain;base64,SGVsbG8gV29ybGQ=
• HTML 片段：data:text/html,<h1>Hello</h1>
• SVG 图标：data:image/svg+xml,...