Vahan60,
если картинок немного, загрузите их все в строке ноль.
читать preloading images with JavaScript

Использовать Promise надо
Определяем функцию, возвращающую Promise, разрешающийся, когда картинка загрузится (ну или ошибка, т.к. мы их все равно не обрабатываем)

const loadimg = (img, src) => {
	return new Promise (res => {
		img.onload = img.onerror = () => res()
		img.src = src
	})
}

Затем ждем, когда все картинки загрузятся и потом показываем диалог
Вместо строк 4-8

Promise.allSetted([...img].map((im, j) => loadimg(im, `cartoons/${inset[activeUnit][j]}.png`)))
   .then(() => dial.show())

Получилось.

for (let i = 0; i < alphabet.length; i++){
      unit[i].addEventListener("click", function( ) {
	  activeUnit = i;   
      for (let j = 0; j < img.length; j++) {
	  img[j].src = "cartoons/".concat(inset[activeUnit][j].concat(".png"))
          };	  
	   }) 
   };  

for (let i = 0; i < alphabet.length; i++){
      unit[i].addEventListener("click", function( ) {
	     dial.show()  
	   }) 
   };

Всем огромное спасибо!:thanks:

Как меня достали эти алерты:

"Вы должны добавить отзыв кому-то ещё, прежде чем сможете снова добавить его рони."

"Вы должны добавить отзыв кому-то ещё, прежде чем сможете снова добавить его voraa."

:-/

Невозможно поблагодарить Консультантов по форумному.

Благодарю по человечески - еще раз огромное спасибо.

Осталось проверить это на более медленном соединении (например, 3G) и очищая кэш браузера.
Не думаю, что это что то дает.

Кэш очистил. Работает нормально. С 3ж не знаю как быть. В случае чего к строкам 10-12 можно прикрутить setTameOut.