⏱️ ไม้บรรทัดเวลาออนไลน์พร้อมตัวจับเวลาช่วง

เกี่ยวกับ

ภายใต้พื้นหลัง มีสถานะทั้งหมด 3 อย่าง: ค่า 'elapsed' ที่สะสมเป็นมิลลิวินาที, 'startAt' ที่บันทึกค่า performance.now() ทันทีที่คุณกด Start และ 'running' ที่เป็นสถานะ boolean ฟังก์ชันที่สร้างค่าที่แสดงบนหน้าจอคือ 'elapsed' บวกกับความแตกต่างระหว่างเวลาปัจจุบันกับ 'startAt' หากสถานะ 'running' เป็นจริง ฟังก์ชันนี้จะถูกเรียกทุก 30 มิลลิวินาทีเพื่อทำให้หน้าจออัปเดต แต่ช่วงเวลาของ interval นั้นไม่มีข้อมูลเกี่ยวกับเวลา แต่เป็นเพียงตัวกระตุ้นในการอัปเดตหน้าจอเท่านั้น นี่คือวิธีที่ถูกต้องในการสร้างเครื่องมือนับเวลา และช่วยหลีกเลี่ยงข้อผิดพลาดทั่วไปที่เกิดขึ้นเมื่อตัวนับเวลาเพิ่มค่าคงที่ทุก tick และค่อยๆ คลาดเคลื่อนเมื่อ tick ถูกเลื่อน ข้าม หรือรวมกัน

การเลือกใช้การออกแบบนี้ยังส่งผลเมื่อคุณเปลี่ยนไปใช้แท็บอื่น เบราว์เซอร์จะลดความถี่ของ timer ในแท็บหลังเพื่อประหยัดพลังงานและแบตเตอรี่ ซึ่งทำให้ setInterval ที่ตั้งไว้ทุก 30 มิลลิวินาทีอาจถูกเลื่อนไปเป็นทุก 1 วินาทีหรือช้ากว่านั้นขณะที่แท็บไม่ได้รับการใช้งาน แต่ในกรณีของเครื่องมือนี้ การลดความถี่นั้นส่งผลเพียงแค่การอัปเดตค่าที่แสดงบนหน้าจอเท่านั้น ค่าทางคณิตศาสตร์ (current timestamp - start timestamp + ค่าที่สะสมไว้ก่อนหน้านี้) ไม่ได้สนใจว่ามีการอัปเดตกี่ครั้งที่ถูกละเว้น เมื่อกลับมาที่แท็บนี้ ค่าที่แสดงบนหน้าจอจะแสดงค่าที่ถูกต้องทันที ไม่มีการสูญเสียหรือเพิ่มเวลาจากการลดความถี่ แต่ความลื่นไหลในการดูเวลาอาจลดลงขณะที่คุณกำลังใช้แท็บอื่น

การใช้ `performance.now()` แทนที่จะใช้ `Date.now()` คือการเลือกที่ถูกต้องสำหรับงานนี้ ไม่ใช่รายละเอียดที่ไม่สำคัญ `Date.now()` สะท้อนเวลาของระบบปฏิบัติการ ซึ่งอาจกระโดดไปข้างหน้าหรือถอยหลังได้ เช่น หลังจากคอมพิวเตอร์ตื่นจากโหมดสลีปและซิงค์กับเซิร์ฟเวอร์ NTP หรือการเปลี่ยนเวลาในระบบด้วยตนเอง หรือการปรับเปลี่ยนเวลาตามฤดูกาล `performance.now()` ถูกกำหนดให้เป็นนาฬิกา monotonic ซึ่งเพิ่มขึ้นอย่างสม่ำเสมอและไม่ได้รับผลกระทบจากความปรับปรุงเหล่านี้ ซึ่งเป็นคุณสมบัติที่เครื่องมือนับเวลาต้องการ และนาฬิกาแบบ wall-clock ทั่วไปไม่มีคุณสมบัติเช่นนี้

