Programmatically Load Image in JavaScript

- 1 minute read

Images can be loaded with JavaScript, and you can perform an action right after an image has been loaded:

const img = new Image();
img.onload = () => {
    // do something
img.src = ``;

Once the image has successfully loaded, it won’t be fetched each time you reference it in your HTML:

<img src="" alt="A sample image">

One practical use case is showing a placeholder such as a spinner while an image loads.

Link to this section Conclusion

Anyway, hopefully you found this useful!