जावास्क्रिप्ट: ऑटो-सही साइकिल टाइमर

एक कथा में एक पोस्ट में और बहुत तरीके से नहीं, यह "सटीक" जेएस टाइमर के विभिन्न कार्यान्वयन के बारे में बात करता है। सामग्री शुरुआती के लिए डिज़ाइन की गई है ... बिल्ली में आपका स्वागत है।

जैसा कि कहा गया है, पोस्ट के लिए तस्वीर डाली के काम से घड़ी दिखाती है कि "समय बह रहा है", विकल्प प्रकृति में यादृच्छिक और रूपक नहीं है। जेएस में प्रोग्रामिंग के ढांचे में, समय ऐसा नहीं लग सकता जैसा हम मानते हैं। जेएस प्रकृति में एकल-पिरोया हुआ है, जो एक फ़ंक्शन निष्पादन कतार को जन्म देता है, और कतार एक अनिवार्य आदेश का अर्थ है। और अगर गणना के कुछ चरण बहुत अधिक संसाधन-गहन हैं, तो हमारे पास एक स्पष्ट विसंगति है कि क्या आवश्यक है और निष्पादन का परिणाम है। यह पुस्तकालयों का उपयोग किए बिना क्षणिक निगरानी के मामलों में विशेष रूप से महत्वपूर्ण है। उदाहरण के लिए: एक क्यूबिक वक्र ( सहजता ) के साथ समय के साथ समन्वय में बदलाव के साथ एक संक्रमण का प्रदर्शन करना, या वर्तमान स्थिति को अपडेट करने के लिए एप्लिकेशन लॉजिक के लिए लयबद्ध कॉल के साथ काम करना। कुछ महीने पहले, एक "सप्ताहांत परियोजना" के रूप में, मैंने अपने लिए एक सरल चरण-दर-चरण सीक्वेंसर (विकी) लिखना चुना, और मानक सेटआउट () और सेटइंटरवल () का उपयोग करके मध्यम-कमजोर और कमजोर प्रणालियों पर सटीक समय की भौतिक असंभवता का सामना किया। बेमेल इस मामले में आधे से एक सेकंड में पहुंच गया। एक समाधान की तलाश में, मैं इस विषय पर एक उत्कृष्ट लेख भर आया। और पोस्ट, एक तरह से, इसका एक नि: शुल्क अनुवाद है।

नतीजतन, "सटीक" समय का कार्य वर्तमान से पिछले फ़ंक्शन निष्पादन की देरी को कम करने के लिए किया जाता है। आप बस पुनरावृत्तियों के बीच सिस्टम समय के अंतर को माप सकते हैं और इसे अगली कॉल पर घटा सकते हैं। यह सरल लगता है, और यहाँ कोड है:

var start = new Date().getTime(), time = 0, elapsed = '0.0'; function instance() { time += 100; elapsed = Math.floor(time / 100) / 10; if(Math.round(elapsed) == elapsed) { elapsed += '.0'; } document.title = elapsed; var diff = (new Date().getTime() - start) - time; window.setTimeout(instance, (100 - diff)); } window.setTimeout(instance, 100); 

यह बहुत आसान है, परिणाम देखें। यहां नियमित सुधार और ऑटो में सुधार के साथ टाइमर के काम की तुलना करने के लिए रूसी में टिप्पणियों के साथ JSfiddle पर एक डेमो है ।
इस दृष्टिकोण के बारे में सबसे अच्छी बात यह है कि इसका व्यावहारिक मूल्य नहीं है कि टाइमर कैसे गलत है, क्योंकि बाद में एक छोटी सी निरंतर देरी (पिछले डेमो उदाहरण में 3-4ms की तरह) को बहुत आसानी से मुआवजा दिया जा सकता है। जबकि एक साधारण टाइमर की अशुद्धि प्रकृति में संचयी है, प्रत्येक पुनरावृत्ति के साथ संचित होता है, जो अंत में एक नारकीय ध्यान देने योग्य अंतर की ओर जाता है।

जैसा कि ऊपर उल्लेख किया गया है, मुझे एक ऑडियो एप्लिकेशन लिखते समय इस समस्या का सामना करना पड़ा। अनुप्रयोग, यह निश्चित रूप से बहुत जोर से कहा गया है, बल्कि सिर्फ एक और शैक्षिक मिनी-प्रोजेक्ट है। सामग्री का अध्ययन करने के बाद, यह कोड लिखा गया था:

 //    "play/stop",     function preciousTimer (step) { //    ,  DateStamp   var start = new Date().getTime(), time = 0, /*            ,     (    )*/ it = 0; function instance () { //   time += step; //  var diff = (new Date().getTime()- start) - time; //    if (it == 4) { it = 0; /*     ,          . */ if (m == 8) { m = 0; }; for (var i = 0; i < 4; i++) { if (noteArr[i][m]) { sound[i].play(); }; }; m++; }; it++; //       , //     if (pause) { return; }; //  ,    window.setTimeout(instance, (step - diff)); }; //      instance(), //      setTimeout(instance, step); }; 

किसी को पहले से ही आश्चर्य था: कॉल स्टैक के अतिप्रवाह के बारे में क्या। इस विशेष मामले में, इसका आकार 10 से 17 पदों तक है, जो किसी भी आधुनिक ब्राउज़र के लिए छोटा है। हालांकि, गति में वृद्धि के साथ, या पुनर्गणना पुनरावृत्तियों की संख्या में वृद्धि के साथ, एक घुट हमला हो सकता है और इसे लागू करने के बारे में सोचना आवश्यक होगा ।टेल () जैसी कॉल। लेकिन यह पूरी तरह से अलग कहानी है।

इसके अलावा, कोई भी मदद नहीं कर सकता है, लेकिन window.performance.now () विधि का उल्लेख करता है, जो एक फ्लोटिंग-पॉइंट नंबर देता है, मिलीसेकंड की महत्वपूर्ण संख्या जो पेज लोड होने के बाद से पारित हो गई है (एक सटीक परिभाषा नहीं) इसलिए, दशमलव बिंदु के बाद, हमारे पास पहले से ही एक सबमिलिसॉकोंड रिज़ॉल्यूशन होगा, जो बहुत अच्छा है । इस मूल्य का उपयोग करना, एक समान विधि द्वारा एक मिलीसेकंड के दसवें हिस्से की सटीकता के साथ बेमेल गणना करना संभव है, और बाद की पुनरावृत्ति को अधिक सटीक रूप से शुरू करना।

आप सीक्वेंसर को यहां देख सकते हैं: stepograph.hol.es (webkit आवश्यक)
पोस्ट में आंशिक रूप से उपयोग किए जाने वाले मूल लेख से लिंक: जावास्क्रिप्ट में सटीक टाइमर बनाना

आपका ध्यान के लिए धन्यवाद!