ウェブコンテンツは、URLと呼ばれる特別なアドレスを使って見つけます。私たちはhttps://google.comのようなアドレスに馴染みがあります。URLが長くなると読みにくくなることがあります。そのため、HTMLでは改行文字やタブ文字を使って次のように整形したくなるかもしれません。
<a href="https://lemire.me/blog/2026/02/21/
how-fast-do-browsers-correct-utf-16-strings/">my blog post</a>
これは動作します。
ブラウザが従うWHATWG URL仕様書を見てみましょう。仕様書は2つの記述を連続して行っています。
- 入力にASCIIタブまたは改行が含まれている場合、invalid-URL-unit検証エラーを報告します。
- 入力からすべてのASCIIタブまたは改行を削除します。
タブや改行文字がある場合にエラーを報告しながらも処理を続行する点に注目してください。仕様書では検証エラーはパーサーが終了することを意味しないとされており、システムに対してどこかでエラーを報告するよう推奨しています。事実上、エラーは無視されますが、ログに記録される可能性があります。したがって、私たちのHTMLは実際には問題ありません。
次の例も問題ありません。
<a href="https://go
ogle.c
om" class="button">Visit Google</a>
タブも使用できます。ただし、他の空白文字を任意に挿入することはできません。
ただし、任意のASCII空白文字を使用できるケースもあります。それはdata URLです。Data URL(data URIとも呼ばれる)は、外部リソースにリンクする代わりに、画像、テキスト、その他のコンテンツなどの小さなファイルをURL文字列内に直接埋め込みます。Data URLは特別な種類のURLであり、異なるルールに従います。
典型的なdata URLはdata:image/png;base64,iVBORw0KGgoAAAANSUhEUg...のようになります。ここでiVBORw0KGgoAAAANSUhEUg...の文字列は、base64でエンコードされた画像のバイナリデータです。Base64は任意のバイナリコンテンツを表現できるテキスト形式で、各文字が6ビットをエンコードする64個のASCII文字を使用します。バイナリのメール添付ファイルはbase64でエンコードされています。
ウェブ上でbase64文字列をデコードする際は、すべてのASCII空白(スペース文字自体を含む)を無視します。したがって、次のようにPNG画像をHTMLに埋め込むことができます。
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA
QAAAAECAIAAAAmkwkpAAAAEUl
EQVR4nGP8z4AATEhsPBwAM9EB
BzDn4UwAAAAASUVORK5CYII=" />
このHTMLコードは有効で、ページに小さな画像を挿入します。
さらに、data URLはSVG画像を挿入するためにも使用できます。SVG(Scalable Vector Graphics)は、ピクセルではなく数学的なパス、形状、テキストを使って2Dグラフィックスを記述するXMLベースのベクター画像形式です。
次のコードは非常にシンプルな夕焼けを描画します。
<img src='data:image/svg+xml,
<svg width="200" height="200"
xmlns="http://www.w3.org/2000/svg">
<rect width="100%" height="100%" fill="blue" />
<!-- the sky -->
<circle cx="100" cy="110" r="50" fill="yellow" />
<!-- the sun -->
<rect x="0" y="120" width="200" height="80" fill="brown" />
<!-- the ground -->
</svg>' />
SVGコードを読みやすく整形できたことに注目してください。
参考文献: Nizipli, Y., & Lemire, D. (2024). Parsing millions of URLs per second. Software: Practice and Experience, 54(5), 744-758.
Published by
0 Comments
Log in to join the conversation.No comments yet. Be the first to share your thoughts.