⏱️ लैप टाइमर के साथ ऑनलाइन स्टॉपवॉच

परिचय

बैक साइड में तीन राज्य होते हैं: मिलिसेकंड में एक एकाग्रता `elapsed` मान, एक `startAt` स्नैपशॉट जो `performance.now()` के बर्तमान मोमेंट पर लिया जाता है जब आप Start बटन दबाते हैं, और एक बूलियन `running` फ्लैग। स्क्रीन पर नंबर उत्पन्न करने वाला फ़ंक्शन बस `elapsed` प्लस होता है, अगर `running` है, तो अब और `startAt` के बीच के अंतर। `setInterval` इस फ़ंक्शन को हर 30 मिलीसेकंड पर बुलाता है बस डिस्प्ले को फिर से ड्रॉ करने के लिए - इंटरवल के आपके टाइमिंग के कोई जानकारी नहीं होती, यह बस एक रिफ्रेश ट्रिगर है। यह स्टॉपवॉच बनाने के सही तरीका है, और यह सीधे उस आम बग को टालता है जहां एक टाइमर हर टिक पर एक निश्चित वृद्धि जोड़ता है और एक बार टिक देर हो जाते हैं, छोड़ दिए जाते हैं, या संयोजित हो जाते हैं तो धीरे-धीरे चला जाता है।

इस डिज़ाइन चुनाव यह होता है जब आप दूसरे टैब पर जाते हैं। ब्राउज़र बैकग्राउंड टैब के टाइमर को धीमा कर देता है CPU और बैटरी को बचाने के लिए - एक `setInterval` जो 30 मिलीसेकंड के लिए निर्धारित किया गया है, टैब अदृश्य होने पर एक सेकंड या उससे भी धीमा हो सकता है। इस स्टॉपवॉच पर यह केवल एक बार दिखाई देने वाले नंबर को कितनी बार फिर से ड्रॉ करने के तरीके को प्रभावित करता है; नीचे के गणित (वर्तमान टाइमस्टैंप माइनस स्टार्ट टाइमस्टैंप, प्लस जो भी पहले से बैंक किया गया था) रिफ्रेश के कितने छोड़ दिए गए थे उसके बारे में कोई देखभाल नहीं करता। टैब पर वापस आओ और अगली रीड्राउ बिल्कुल सही एलप्सेड टाइम दिखाती है - धीमाकरण से कुछ भी खो नहीं जाता या जोड़ दिया जाता है, केवल दूसरी चीजों के देखते रहते हुए सेकंड के बढ़ने की चलनता कम हो जाती है।

`performance.now()` के बजाय `Date.now()` का उपयोग इस काम के लिए सही मूल घटक है, एक अप्रासंगिक विवरण नहीं। `Date.now()` आपके सिस्टम के वॉल क्लॉक को दर्शाता है, और वॉल क्लॉक छलांग ले सकते हैं - एक लैपटॉप स्लीप से जाग जाता है और एक NTP सर्वर से सिंक करता है, एक मनमाना घड़ी बदल, या एक दिन के बचत रेज़ॉल्यूशन बदल जाता है, सभी `Date.now()` को एक सेशन के बीच में आगे या तक पीछे छलांग ले सकते हैं। `performance.now()` को एक मोनोटोनिक क्लॉक के रूप में परिभाषित किया गया है: यह केवल एक स्थिर दर पर हमेशा ऊपर बढ़ता है और उन सुधारों से प्रभावित नहीं होता है, जो स्टॉपवॉच के लिए ठीक गारंटी है और एक सामान्य वॉल-क्लॉक टाइमर के पास नहीं होता है।

ईमानदार सीमा टिकट रखने की है, और कोई नहीं है। यह बनाव `elapsed` और `laps` सरणी को पृष्ठ मेमोरी में एक साधारण जावास्क्रिप्ट चर रखता है - स्रोत में कहीं भी `localStorage` या इस वेबसाइट के `Playground.store()` सहायता के कोई बुलावा नहीं है जो अन्य Toolio उपकरणों द्वारा एक रिलोड के बाद जीवित रहने के लिए उपयोग किया जाता है। यह मतलब है कि पृष्ठ को रिफ्रेश करना, टैब को बंद करना, या दूसरे उपकरण पर जाने के लिए क्लिक करना आपके चल रहे समय और हर रिकॉर्ड किए गए लैप को तुरंत और स्थायी रूप से धो देता है। कोई "पिछले सेशन को फिर से शुरू करो" नहीं है, कोई उपकरणों के बीच सिंक नहीं है, और कुछ भी बैकअप के लिए नहीं है, क्योंकि पहले से कोई भी चीज कभी भी संग्रहण में लिखी गई है। अगर आपके लिए एक लैप इतिहास वास्तव में महत्वपूर्ण है - एक वर्कआउट लॉग, एक सेट प्रेजेंटेशन टाइमिंग - तो नंबरों को नोट करें या अपने द्वारा जाने से पहले स्क्रीनशॉट लें, क्योंकि यह पृष्ठ उन्हें आपके लिए याद रखता नहीं है।

कैसे उपयोग करें

