это занимает много времени, когда я запускаю javascript перед window.onload

Question

У меня есть код для подсчета от 1 до n.

Следующий код занимает около 1 с.

const maxNum = Math.pow(2, 26);
const startTime = performance.now();
let result = 0;
for(let i = 1; i <= maxNum; i++) {
    result += i;
}
console.log(performance.now() - startTime);

Но, как только я помещаю те же самые скрипты в окно. Загрузка, это занимает около 65 мс. Почему большая разница?

window.onload = function() {
    const maxNum = Math.pow(2, 26);
    const startTime = performance.now();
    let result = 0;
    for(let i = 1; i <= maxNum; i++) {
        result += i;
    }
    console.log(performance.now() - startTime);
};

Answer 1

Это происходит потому, что вы переназначаете ссылку на верхний уровень, и, по крайней мере, в некоторых средах изменение значений на глобальном уровне намного дороже, чем переназначение ссылки на неглобальную переменную.

Следующий фрагмент делает то же самое в IIFE (который запускается немедленно), с result, который переназначается на верхнем уровне. Как видите, обработка занимает примерно столько же времени:

let result = 0;
(() => {
  const maxNum = Math.pow(2, 26);
  const startTime = performance.now();
  for(let i = 1; i <= maxNum; i++) {
      result += i;
  }
  console.log(performance.now() - startTime);
})();

Если переместить let result = 0 внутри IIFE, процесс будет намного быстрее, потому что тогда переназначенная переменная будет иметь локальную, а не глобальную область:

(() => {
  let result = 0;
  const maxNum = Math.pow(2, 26);
  const startTime = performance.now();
  for(let i = 1; i <= maxNum; i++) {
      result += i;
  }
  console.log(performance.now() - startTime);
})();

Это не имеет ничего общего с операцией, выполняемой над загрузкой, а не сразу - это просто связано с тем, что привязка переменной вы переназначаете 2 ** 26время имеет глобальную область действия.

Такое поведение наблюдается как в Chrome, так и в Firefox, хотя в Chrome разница намного больше.