အခမဲ့ စာရိုက်နှုန်းစမ်းသပ်စက် (WPM)

မည်သို့ အလုပ်လုပ်သည်

စာရိုက်မြန်နှုန်း စမ်းသပ်မှုသည် React state နှင့် အချိန်ယူရန် performance.now() ကို သုံး၍ browser ထဲတွင် လုံးဝ အလုပ်လုပ်သည် — server၊ upload၊ ပြင်ပ ဝန်ဆောင်မှု မရှိပါ။ Keystroke များကို အချိန်နှင့်တပြေးညီ အမျိုးအစားခွဲ၍ ရေတွက်ပြီး WPM၊ တိကျမှုနှင့် တည်ငြိမ်မှုကို Monkeytype က အများသိအောင် ဖော်ပြထားသော အက္ခရာအခြေခံ ဖော်မြူလာများနှင့် တူညီစွာ တွက်ချက်သည်။

1. 1
   စကားလုံးစာရင်း local ဖြင့် load လုပ်သည်

   ဘာသာစကား ရွေးလိုက်သောအခါ static JSON ဖိုင်တစ်ခုမှ word pool ကို ရယူပြီး component state တွင် သိမ်းထားသည်။ ထို့နောက် စာသားစမ်းသပ်ချက် တည်ဆောက်ရန် စကားလုံးများကို ကျပန်း ရွေးချယ်သည်၊ ပုဒ်ဖြတ်ပုဒ်ရပ် သို့မဟုတ် ဂဏန်းများ ဖွင့်ထားပါက ဖန်တီးစက်သည် comma၊ အဆုံးသတ်အမှတ်များနှင့် ဂဏန်း token များကို ဖြစ်နိုင်ချေအလိုက် ထည့်သွင်းသည်။
2. 2
   Keystroke များကို စက္ကန့်အလိုက် ရေတွက်သည်

   ဝှက်ထားသော input element တစ်ခုသည် အက္ခရာတိုင်းကို ဖမ်းယူသည်။ Keystroke တစ်ခုစီသည် စက္ကန့်တစ်ခုစီ bucket counter ကို တိုးပေးပြီး အက္ခရာတစ်ခုစီကို ပစ်မှတ်နှင့် ချက်ချင်း နှိုင်းယှဉ်၍ မှန်ကန်၊ မှားယွင်း သို့မဟုတ် အပို ဟု အမျိုးအစားခွဲသည်။ Timer သည် performance.now() ကို တိကျမှုအတွက် သုံး၍ setInterval မှတစ်ဆင့် ၁ စက္ကန့်အလိုက် အလုပ်လုပ်သည်။
3. 3
   အချက်အလက်များကို raw keystroke data မှ တွက်ချက်သည်

   စမ်းသပ်မှု အဆုံးတွင် net WPM ကို လုံးဝမှန်ကန်သော စကားလုံးများနှင့် ၎င်းတို့နောက်ပါ space များပါဝင်သော အက္ခရာများမှ ကျော်လွန်သော စက္ကန့်ဖြင့် စား၍ တွက်ချက်ပြီး standard 5-characters-per-word ယူနစ်သို့ ပြောင်းလဲသည်။ Raw WPM သည် error များအပါအဝင် keystroke တိုင်းကို ရေတွက်သည်။ တည်ငြိမ်မှုသည် စက္ကန့်အလိုက် raw sample များကို coefficient of variation တွက်ရန် သုံးပြီး kogasa smoothing ဖော်မြူလာ (100 × (1 − tanh(cov + cov³/3 + cov⁵/5))) ကို အသုံးပြု၍ 0–100 score ကို ထုတ်ပေးသည်။
4. 4
   ရလဒ်ဇယားကို Canvas ပေါ်တွင် render လုပ်သည်

   WPM-over-time နှင့် raw-WPM-over-time series များကို HTML Canvas element ပေါ်တွင် 2D Context API ကို သုံး၍ ဆွဲသည်။ သင့်ရလဒ်ကို export လုပ်သောအခါ တူညီသော Canvas API သည် 820×460 ပုံတစ်ပုံ (chart၊ ခေါင်းစီးအချက်အလက်များနှင့် libratool.com attribution အပါအဝင်) ကို render လုပ်ပြီး canvas.toBlob() မှတစ်ဆင့် PNG အဖြစ် ပေးပို့သည်။

ဆက်နွှယ်သော ကိရိယာများ