React Build တွင် Cache အလိုအလျောက် Reset လုပ်ခြင်း
Browser များတွင် static file cache ပြဿနာ ရှိသည်ကို သင်သိထားသင့်ပါသည်။ ဤပြဿနာ၏ အဓိကအချက်မှာ performance မြှင့်တင်ရန်အတွက် browser သည် stylesheet၊ script နှင့် image file များကို cache လုပ်သိမ်းထားခြင်း ဖြစ်သည်။
ဆိုလိုသည်မှာ သင်၏ hosting တွင် script သို့မဟုတ် style များကို ပြောင်းလဲပါက၊ ထိုပြောင်းလဲမှုများသည် website သို့ အသစ်ရောက်ရှိလာသူများအတွက်သာ ပေါ်လာမည်ဖြစ်သည်။ ယခင်က website ကိုဝင်ရောက်ကြည့်ရှုဖူးသူ ရှိပြီးသား အုပ်စုသည် cache လုပ်ထားသော code version ကိုသာ တွေ့မြင်ရမည် ဖြစ်သည်။ ဤအခြေအနေသည် လက်မခံနိုင်သော အရာဖြစ်သည်။
ကံကောင်းထောက်မစွာ၊ React တွင် ဤပြဿနာကို အလိုအလျောက် ဖြေရှင်းပေးထားသည်။ အဆိုပါ ဖြေရှင်းချက်မှာ build file များတွင် အမည်နှင့် ဖိုင်အမျိုးအစား extension တို့အပြင် hash ဟုခေါ်သော ကြုံရာစာကြောင်း (random string) တစ်ခု ပါဝင်ခြင်းပင်ဖြစ်သည်။ ထို hash သည် ဖိုင်အတွင်းရှိ အကြောင်းအရာနှင့် ကိုက်ညီသည်။ ဆိုလိုသည်မှာ ဖိုင်အတွင်းရှိ code ကို ပြောင်းလဲလိုက်သောအခါ၊ ၎င်း၏အမည်ထဲရှိ hash သည်လည်း ပြောင်းလဲသွားမည် ဖြစ်သည်။ ဤနည်းဖြင့် browser သည် ၎င်းကို ဖိုင်အသစ်တစ်ခုအဖြစ် ထင်မှတ်ကာ ဒေါင်းလုဒ်ဆွဲသွားမည် ဖြစ်သည်။
ဖိုင်များကို index.html တွင် ချိတ်ဆက်သည့်အခါ ၎င်းတို့၏ hash များကို ကျွန်ုပ်တို့ မြင်တွေ့နိုင်ပါသည်။
<script defer="defer" src="/static/js/main.3dd63bcb.js"></script>
<link href="/static/css/main.f855e6bc.css" rel="stylesheet">
သင်၏ ပရောဂျက်ကို build လုပ်ပါ။ Build ထဲရှိ ဖိုင်များ၌ မည်သည့် hash များရှိသည်ကို လေ့လာပါ။
သင်၏ ပရောဂျက်ကုဒ်ကို မပြောင်းလဲဘဲ build ပြုလုပ်ပါ။ ဖိုင်များ၏ hash များ မပြောင်းလဲကြောင်း သေချာပါစေ။
သင်၏ ပရောဂျက်ကုဒ်ကို ပြောင်းလဲပါ။ Build ပြုလုပ်ပါ။ ဖိုင်များ၏ hash များ ပြောင်းလဲသွားကြောင်း သေချာပါစေ။
