JS script make a page infinite loading and then crush just in a small size browser

I made a script that should position randomly some icons on the page. The script works fine when the browser is open full screen but if I open it in the smallest width it makes the page loading no stop and then it crashes, it works fine on phones though. Here is the code

function initialPosition() {
  // get page dimension
  const body = document.body,
  html = document.documentElement,
  sizewidth = window.innerWidth;
const pageHeight = Math.max(
  body.scrollHeight,
  body.offsetHeight,
  html.clientHeight,
  html.scrollHeight,
  html.offsetHeight
);

  const icoSize = +getComputedStyle(document.documentElement)
    .getPropertyValue("--ico")
    .replace(/([^\0-\9])/g, "");

const maxSpare = icoSize * 2;
const sizeheight = window.innerHeight * 2;
const distEachCol = icoSize * 8;
const distEachRow = icoSize * 4;
let icons = ``;
let currentColumn = icoSize;
let currentRow = icoSize;
const maxAnim = 10;

for (let c = 0; currentRow < sizeheight; ) {
  if (currentColumn < sizewidth) {
    const icoN = Math.floor(Math.random() * maxAnim) + 1;
    const addToRow = Math.floor(Math.random() * maxSpare) + 1;
    const addToCol = Math.floor(Math.random() * maxSpare) + 1;

    icons += `<div class="ico ico${icoN}" style="top:${
      currentRow + addToRow
    }px;right:${currentColumn + addToCol}px;"></div>`;
    currentColumn += distEachCol;
  } else if (currentColumn > sizewidth) {
    currentColumn = icoSize;
    currentRow += distEachRow;
    if (c === 1) {
      c = 0;
      currentColumn = distEachCol * 0.5;
      continue;
    }
    c++;
  }
}

document
  .querySelector(".containerico")
  .insertAdjacentHTML("afterbegin", icons);
}
initialPosition();

from JS script make a page infinite loading and then crush just in a small size browser