RAX7

- callback(rooms) {
+ callback: (rooms) => {

function rgbaToAndroid1(rgba) {
  const c = new Uint8Array([
    rgba[2],
    rgba[1],
    rgba[0],
    Math.round(rgba[3] * 255)
  ]);
  return new Uint32Array(c.buffer)[0];
}

// либо
function rgbaToAndroid2(rgba) {
  let color = 0;
  for (let i = 0; i < 3; i++) {
    color += rgba[i] * 2 ** ((2 - i) * 8);
  }

  color += Math.round(rgba[3] * 255) * 2 ** (3 * 8);
  return color;
}

console.log(rgbaToAndroid1([255, 122, 107, 1]));
console.log(rgbaToAndroid2([255, 122, 107, 1]));

function createTable(el) {
	for (let i = 0, row; i < el.length; i++) {
    if (i % 7 === 0) {
      row = document.createElement('tr');
      thead.appendChild(row);
    }
		const cell = document.createElement('th');
		cell.innerHTML = el[i];
		row.appendChild(cell);
	}
}

и вдогонку https://stackoverflow.com/questions/222309/calcula...

Через Animations API можно посмотреть на свойство playState в какой-то конкретный момент времени, но какого-то события для этого нет.
Можно состряпать собственный костыль на основе Animations API и requestAnimationFrame.

Но проще и лучше будет запускать анимацию не по css hover, а из js - этот способ избавит от ненужных костылей.

У объекта события есть свойство timeStamp, зная значения предыдущего и текущего timeStamp можно посчитать частоту срабатывания события.

function checkingReading() {
  let prevTimeStamp = performance.now();
  chatbox.addEventListener("DOMSubtreeModified", (e) => {
    const dt = e.timeStamp - prevTimeStamp;
    prevTimeStamp = e.timeStamp;
    
    const changesPerSecond = 1000 / dt;
    console.log(changesPerSecond)
  });
}

P.S. возможно тебе нужен debounce чтобы не слишком часто слать запросы

Такие штуки проще на svg делать

Можно для функции range использовать генератор, в этом случае не будет выделятся память под ненужный массив

function* range(from, to, step = 1) {
  if (to === undefined) [from, to] = [0, from];
  for (let i = from; i < to; i += step) yield i;
}

for (let v of range(1, 10)) {
  console.log(v);
}

На странице плагина ScrollTrigger есть куча примеров, которые должны помочь разобраться.

Скорее всего этот эффект сделан на основе шума Перлина
Можно сделать примерно так:

Object.entries({name, age})
  .forEach(([k, v]) => form.append(k, v));

Способ весьма костыльный, но вроде работает.