1. DATA URI
Data URI （データURIスキーム）は、外部データを直接ウェブページに埋め込む手法です。導入の結果、ウェブサイトからのHTTPリクエスト回数が少なくなり、パフォーマンスが向上するとされています。大まかには、CSSのスプライト・シートと同じ目的で導入するのものと言えます。
どのような外部ファイルでも埋め込むことが可能ですが、直接「バイナリーデータ（バイト）」のまま埋め込んでしまうと、ネットワークに通信する際に問題が起こる可能性があります。何故かと言うと、
各ソフトウェアがバイナリーデータのまま通信されたデータを受け取った際、誤って実行命令として解釈してしまう恐れがあるからです。
従って、Data URIを導入してXMLファイルをHTMLやCSSページに埋め込もうとする場合、XMLファイル自体がはじめからバイナリデータではないので、問題無いとされています。
2. BASE64
しかし、ビットマップ画像（英 : Raster Images）を埋め込もうとする場合、バイナリデータのままなので危険です。危険を回避するには、安全なエンコード方式が必要となります。
インターネットでは、Data URIの際にBASE64というエンコード方式を用いるのが一般的です。
BASE64エンコード方式は、印字可能な英数字64種類（A – Z、 a – z、 0 – 9 、+、/）のみを用いてデータを変換しています。その過程で4文字ごとに3バイトが使われるため、結果的にBASE64でエンコードされたデータ量は、変換前と比較して約33%増えます。
メール通信にもよく使われている方式ですが、インターネットに関しては、Data URIとの組み合わせで、比較的小さな画像パーツ（ビットマップ画像）を安全に通信し、HTTPリクエストの回数を減らすための方法として使われています。
3. DATA URI の使い方
data:[<MIME-type>][;charset=<encoding>][;base64],<data>
[ ]の代わりに、適切な情報を入れます。具体的には、下記の「実践事例」を見て下さい。
Base64の場合、charsetの指定は不要のようです。
画像の場合、HTML及びCSSへの導入が普通の画像と同じです。
HTMLでの記載方法 :
<img src='こちら'>
CSSでの記載方法 :
.bg { background: url('こちら'); }
実践事例 : BASE64 の PNGファイルをDATA URIで導入する
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQ(...)
解説 :
Mime Type : image/png
Charset : Base64では必要ありません
Base64 : あり
Data : Base64に変換したものを記述します（若干長いので、一部省略しています）
4. SVG (Scalable Vector Graphics) の場合
SVGはビットマップ画像と異なり、XMLで書かれたベクター画像です。
SVGでData URIで使う際には、Base64への変換がよく使われているようです（名のあるLESSというCSSフレームワークもコンパイル時に自動的にSVGをBase64に変換する※）。しかし、上で書いたようにXMLデータですので、Base64に変換する必要性はあまりありません。逆に必要が無いのに、わざわざBase64にしてデータ量を33%増加させてしまうのは非効率的です。更に、サーバ側のgzip圧縮を掛けた場合には、Base64のデータはXMLデータほどうまく圧縮されないという欠点もあります。
※ 要確認
実践事例 : SVGファイルをDATA URIで導入する
SVGタグを直接Data URIのデータ・パラメータに入れることができます。
data:image/svg+xml;utf8,<svg>(...)</svg>
解説 :
Mime Type : image/svg+xml
Charset : utf8
Base64 : Base64ではないため、何も記述しません
Data : <svg>をそのまま入れ込んでいます
5. 採用の注意
普通のビットマップ画像であれば、一度ダウンロードしたデータはブラウザにキャッシュされるため、ページ接続の度に毎回HTTPリクエストが発生することはありません。しかし、HTMLページにDATA URIで記載したSVGは毎回ダウンロードし直されてしまいますので、HTMLページに記述することはあまり望ましくありません。採用する場合は、キャッシュ可能なCSSファイルに組み込むなどした方が良いでしょう。
6. 結論
DATA URIを使うことによってHTTPリクエストを減少させ、ウェブサイトのパフォーマンスを向上させることができます。しかし、その代わりに１リクエスト毎の通信データ量が多くなってしまいます。
従って、「HTTPリクエストの減少のメリットが、データ量の増加のデメリットを上回るか？」という点を考える必要があります。この問いには今のところ普遍的な答えがなく、時と場合によって変わってきます。どういったケースで採用した方が良い、採用しない方が良いという判断基準を作るための要素を継続的に探っていく必要がありそうです。