Enhancing BlockSpan's NFT Media Handling Capabilities: A Developer's Guide

Introduction

We're excited to announce significant updates to our Cached Media handling capabilities at BlockSpan. These enhancements will improve how your applications interact with NFT images, videos, and other media types, ensuring faster load times and a better user experience.

Extended Media Type Support

We now cache and support an expanded list of media types through our CDN. Here’s a summary of the supported formats:

• Images: AVIF, GIF, HEIC, JPEG, PNG, SVG, TIFF, WebP
• Videos: 3GPP, MP4, QuickTime, WebM, MKV
• Audio: AIFF, MPEG, WAV, M4A
• Others: JSON, PDF, GLTF models, text/plain, and more.

This broad support ensures your NFT media is reliably available, no matter the format.

Automatic Resizing for Images

For images, we automatically provide URLs for multiple scaled versions to fit various dimensions:

• Tiny: 100px
• Small: 250px
• Medium: 500px
• Large: 1000px
• Original: Original size

You can also customize dimensions by adjusting the URL parameters without additional API calls. This feature optimizes image display across different devices and screen sizes, enhancing visual consistency.

"cached_images": {
    "tiny_100_100": "https://cdn.blockspan.com/53616....100_100.jpg",
    "small_250_250": "https://cdn.blockspan.com/53616....250_250.jpg",
    "medium_500_500": "https://cdn.blockspan.com/53616....500_500.jpg",
    "large_1000_1000": "https://cdn.blockspan.com/53616....1000_1000.jpg",
    "original": "https://cdn.blockspan.com/53616....original.jpg",
    "content_type": "image/jpeg"
}

Improved Video Handling

For MP4 videos, the cached_videos field now includes direct links to cached MP4 files, and cached_images contains URLs to scaled screenshots, simplifying the management of video thumbnails.

"cached_videos": {
    "original": "https://cdn.blockspan.com/53616....original.mp4",
    "content_type": "video/mp4"
},
"cached_images": {
    "tiny_100_100": "https://cdn.blockspan.com/53616....screenshot_100_100.jpg",
    "small_250_250": "https://cdn.blockspan.com/53616....screenshot_250_250.jpg",
    "medium_500_500": "https://cdn.blockspan.com/53616....screenshot_500_500.jpg",
    "large_1000_1000": "https://cdn.blockspan.com/53616....screenshot_1000_1000.jpg",
    "original": "https://cdn.blockspan.com/53616....screenshot.jpg",
    "content_type": "video/mp4"
}

Handling Audio and Other Assets

For audio files and other media formats, the cached_other_assets field provides detailed JSON objects for each cached file, improving the handling and display of diverse media types.

"cached_other_assets": [
    {
        "original": "https://cdn.blockspan.com/53616....original.mov",
        "content_type": "video/quicktime"
    },
    {
        "original": "https://cdn.blockspan.com/53616....original.wav",
        "content_type": "audio/wav"
    },
    {
        "original": "https://cdn.blockspan.com/53616....original.html",
        "content_type": "text/html"
    }
]

Optimized Media Delivery

To get an optimized version of the media, append _optimized to the URL. This version is up to 90% smaller, ideal for large PNG images.

https://cdn.blockspan.com/53616....500_500_optimized.png

Use Cases and Examples

NFT Art Galleries

For developers creating NFT art galleries, using BlockSpan’s enhanced media handling ensures that images load quickly and at optimal resolutions for different devices. For example, displaying high-resolution artwork without sacrificing load times.

NFT Marketplaces

NFT marketplaces can benefit from the automatic resizing feature, ensuring that thumbnails, previews, and full-size images are all optimized for performance and user experience. The video handling capabilities allow for smooth integration of video previews.

Digital Collectibles

Developers of digital collectible platforms can use the cached media handling to provide users with fast and reliable access to various media types, enhancing the overall interaction with digital collectibles.

Conclusion

These enhancements are designed to streamline how you handle and display NFT-related media within your applications, ensuring faster load times and a better overall user experience. For more detailed information and implementation guides, please check out the updated documentation on our developer portal. As always, your feedback is invaluable, so let us know how these changes work for you!

Happy coding! 🚀

About BlockSpan: Founded by leading enterprise data platform builders in 2022, BlockSpan is a Web3 innovator focused on delivering easy-to-implement API solutions for the blockchain. With the release of the BlockSpan NFT API platform, software companies building on the blockchain have instant access to highly accurate real-time and historical NFT data (and cached media), empowering them to build scalable, cost-efficient apps in just days.

For more information about BlockSpan and its strategic direction, please visit BlockSpan's website at https://blockspan.com/.