Base64 Encoding in Data URIs

Embedding assets directly into HTML and JSON structures.

Base64 is an encoding scheme used to represent binary data in an ASCII string format. In document conversion, it is frequently used to embed images directly into HTML (Data URIs) to create single-file deliverables.

The Data URI Syntax

data:[<mediatype>][;base64],<data>

For example, a small PNG embedded directly in an HTML image tag: <img src="data:image/png;base64,iVBORw0KGgo..." />

The Overhead Penalty

Base64 encoding increases file size by approximately 33%. While it eliminates an HTTP request (useful for single-file HTML archives), embedding large high-resolution images via Base64 will rapidly bloat the DOM, causing massive memory spikes and rendering latency in the browser.