Function loadImageWithFallback

Attempts to load an image via fetch and sets it as a data URL on the given element.

This approach allows you to:

• Detect HTTP errors (e.g., 404, 500) before setting the image source.
• Run custom fallback logic (function or alternate image URL) if loading fails.

⚠️ Trade-offs:

• Bypasses browser image caching and progressive rendering.
• May increase memory usage (images are loaded as data URLs).
• Can encounter CORS issues more often than using .
• Slightly more complex than using the standard handler.

When to use:

• You need to distinguish between different HTTP errors.
• You want to run custom logic before the image is rendered.
• You need to preprocess the image data.

For most cases, prefer using the element's onerror handler for better performance and simplicity.