CSS Loading Scheme for JS Components

During component development, there is usually a CSS file resource.
However, in practice, to reduce the number of requests, this CSS may be merged into the CSS of the page.
So, do I need to include this CSS when writing components?

Response Policy:
Add. Js_xcomponent_css_loadedTo identify whether the CSS corresponding to the component has been loaded.
In the component JS, make a judgment. If CSS is not pre-loaded (including independent pre-loading, or pre-loading is included in other CSS files), load it.
TypicalCodeAs follows:

 <  Html  >  
  <  Head  >  
  <  Link Hrefffff  = "Dddd/panel.css"  REL  = "Stylesheet"  Type  = "Text/CSS"  >  <! --  Not referenced here  -->  
  <  Style  >  
. Js_panel_css_loaded  { Width  :  30px  ;  Display  :  None  ;  }  /*  Use ". js_panel_css_loaded" to indicate that the CSS corresponding to the Panel already exists. */  
. Js_panel  {  /*  More CSS  */  }  
  </  Style  >  
  </  Head >  
  <  Body  >  
  </  Body  >  
  <  Script  Language  = "JavaScript"  Remark  = "Diagram of CSS-related code in the panel component"  > 
(  Function  (){
  /*  *
* Obtain the current style of the element object.
* @ Method getcurrentstyle
* @ Param {element | string | wrap} El Id, element instance or wrap
* @ Param {string} attribute style name
* @ Return {string}
  */  
  VaR Getcurrentstyle  =     Function  (EL, attribute ){
  If  (EL. currentstyle ){
  Return  El. currentstyle [attribute];
}  Else  {
 VaR  Style  =  El. ownerdocument. defaultview. getcomputedstyle (El,  Null  );
  Return  Style  ?  Style. getpropertyvalue (attribute ):  Null ;
}
};

  VaR  El  =  Document. createelement (  '  Div  '  );
Document. Body. appendchild (EL );
El. classname  =  ' Js_panel_css_loaded  '  ;
  If  (Getcurrentstyle (El,  '  Width  '  )  =     ' 30px  '  ) Alert (  '  Panel_css has been loaded and does not need to be loaded.  '  );
  Else  Alert (  '  Panel_css needs to be loaded '  );
Document. Body. removechild (EL );
}());
  </  Script  >  
  </  Html  >