JavaScript ကုဒ်များကို ပုံစံချခြင်းနှင့် ချုံ့ခြင်း
JavaScript ကုဒ်များကို ဖတ်ရှုရလွယ်ကူစေရန် ပြန်လည်ပုံစံချခြင်း သို့မဟုတ် ဝဘ်ဆိုက်များ ပိုမိုမြန်ဆန်စွာ ပွင့်လာစေရန် ဖိုင်အရွယ်အစားကို ချုံ့ခြင်းတို့သည် ဝဘ်ဖွံ့ဖြိုးတိုးတက်ရေး လုပ်ငန်းစဉ်တွင် အရေးကြီးသော အဆင့်များဖြစ်သည်။ ဤကိရိယာသည် JavaScript ကုဒ်များကို စာပိုဒ်ခြားခြင်းနှင့် ကွက်လပ်များထည့်၍ အလှဆင်ပေးနိုင်သလို၊ မလိုအပ်သော စာလုံးများကို ဖယ်ရှားပြီး ဖိုင်အရွယ်အစားကို အသေးဆုံးဖြစ်အောင်လည်း ချုံ့ပေးနိုင်သည်။
အသုံးပြုသူများသည် မိမိတို့၏ JavaScript ကုဒ်များကို ထည့်သွင်းသည့်နေရာတွင် ကူးထည့်၍ဖြစ်စေ၊ ရိုက်ထည့်၍ဖြစ်စေ အသုံးပြုနိုင်သည်။ ထည့်သွင်းနိုင်သည့် အများဆုံး ပမာဏမှာ စာလုံးရေ 3,000,000 အထိ ဖြစ်သည်။ ကုဒ်များကို ထည့်သွင်းပြီးနောက် "Beautify" သို့မဟုတ် "Minify" လုပ်ဆောင်ချက်ကို ရွေးချယ်လုပ်ဆောင်နိုင်ပြီး ရရှိလာသော ရလဒ်ကို သီးခြား output နေရာတွင် ဖော်ပြပေးမည်ဖြစ်ကာ ၎င်းကို ဒေါင်းလုဒ်လုပ်ခြင်း သို့မဟုတ် ကူးယူခြင်းများ ပြုလုပ်နိုင်သည်။
အလှဆင်ခြင်းနှင့် ချုံ့ခြင်းဆိုင်ရာ သတ်မှတ်ချက်များ
ကုဒ်များကို ပြန်လည်ပြင်ဆင်ရာတွင် အောက်ပါရွေးချယ်စရာများနှင့် စည်းမျဉ်းများအတိုင်း လုပ်ဆောင်ပေးသည်။
စာပိုဒ်ခြားခြင်း စနစ် (Indent Style)
ကုဒ်များကို လှပအောင် ပြင်ဆင်သည့်အခါ (Beautifying) အောက်ပါ စာပိုဒ်ခြားခြင်း ပုံစံသုံးမျိုးအနက်မှ တစ်ခုကို ရွေးချယ်နိုင်သည်။
- 2 spaces (ကွက်လပ် ၂ ခု)
- 4 spaces (ကွက်လပ် ၄ ခု)
- Tab
Variable အမည်များ စီမံခန့်ခွဲခြင်း
ကုဒ်များကို ချုံ့သည့်အခါ (Minifying) local variable အမည်များကို မည်သို့ကိုင်တွယ်မည်ကို ရွေးချယ်နိုင်သည်။
- Shorten: Local variable အမည်များကို စာလုံးတစ်လုံးတည်းအဖြစ် ပြောင်းလဲပေးပြီး ဖိုင်အရွယ်အစားကို အသေးဆုံးဖြစ်အောင် ပြုလုပ်ပေးသည်။
- Keep: Variable အမည်များကို မူလအတိုင်း ချန်ထားပေးသဖြင့် ဖိုင်အရွယ်အစား အနည်းငယ် ပိုကြီးနိုင်သော်လည်း ကုဒ်ကို ပြန်လည်ဖတ်ရှုရန်နှင့် debug လုပ်ရန် ပိုမိုလွယ်ကူစေသည်။
ကုဒ်ချုံ့ခြင်း၏ လုပ်ဆောင်ပုံနှင့် ကန့်သတ်ချက်များ
Minify ပြုလုပ်ခြင်းသည် ကုဒ်အတွင်းရှိ မလိုအပ်သော ကွက်လပ်များ၊ မှတ်ချက်များ (Comments) နှင့် အလုပ်မလုပ်သော ကုဒ်များကို ဖယ်ရှားပစ်ခြင်း ဖြစ်သည်။ သို့သော်လည်း မူပိုင်ခွင့်ဆိုင်ရာ /*! … */ license banner များကိုမူ ချုံ့သည့် လုပ်ငန်းစဉ်အတွင်း မပျက်စီးစေဘဲ စနစ်က ထိန်းသိမ်းပေးထားမည် ဖြစ်သည်။
ချုံ့ခြင်း လုပ်ငန်းစဉ်သည် ကုဒ်အတွင်းရှိ မလိုအပ်သော အစိတ်အပိုင်းများကို လုံးဝဖယ်ရှားပစ်ခြင်း ဖြစ်သောကြောင့် မူလ variable အမည်များနှင့် မှတ်ချက်များကို ပြန်လည်ရယူပေးနိုင်ခြင်း မရှိပါ။ ထို့အပြင် ထည့်သွင်းလိုက်သော JavaScript ကုဒ်တွင် အလုပ်လုပ်နိုင်သော ကုဒ်လုံးဝမပါဝင်ပါက "ချုံ့ပြီးနောက် ဘာမျှမကျန်တော့ပါ — ထည့်သွင်းထားသော ကုဒ်တွင် အလုပ်လုပ်နိုင်သော ကုဒ်မရှိပါ။" ဟူသော မက်ဆေ့ဂျ်ကို ပြသမည်ဖြစ်သည်။
စနစ်၏ အခြေအနေပြ မက်ဆေ့ဂျ်များနှင့် အမှားပြင်ဆင်ချက်များ
ကိရိယာကို အသုံးပြုနေစဉ်အတွင်း အောက်ပါအခြေအနေများနှင့် အမှားအယွင်း မက်ဆေ့ဂျ်များကို တွေ့ရှိရနိုင်သည်။
- အဆင်သင့်ဖြစ်မှု အခြေအနေ: ထည့်သွင်းသည့်နေရာတွင် မည်သည့်ကုဒ်မျှ မရှိပါက စနစ်သည် "ready" အခြေအနေတွင်သာ ရှိနေမည်ဖြစ်သည်။
- အရွယ်အစား ကန့်သတ်ချက်: ထည့်သွင်းလိုက်သော JavaScript ကုဒ်သည် စာလုံးရေ 3,000,000 ထက် ကျော်လွန်ပါက "ဤဖိုင်သည် လုပ်ဆောင်ရန် အလွန်ကြီးမားနေပါသည်။ ပိုမိုသေးငယ်သောဖိုင်ဖြင့် ထပ်စမ်းကြည့်ပါ။" ဟူသော အမှားမက်ဆေ့ဂျ်ကို ပြသမည်ဖြစ်သည်။
- အချိန်ကျော်လွန်မှု: ကုဒ်ကို လုပ်ဆောင်ချိန်သည် စက္ကန့် ၂၀ ထက် ကျော်လွန်သွားပါက လုပ်ဆောင်မှုကို ရပ်တန့်မည်ဖြစ်ပြီး "လုပ်ဆောင်ချိန် အလွန်ကြာမြင့်သဖြင့် ရပ်တန့်လိုက်ပါသည် — ပိုမိုသေးငယ်သောဖိုင်ဖြင့် ထပ်စမ်းကြည့်ပါ။" ဟူသော မက်ဆေ့ဂျ်ကို ပြသမည်ဖြစ်သည်။
- Syntax အမှား: ထည့်သွင်းထားသော ကုဒ်တွင် syntax အမှားအယွင်းရှိနေ၍ လုပ်ဆောင်၍မရပါက "ဤ JavaScript ကို လုပ်ဆောင်၍မရပါ။" ဟူသော အမှားမက်ဆေ့ဂျ်ကို ပြသမည်ဖြစ်သည်။
- ချုံ့မှု ရလဒ်ပြသခြင်း: ကုဒ်ကို အောင်မြင်စွာ ချုံ့ပြီးပါက ဖိုင်အရွယ်အစား မည်မျှ ရာခိုင်နှုန်း လျော့ကျသွားသည်ကို "ချုံ့ပြီးပါပြီ — {pct}% ပိုမိုသေးငယ်သွားသည်။" ဟူသော မက်ဆေ့ဂျ်ဖြင့် ဖော်ပြပေးသည်။
- ရှင်းလင်းခြင်း: "ရှင်းလင်းရန်" ခလုတ်ကို နှိပ်ပါက ထည့်သွင်းထားသော ကုဒ်များ၊ ရလဒ်များနှင့် သိမ်းဆည်းထားသော မူကြမ်းများကို လုံးဝဖယ်ရှားပေးမည် ဖြစ်သည်။
ကိုယ်ရေးအချက်အလက် လုံခြုံမှုနှင့် လုပ်ဆောင်မှုစနစ်
သင်ထည့်သွင်းလိုက်သော JavaScript ကုဒ်များကို ပုံစံချခြင်းနှင့် ချုံ့ခြင်း လုပ်ငန်းစဉ်အားလုံးသည် သင့်စက်ရှိ ဘရောက်ဆာ (Browser) ထဲတွင်သာ တိုက်ရိုက်လုပ်ဆောင်ခြင်း ဖြစ်သည်။ မည်သည့်ကုဒ်နှင့် အချက်အလက်ကိုမျှ BroBroGo ဆာဗာသို့ ပေးပို့ခြင်း သို့မဟုတ် Upload တင်ခြင်း လုံးဝပြုလုပ်မည်မဟုတ်ပါ။
မကြာခဏမေးလေ့ရှိသော မေးခွန်းများ (FAQ)
Beautify နှင့် Minify တို့၏ ကွာခြားချက်မှာ အဘယ်နည်း။
Beautify (လှပအောင် ပြင်ဆင်ခြင်း) သည် ကုဒ်များကို ဖတ်ရှုရန်နှင့် အဆင့်ဆင့် စစ်ဆေးရန် လွယ်ကူစေရန် စာပိုဒ်ခြားခြင်းနှင့် ကွက်လပ်ချခြင်းများကို ပြန်လည်လုပ်ဆောင်ပေးပါသည် — ၎င်းသည် ချုံ့ထားသော သို့မဟုတ် ရှုပ်ထွေးအောင် ပြုလုပ်ထားသော ဖိုင်ကို နားလည်ရန် အမြန်ဆုံးနည်းလမ်းဖြစ်သည်။ Minify (ချုံ့ခြင်း) ကမူ ဆန့်ကျင်ဘက်ဖြစ်ပြီး ဖိုင်ကို ပိုမိုမြန်ဆန်စွာ ဒေါင်းလုဒ်လုပ်နိုင်ရန် ကွက်လပ်များ၊ မှတ်ချက်များနှင့် အသုံးမလိုသော ကုဒ်များကို ဖယ်ရှားပေးပါသည်။ ဖတ်ရှုရန်အတွက် Beautify ကိုသုံးပြီး အပြီးသတ်ထုတ်လုပ်ရန်အတွက် Minify ကို သုံးပါ။
ချုံ့ထားသောကုဒ်ကို မူလကုဒ်အတိုင်း ပြန်လည်ပြောင်းလဲနိုင်ပါသလား။
၎င်းသည် စာပိုဒ်ခြားခြင်းနှင့် စာကြောင်းအကွာအဝေးများကို ပြန်လည်သတ်မှတ်ပေးသဖြင့် ကုဒ်၏လုပ်ဆောင်ပုံကို ပြန်လည်ဖတ်ရှုနိုင်သော်လည်း မူလ variable အမည်များ သို့မဟုတ် မှတ်ချက်များကိုမူ ပြန်လည်ရယူနိုင်မည်မဟုတ်ပါ — ချုံ့လိုက်စဉ်ကတည်းက ၎င်းတို့ကို လုံးဝဖယ်ရှားလိုက်ပြီဖြစ်သောကြောင့် မည်သည့်ကိရိယာမျှ ပြန်လည်မရယူနိုင်ပါ။ သင်ရရှိမည့်အရာမှာ ရှင်းလင်းစွာ ပုံစံချထားသော ကုဒ်တူပင် ဖြစ်သည်။
Shorten နှင့် Keep အမည်ရွေးချယ်စရာများသည် မည်သို့လုပ်ဆောင်သနည်း။
စနစ်နှစ်ခုလုံးသည် ကွက်လပ်များ၊ မှတ်ချက်များနှင့် အသုံးမပြုသော ကုဒ်များကို ဖယ်ရှားပေးပြီး သင့်စခရစ်၏ လုပ်ဆောင်ချက်ကို ပြောင်းလဲမည်မဟုတ်ပါ။ Shorten (အတိုချုံ့ခြင်း) စနစ်သည် အသေးငယ်ဆုံးဖိုင်ရရှိရန် local variable များကို စာလုံးတစ်လုံးတည်းအဖြစ် အမည်ပြောင်းလဲပေးပါသည်။ Keep (မူလအတိုင်းထားခြင်း) စနစ်သည် သင့်အမည်များကို မူလအတိုင်း ချန်ထားပေးသဖြင့် ဖိုင်အရွယ်အစား အနည်းငယ် ပိုကြီးနိုင်သော်လည်း ဖတ်ရှုရန်နှင့် debug လုပ်ရန် လွယ်ကူစေပါသည်။