CSS style ကို Html file ရဲ့ <header> tag မှာ ဘာကြောင့်ထည့်ရတာလဲ
- Jun 24, 2021
- 1 min read
Updated: Aug 17, 2022
<header> tag မှာ CSS ကိုကြေငြာသောအခါ CSS style rule က အရင်ဆုံး စ run တယ်။ ဒါကြောင့် userတွေ ဟာသူတို့ရဲ့ Screen မှာတစ်ခုခုပေါ်လာတာကိုမြန်မြန်ဆန်ဆန်ပဲမြင်တွေ့နိုင်ပါတယ် (e.g. background colors)။ Header ထဲမှာ မထည့်ထားဘူဆိုရင်တော့ user က page load စစချင်းမှာ blank screen ကို ခေတ္တမြင်ရမှာဖြစ်ပါတယ်။ ဘာကြောင့်လည်းဆိုတော့ html tag ကို top to bottom rum သွားတဲ့အတွက် ကြောင့်ဖြစ်ပါတယ်။
သင် css tag ကို html file ရဲ့ နေရာတိုင်းတွင် style tag ကိုသုံးနိုင်ပါတယ်။ တစ်ခုတည်းသော risk ကတော့ page tree ထဲတွင် browser များထပ်မံကျလာသည်နှင့်တစ်ပြိုင်နက် reflows / repaints ဖြစ်နိုင်သောကြောင့် page performance ကိုလျော့နည်းစေပါတယ်။
body ထဲမှာ CSS style rule ကိုထည့်တယ်ဆိုတဲ့ အဓိပ္ပါယ်က page ကို loading စစခေါ်ချင်းမှာ CSS style rule ကို နောက်မှခေါ်တယ်ဆိုတဲ့ သဘောတရားပါ။ Browser မှာ interface အရင်စပြီး မြန်မြန်ဆန်ဆန် ပေါ်လာစေပါတယ် (ဆိုလိုသည်မှာ blocking အဆင့်ကိုဖယ်ရှားခြင်း ကိုဆိုလိုပါသည်။ )
အားသာချက်ကတော့ smatt phone များနှင့် web page ကို ကြည့်ရှူသည်အခါ web page content ကို အသုံးပြုသူက မြန်မြန်ဆန်ဆန် မြင်နိုင်ပါသည်။
အကောင်းဆုံးနည်းလမ်းကတော့ small css file တွေကို <head> tag အတွင်းမှာ ထားပြီး JQuery UI CSS ကို body ထဲမှာထားခြင်းက web page ကို desktop ဖြင့်အသုံပြုသူနှင့် smatt phone များနှင့်အသုံးပြုသူတွေက်ပါ အဆင်ပြေစေမယ့်နည်းလမ်းတစ်ခုဖြစ်ပါသည်။
Comments