जावास्क्रिप्ट फ़ंक्शन की प्रगति की रिपोर्ट कैसे करें?

Question

मेरे पास एक जावास्क्रिप्ट फ़ंक्शन है जो काफी लंबा है और कई कार्य करता है, मैं एक संदेश के साथ एक स्पैन तत्व की सामग्री को अद्यतन करके उपयोगकर्ता को प्रगति की रिपोर्ट करना चाहता हूं। मैंने document.getElementById ('spnProgress') जोड़ने का प्रयास किया। InnerText = ... फ़ंक्शन कोड में बयान।

हालांकि, जब कार्य यूआई निष्पादित कर रहा है, तो अपडेट नहीं होगा और इसलिए आप केवल स्पैन को लिखे गए अंतिम संदेश को देखते हैं जो बहुत उपयोगी नहीं है।

मेरा वर्तमान समाधान कार्य को कई कार्यों में तोड़ना है, प्रत्येक के अंत में मैं स्पैन संदेश सेट करता हूं और फिर विंडो के साथ अगला "ट्रिगर" करता हूं। बहुत समय के साथ टाइमटाइम कॉल 10ms)। यह नियंत्रण उत्पन्न करता है और ब्राउज़र को अगले चरण को शुरू करने से पहले अद्यतन संदेश के साथ SPAN को पुन: पेश करने की अनुमति देता है।

हालांकि मुझे यह बहुत गन्दा और कोड का पालन करना मुश्किल लगता है, मुझे लगता है कि एक बेहतर तरीका होना चाहिए। क्या किसी के पास कोई सुझाव है? क्या कार्य के संदर्भ को छोड़ दिए बिना स्पैन को पेंट करने के लिए मजबूर करने का कोई तरीका है?

धन्यवाद

Answer 1

जिस तरह से आप यह कर रहे हैं सही तरीके से (इस समय, इस बदलाव हो सकते हैं मानकों थोड़ी देर के लिए उभरने और अपनाया जाता है [देखना एंड्रयू Aylett के answer], लेकिन अभी तक) है। ब्राउजर को यूआई अपडेट करने की अनुमति देने के लिए आपको इस तरह उपज करना होगा। मैंने पाया है कि जितना अधिक मैं इस तरह सोचता हूं, क्लीनर चीजें मिलती हैं, लेकिन ऐसा करने में मेरे पहले कुछ स्टैब्स वास्तव में काफी "गन्दा" थे। उम्मीद है कि आपको वही चीज़ मिल जाएगी जैसा आप इसका इस्तेमाल करते हैं।

Answer 2

यह पूछने की तरह है कि प्रक्रिया को बाधित किए बिना प्रक्रिया को बाधित करना संभव है या नहीं। जवाब न है। ब्राउज़र के प्रतिपादन इंजन पर नियंत्रण पास करने के लिए आपको एक सेटटाइमआउट() या setInterval() का उपयोग करना होगा।

यदि आप setInterval() का उपयोग करते हैं तो आप उस प्रक्रिया को प्राप्त कर सकते हैं और आपके निष्पादन समारोह में बस एक बाहरी चर अद्यतन करें, जिसे setInterval() द्वारा बुलाए गए फ़ंक्शन द्वारा मतदान किया जाएगा। इस तरह आपको केवल लूप में करने के बजाए एक कॉल करना होगा।

Answer 3

मुझे नहीं पता कि मुझे पता है। आप इस तरह से कि व्यक्तिगत कार्यों चर साझा कर सकते हैं में अपने कोड को तोड़ने सकता है, इस प्रकार:

var a = some_local_state(); 
runTasksWithProgress([ 
    function() { 
     do_some_work(a); 
     a = a + 1; 
    }, 
    function() { 
     do_some_other_work(a); 
     a = a * 2; 
    }, 
    ... 
    ]); 

runTasksWithProgress थोड़ा मुश्किल है। आप मूल रूप से पहले कार्य का आह्वान करेंगे, स्थिति अपडेट करें, फिर बाद के कार्यों को चलाने के लिए कॉल-बैक सेट अप करें।

यह दृष्टिकोण कुछ दर्द को कम कर सकता है।

Answer 4

आपको यह पता होना चाहिए कि कुछ ब्राउज़रों में आपको एक लंबी स्क्रिप्ट प्राप्त होने पर स्क्रिप्ट टाइमआउट संदेश प्राप्त होगा। तो यह वास्तव में एक टाइमर का उपयोग करके इसे विभाजित करने के लिए वांछनीय है।

यह कहकर, यदि आप ऐसा करने का वास्तव में संरचित तरीका ढूंढ रहे हैं, तो आप एक वर्तनी जांच प्रोजेक्ट के लिए लिखे गए पृष्ठभूमि कार्य पुस्तकालय को देख सकते हैं। यह आपको टाइमर पर डेटा के सरणी के खिलाफ मानचित्र/कम करने की अनुमति देता है। यदि आपके समारोह के काम एक पाश में किया जाता है

https://github.com/jameswestgate/taskjs

Answer 5

कुछ इस तरह काम कर सकते हैं। यह गुजरने वाले समय की जांच करता है और प्रगति पट्टी को अपडेट करता है यदि 1/2 सेकंड चला गया है। (उदाहरण अनचाहे है। तो आपको इसके साथ थोड़ा सा खेलना पड़ सकता है।)

var start; 
function longRunning(lastState){ 
    start = (new Date); 
    for(var i = lastState; i < 1e6 /*= 1000000 iterations */; ++i){ 
     if((new Date)-start<500){ 
      // do your stuff; 
     } 
     else{ 
      // call a function to update the progress bar 
      updateProgressBar(); 
      // continue the loop... 
      setTimeout(function(){longRunning(i);},13); 
      break; 
     } 
    } 

} 
longRunning(0); 

Answer 6

आप लक्ष्य ब्राउज़र का नियंत्रण मिल गया है, तो आप एक HTML5 worker thread उपयोग करने के लिए पृष्ठभूमि में काम करने के लिए सक्षम हो सकता है।