मेरे पास 1 से n तक गिनने के लिए कोड है।

निम्नलिखित कोड में लगभग 1s लगते हैं।

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);

लेकिन, एक बार जब मैं उसी स्क्रिप्ट को window.onload में डालता हूं, तो इसमें लगभग 65ms लगते हैं। बड़ा अंतर क्यों?

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);
};
3
unbregg 30 अक्टूबर 2019, 07:34

1 उत्तर

सबसे बढ़िया उत्तर

यह व्यवहार इसलिए है क्योंकि आप शीर्ष स्तर पर एक संदर्भ को पुन: असाइन कर रहे हैं, और कम से कम कुछ वातावरणों में, वैश्विक स्तर पर मूल्यों को बदलना गैर-वैश्विक चर के संदर्भ को पुन: असाइन करने से कहीं अधिक महंगा है।

नीचे दिया गया स्निपेट आईआईएफई में वही काम करता है (जो तुरंत चलता है), 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 को आईआईएफई के अंदर ले जाते हैं, तो प्रक्रिया बहुत तेज हो जाएगी, क्योंकि तब पुन: असाइन किया गया चर वैश्विक स्तर के बजाय स्थानीय रूप से दायरे में है:

(() => {
  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 बार पुन: असाइन किए जाने वाले वेरिएबल बाइंडिंग विश्व स्तर पर है।

क्रोम और फ़ायरफ़ॉक्स दोनों इस व्यवहार को प्रदर्शित करते हैं, हालांकि क्रोम में अंतर बहुत बड़ा है।

2
CertainPerformance 30 अक्टूबर 2019, 04:48