ข้อจำกัดที่แท้จริงคือการเก็บข้อมูล และไม่มีการเก็บข้อมูลใดๆ เลย เครื่องมือนี้จะเก็บค่า 'elapsed' และรายการ 'laps' เป็นตัวแปรทั่วไปในหน่วยความจำของหน้าเว็บ ไม่มีการเรียกใช้ localStorage หรือฟังก์ชัน `Playground.store()` ของเว็บไซต์นี้ที่เครื่องมืออื่นๆ ของ Toolio ใช้เพื่อให้สามารถทำงานต่อได้หลังจากโหลดหน้าใหม่ ซึ่งหมายความว่าการรีเฟรชหน้า ปิดแท็บ หรือคลิกไปยังเครื่องมืออื่นจะลบเวลาที่กำลังนับและรายการที่บันทึกไว้ทันทีและถาวร ไม่มีการ 'เริ่มต้นเซสชันก่อนหน้า' ไม่มีการซิงค์ข้อมูลระหว่างอุปกรณ์ และไม่มีการสำรองข้อมูล เพราะไม่มีข้อมูลใดถูกเขียนลงในระบบจัดเก็บเลย หากคุณต้องการบันทึกประวัติการนับเวลาจริงๆ เช่น บันทึกการออกกำลังกายหรือเวลาในการนำเสนอ ให้คัดลอกตัวเลขหรือถ่ายภาพหน้าจอไว้ก่อนที่คุณจะออกจากหน้านี้ เพราะหน้านี้จะไม่จำข้อมูลเหล่านั้นไว้ให้คุณ

วิธีใช้งาน

1. คลิกปุ่ม "Start" — ปุ่มจะเปลี่ยนชื่อเป็น "Pause" ทันที และนาฬิกาบนหน้าจอจะเริ่มเพิ่มขึ้นตามเวลาจริง ทุก 30 มิลลิวินาที
2. คลิกปุ่ม "Lap" ที่ใดก็ได้ขณะที่กำลังทำงาน เพื่อจับภาพเวลาที่ผ่านไปในขณะนั้น รายการใหม่จะถูกจัดอยู่ด้านบนของรายการล็อป และแสดงทั้งเวลาที่ผ่านมาตั้งแต่ล็อปก่อนหน้า (split) และเวลาสะสมทั้งหมด (total)
3. คลิกปุ่มเดียวกันอีกครั้ง ซึ่งตอนนี้มีชื่อว่า "Pause" เพื่อหยุดการอัปเดตหน้าจอ — เวลาที่ผ่านไปจะถูกเก็บไว้ภายใน ไม่มีการสูญเสียใดๆ และปุ่มจะกลับมาเป็น "Start" อีกครั้ง
4. คลิก "Start" อีกครั้งเพื่อเริ่มต้นนับเวลาต่อจากจุดที่คุณหยุดไว้ ไม่ใช่เริ่มต้นจากศูนย์
5. คลิก "Reset" เพื่อเริ่มต้นหน้าจอใหม่ ลบรายการที่บันทึกไว้ทั้งหมด และคืนค่าปุ่มกลับเป็นป้ายเริ่มต้น — นี่คือวิธีเดียวที่คุณจะเริ่มเซสชันใหม่ได้ เพราะไม่มีฟังก์ชันการบันทึกข้อมูลใดๆ ที่จะปกป้องข้อมูลเดิมก่อนที่คุณจะเริ่มใหม่

คำถามที่พบบ่อย

เครื่องมือนี้วัดเวลาอย่างไรภายใต้พื้นหลัง?

เครื่องมือนี้จะอ่านค่า `performance.now()` ทันทีที่คุณกด Start และเก็บค่าที่ได้ไว้ จากนั้นค่าที่แสดงบนหน้าจอจะเป็นเพียง "เวลาที่สะสมไว้" บวกกับ "ค่า performance.now() ปัจจุบัน ลบด้วยค่าที่เก็บไว้" ซึ่งจะถูกคำนวณใหม่ทุก 30 มิลลิวินาทีเมื่อมีการอัปเดตหน้าจอ มันจะไม่เพิ่มค่าคงที่ +30 มิลลิวินาทีเข้ากับค่าที่สะสมอยู่ทุกครั้ง ซึ่งเป็นวิธีที่ใช้ในเครื่องมือนับเวลาแบบทำเองที่มักจะเกิดความคลาดเคลื่อนเมื่อเวลาผ่านไป

เวลาจะเกิดอะไรขึ้นหากฉันเปลี่ยนไปใช้แท็บเบราว์เซอร์อื่นขณะที่เครื่องมือนี้กำลังทำงาน?

