# Where is the \`whileLoadingCallback\` for images?

**URL:** <https://discourse.processing.org/t/where-is-the-whileloadingcallback-for-images/34200>\
**Category:** Beginners\
**Created:** [December 19, 2021, 9:26pm UTC](https://discourse.processing.org/t/where-is-the-whileloadingcallback-for-images/34200 "2021-12-19T21:26:34Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Errorbot1122](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/errorbot1122/32/14718_2.png) [@Errorbot1122](https://discourse.processing.org/u/Errorbot1122)\
**Post date:** [December 19, 2021, 9:26pm UTC](https://discourse.processing.org/t/where-is-the-whileloadingcallback-for-images/34200/1 "2021-12-19T21:26:34Z")

</div>

Where is the `whileLoadingCallback` for images? I know p5 has one for sound, but not images for some reason…

Well, you know what, if you’re going to add on for images, what about adding them for tables or XML Files, etc.

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [December 20, 2021, 12:00am UTC](https://discourse.processing.org/t/where-is-the-whileloadingcallback-for-images/34200/2 "2021-12-20T00:00:04Z")

</div>

> [@Errorbot1122](#):
>
> I know p5 has one for sound, but not images for some reason…

**[p5.js-sound](https://github.com/processing/p5.js-sound)** is a separate library which although is bundled w/ p5.js we still need to load it as an addon.

> [@Errorbot1122](#):
>
> Where is the `whileLoadingCallback` for images?

**[p5.js-sound](https://github.com/processing/p5.js-sound)** relies on [XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest) to load sound files:

> <https://github.com/processing/p5.js-sound/blob/v1.0.1/src/soundfile.js#L226-L233>

And it happens that it has a builtin triggered event for loading progress:

> **[XMLHttpRequest: progress event - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/progress_event)**
>
> The progress event is fired periodically when a request receives more data.

Main library p5.js used [XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest) in the past; but now it relies on the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) instead via its method [**httpDo()**](https://p5js.org/reference/#/p5/httpDo):

> <https://github.com/processing/p5.js/blob/v1.4.0/src/io/files.js#L1103-L1106>

However the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) doesn’t have a straight progress event like its [XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest) predecessor.

Nevertheless there are some hacks to emulate the loading progress feature:

> <https://github.com/AnthumChris/fetch-progress-indicators/blob/master/fetch-basic/supported-browser.js>

You may attempt to request the p5js devs to include some **fetch()** progress hack into its loading functions:

> **[Issues · processing/p5.js](https://github.com/processing/p5.js/issues)**
>
> p5.js is a client-side JS platform that empowers artists, designers, students, and anyone to learn to code and express themselves creatively on the web. It is based on the core principles of Proces...

But have in mind that even when p5.js used to rely on [XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest) back then they opted not to have any progress loading callback.