What are the Data URI Size Limits in Different Web Browsers?

Data URI Size Limitations in Popular Web Browsers

In web development, leveraging Data URLs is a convenient way to embed data directly into HTML elements. However, these URLs come with size limitations that vary across web browsers.

Size Limitation Overview

While the Data URI specification does not impose a specific size limit, browsers are free to enforce their own. Here's a summary of the limitations in popular browsers:

• Chrome: 2MB for the current document, and 2GB or total_physical_memory / 5 for arbitrary blobs (in x64, non-OS/Android systems)
• Firefox: Unlimited
• IE 9 and Edge: 4GB
• Safari and Mobile Safari: Documentation does not specify

Alternatives to Consider

In cases where the Data URI size limit is insufficient, consider using the following alternatives:

• Blob URLs: CreateObjectURL() via the URL API, with blobs via the File API (Chrome limit: 500MiB)
• Third-party Libraries: FileSaver.js, StreamSaver.js, JSZip
• Modernizr Detection: Detect support for Data URIs over 32kb

Related Considerations

Note that size limitations also apply to background-image URLs using the data: scheme. Additionally, certain browsers may have additional constraints on the length of the base64-encoded data. It's essential to consider browser compatibility and size requirements when utilizing Data URLs.

The above is the detailed content of What are the Data URI Size Limits in Different Web Browsers?. For more information, please follow other related articles on the PHP Chinese website!