Tensors are all zero in tf.browser.fromPixels: loading images from div/canva

I enjoy loading images from div/canva since it is simpler, and you can see what you are loading! Since transfer learning require a small number of images, it is not a big deal.

However, recently, I had a problem that took lots of patience to find out the issue. The model was not training properly. Initially, I have thought it was impossible to solve with the technique I had.

The problem was that the tensors were all zero! It happened because loading with canva/div is not fast enough for the part of the code that created the tensors.

See it for yourself, check out the console log.

See that loading from the canva/div may work sometimes, it worked in several cases for me.