แท็บในพื้นหลังจะถูกจำกัด — เบราว์เซอร์สามารถลดความถี่ของ `setInterval` ที่ตั้งไว้ทุก 30 มิลลิวินาทีให้เหลือเพียงทุก 1 วินาทีหรือช้ากว่านั้นเพื่อประหยัดพลังงานและแบตเตอรี่ ดังนั้นค่าที่แสดงบนหน้าจออาจดูเหมือนหยุดนิ่งหรือกระโดดขณะที่คุณไม่ได้อยู่ที่นั่น แต่เนื่องจากเครื่องมือนี้จะคำนวณเวลาที่ผ่านไปจากความแตกต่างของ timestamp แทนที่จะนับจำนวน tick ที่เกิดขึ้นจริง การกลับมาที่แท็บนี้จะทำให้การอัปเดตหน้าจอครั้งต่อไปแสดงค่าที่ถูกต้องทันที คุณจะไม่สูญเสียหรือได้รับเวลาเพิ่มจากความถี่ที่ถูกจำกัด — แต่ความลื่นไหลในการดูเวลาอาจลดลงขณะที่คุณไม่ได้อยู่ที่นั่น

ทำไมถึงใช้ performance.now() แทนที่ Date.now() — มันมีความสำคัญจริงหรือไม่?

ใช่ `Date.now()` สะท้อนเวลาของระบบปฏิบัติการ ซึ่งอาจกระโดดไปข้างหน้าหรือถอยหลังได้ เช่น หลังจากคอมพิวเตอร์ตื่นจากโหมดสลีปและซิงค์กับเซิร์ฟเวอร์ NTP หรือหากเวลาในระบบถูกเปลี่ยนด้วยตนเอง `performance.now()` เป็นนาฬิกา monotonic ที่เพิ่มขึ้นอย่างสม่ำเสมอและไม่ได้รับผลกระทบจากความปรับปรุงเหล่านี้ ซึ่งเป็นคุณสมบัติที่เครื่องมือนับเวลาต้องการ และเครื่องมือนี้ใช้นาฬิกาที่ถูกต้องสำหรับงานนี้

เครื่องมือนี้เก็บเวลาที่ผ่านไปหรือประวัติการล็อปไว้ที่ใด?

ไม่มี — และต่างจากเครื่องมืออื่นๆ ของ Toolio เครื่องมือนี้ไม่ได้ใช้ localStorage ของเบราว์เซอร์เลยสำหรับข้อมูลนี้ ทุกสิ่งที่คุณเห็นจะอยู่ในหน่วยความจำของหน้าเว็บเท่านั้นตราบเท่าที่แท็บนี้ยังเปิดอยู่ หากคุณรีเฟรชหน้า ปิดแท็บ หรือเปลี่ยนไปใช้เครื่องมืออื่น เวลาที่ผ่านไปและรายการที่บันทึกไว้จะหายไปทั้งหมด ไม่มีการยกเลิกหรือการบันทึกอัตโนมัติ เพราะไม่มีข้อมูลใดถูกเขียนลงในระบบจัดเก็บเลย หากคุณต้องการบันทึกประวัติการล็อปจริงๆ ให้คัดลอกตัวเลขหรือถ่ายภาพหน้าจอไว้ก่อนที่คุณจะออกจากหน้านี้ เพราะหน้านี้จะไม่จำข้อมูลเหล่านั้นไว้ให้คุณ

มีข้อจำกัดในการบันทึกล็อปหรือไม่ และตัวเลขสองตัวในแต่ละแถวของล็อปหมายถึงอะไร?

ไม่มีข้อจำกัด — รายการจะเพิ่มขึ้นเรื่อยๆ โดยล็อปใหม่จะอยู่ด้านบนของรายการ แต่ละแถวแสดงตัวเลขสองตัว: ค่า split ที่แสดงเป็นสีเด่น ซึ่งคือเวลาที่ผ่านมาตั้งแต่ล็อปก่อนหน้า และค่า total ที่แสดงเป็นสีเทา ซึ่งคือเวลาสะสมตั้งแต่คุณกด Start คู่ของตัวเลขเหล่านี้ช่วยให้คุณประเมินช่วงเวลาเฉพาะได้ — เช่น ช่วงเวลาออกกำลังกายหนึ่งช่วง หรือส่วนหนึ่งของบทพูด — โดยไม่สูญเสียการติดตามเวลาทั้งหมด

เครื่องมือนี้จะอัปโหลดข้อมูลของฉันหรือไม่?

ไม่ ทุกอย่างทำงานในเบราว์เซอร์ของคุณ ดังนั้นข้อมูลของคุณจึงไม่เคยออกจากอุปกรณ์ของคุณ — และหลังจากโหลดหน้าแล้วยังใช้งานแบบออฟไลน์ได้ด้วย