1. "सुरू करें" पर क्लिक करें — बटन तुरंत "रोकें" लेबल के साथ बदल जाता है और स्क्रीन पर घड़ी वास्तविक समय में बढ़ना शुरू कर देती है, जो प्रत्येक 30 मिलीसेकंड पर पुनर्निर्मित होती रहती है।
2. चलने के दौरान किसी भी समय "Lap" पर क्लिक करके वर्तमान लैप समय का स्नैपशॉट बनाएं; नई प्रविर्ति लैप सूची के ऊपर चिपक जाती है और इसमें इसके स्प्लिट (पिछले लैप से बीता समय) और इसकी कुल कुलाम दिखाई देता है।
3. उसी बटन पर फिर से क्लिक करें, जो अब "Pause" लेबल के साथ है, ताकि डिस्प्ले बर्फ के रूप में जमा रहे — बीते समय आंतरिक रूप से संरक्षित रहता है, कुछ भी खो नहीं जाता है, और बटन "Start" में वापस लौट जाता है।
4. "सुरू करें" पर एक बार फिर क्लिक करें ताकि आप शून्य से नहीं बल्कि आपने छोड़े बिना बिल्कुल उसी जगह से गिनना शुरू कर सकें।
5. डिस्प्ले को शून्य करने, रिकॉर्ड किए गए लैप को हटाने और दोनों बटनों को उनके शुरुआती लेबल पर वापस लाने के लिए "रीसेट" पर क्लिक करें — यह एक नई सेशन शुरू करने के लिए एकमात्र तरीका है, क्योंकि पुराने सेशन को सुरक्षित करने के लिए कोई सेव फीचर नहीं है।

सामान्य प्रश्न

इस स्टॉपवॉच के अंदर के तरीके से समय कैसे मापता है?

यह बटन पर क्लिक करते ही एक बार `performance.now()` पढ़ता है और इस संख्या को संग्रहित कर देता है। इसके बाद, स्क्रीन पर दिखाई गई कीमत केवल "समय जो अब तक बैंक में है" और "वर्तमान `performance.now()` में से उस संग्रहित शुरुआती टाइमस्टैम्प को घटाया गया है" के योग के बराबर होती है - जो कि प्रत्येक 30ms रीपेंट पर ताजा गणना की जाती है। यह सिर्फ एक तिरछा नहीं जोड़ता है जो एक चलते हुए कुल में प्रत्येक टिक पर एक निश्चित +30ms के रूप में, जो अनेक स्वयं बनाए गए टाइमर धीरे-धीरे सिंक से बाहर चले जाते हैं।

अगर यह चल रहा है और मैं दूसरे ब्राउज़र टैब पर चला जाता हूँ तो समय क्या होता है?

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

क्यों performance.now() का उपयोग Date.now() के बजाय किया जाता है — क्या यह वास्तव में महत्वपूर्ण है?

हाँ। `Date.now()` आपके सिस्टम के वॉल क्लॉक को दर्शाता है, जो कि आगे या पीछे भी लूप कर सकता है - उदाहरण के लिए, एक लैपटॉप सोते हुए जाग जाता है और एक NTP सर्वर के साथ सिंक करता है, या यदि सिस्टम क्लॉक को मनमाने तौर पर बदल दिया जाता है। `performance.now()` एक मोनोटोनिक क्लॉक है जो केवल एक स्थिर दर पर बढ़ता रहता है और उन सही से बचता है, जो एक स्टॉपवॉच के लिए आवश्यक है और यह निर्माण इसके लिए सही एक का उपयोग करता है।

क्या यह मेरा लगे हुए समय या लैप इतिहास कहीं भी बचाता है?

नहीं - और कुछ अन्य Toolio उपकरणों के विपरीत, यह डेटा के लिए ब्राउज़र के localStorage का उपयोग नहीं करता। आप देखते हैं सभी चीजें केवल इस टैब के मेमोरी में रहती हैं जब तक यह टैब खुला रहता है। पृष्ठ को रिफ्रेश करें, टैब बंद करें या दूसरे उपकरण पर जाएं, और आपका अतीत के समय और हर लैप अच्छी तरह से गायब हो जाएगा; कोई अव्यवहार नहीं होता और कोई स्वचालित सहेज नहीं होता, क्योंकि पहले से ही कुछ भी स्टोरेज में लिखा नहीं जाता। यदि आपको रिकॉर्ड की आवश्यकता है, तो छोड़े बिना संख्याओं को नीचे लिखें या उनका स्क्रीनशॉट लें।

क्या लैप्स पर कोई सीमा है, और प्रत्येक लैप पंक्ति पर दो संख्याओं का क्या अर्थ है?

कोई सीमा नहीं है — सूची बस बढ़ती रहती है, जहां नए सबसे हालिया लैप के ऊपर लगा रहता है। प्रत्येक पंक्ति दो संख्याएं दिखाती है: एक अक्सर रंग में आपके पिछले लैप से बीते समय का एक भाग, और ग्रे रंग में कुल समय, जो आपने Start दबाए के बाद बीता हुआ समय है। इस जोड़े के साथ आप एक विशिष्ट अंतराल के बारे में निर्णय ले सकते हैं — एक वर्कआउट अंतराल, एक बातचीत का एक भाग — बिना पूरे दौड़ के ट्रैक रखे।

क्या यह टूल मेरा डेटा अपलोड करता है?

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