परिचय
क्यू माइक्रोटास्क एक नया ब्राउज़र एपीआई है जिसका उपयोग आपके सिंक्रोनस कोड को एसिंक्स में बदलने के लिए किया जा सकता है:
queueMicrotask(() => {
console.log('hey i am executed asychronously by queueMicrotask');
});यह वैसा ही है जैसा हम सेटटाइमआउट का उपयोग करके कर रहे थे:
setTimeout(() => {
console.log('hey i am executed asychronously by setTimeout');
}, 0);तो queueMicrotask . का क्या उपयोग है जब हमारे पास पहले से ही सेटटाइमआउट . है ?
कतारमाइक्रोटास्क फ़ंक्शन (कार्य) को एक कतार में जोड़ता है और वर्तमान कार्य के पूरा होने के बाद प्रत्येक फ़ंक्शन को एक-एक करके (FIFO) निष्पादित किया जाता है और जब निष्पादन संदर्भ के नियंत्रण से पहले कोई अन्य कोड चलाने की प्रतीक्षा नहीं करता है, तो ब्राउज़र को वापस कर दिया जाता है। इवेंट लूप.
मूल रूप से queueMicrotask . के कार्य इवेंट लूप में निष्पादन पास करने से पहले वर्तमान कॉलस्टैक खाली होने के बाद ही निष्पादित किया जाता है।
सेटटाइमआउट के मामले में , ईवेंट लूप को नियंत्रण दिए जाने के बाद, प्रत्येक कार्य को ईवेंट कतार से निष्पादित किया जाता है।
इसलिए यदि हम सेटटाइमआउट execute निष्पादित करते हैं पहले और फिर queueMicrotask , जिसे पहले कहा जाएगा? नीचे दिए गए कोड को निष्पादित करें और स्वयं को जांचें:
setTimeout(() => {
console.log('hey i am executed asychronously by setTimeout');
},0);
queueMicrotask(() => {
console.log('hey i am executed asychronously by queueMicrotask');
}); Node.js "process.nextTick" के साथ भी यही काम करता है।
कब उपयोग करें इसे
queueMicrotask, . का उपयोग कब करना है, इसका कोई नियम नहीं है लेकिन वर्तमान निष्पादन को रोके बिना कोड के एक टुकड़े को चलाने के लिए इसका चतुराई से उपयोग किया जा सकता है।
उदाहरण के लिए, मान लें कि हमारे पास एक सरणी है जहां हम मूल्यों की सूची बनाए रख रहे हैं। प्रत्येक मान डालने के बाद, हम सरणी को क्रमबद्ध करते हैं ताकि मूल्यों की खोज तेज हो।
var arr=[];
function add(value){
arr.push(value);
arr.sort();
}हालांकि, किसी तत्व की खोज तब की जाती है जब कोई खोज इनपुट बॉक्स का उपयोग करता है। इसका मतलब है कि ईवेंट लूप में नियंत्रण स्थानांतरित होने के बाद ईवेंट हैंडलर को कॉल किया जाएगा, इसलिए डेटा को सॉर्ट करने से अन्य महत्वपूर्ण सिंक्रोनस कोड का निष्पादन अवरुद्ध हो जाता है।
यहां बताया गया है कि हम queueMicrotask . का उपयोग कैसे कर सकते हैं हमारे कोड को बेहतर बनाने के लिए:
var arr = [];
function add(value) {
arr.push(value);
queueMicrotask(() => {
arr.sort();
})
}संदर्भ
- https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/queueMicrotask