मैं ऐसे पृष्ठ में कुछ साधारण क्लाइंट-साइड प्रदर्शन tweaks ढूंढने की कोशिश कर रहा हूं जो लाखों मासिक पृष्ठ दृश्य प्राप्त करता है। मेरे पास एक चिंता है जो सीएसएस सार्वभौमिक चयनकर्ता (*) का उपयोग है।सार्वभौमिक चयनकर्ता का प्रदर्शन प्रभाव क्या है?
उदाहरण के लिए, की तरह एक बहुत ही सरल HTML दस्तावेज़ पर विचार निम्नलिखित:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Example</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph of text.</p>
</body>
</html>
सार्वभौमिक चयनकर्ता ऊपर घोषणा body, h1 और p तत्वों के लिए, के बाद से उन में केवल होते हैं लागू होगी दस्तावेज़।
body, h1, p {
margin: 0;
padding: 0;
}
या यह बिल्कुल वैसा ही शुद्ध प्रभाव होगा:
सामान्य तौर पर, मैं इस तरह के रूप में एक शासन से बेहतर प्रदर्शन देखना होगा?
क्या सार्वभौमिक चयनकर्ता अधिक काम करता है जिसे मुझे पता नहीं हो सकता है?
मुझे एहसास है कि इस उदाहरण में प्रदर्शन प्रभाव बहुत छोटा हो सकता है, लेकिन मुझे ऐसा कुछ सीखने की उम्मीद है जो वास्तविक दुनिया की स्थितियों में अधिक महत्वपूर्ण प्रदर्शन सुधारों का कारण बन सकती है।
मैं दस्तावेज़ में बाद में अन्य शैलियों के साथ सार्वभौमिक चयनकर्ता नियम में शैलियों को ओवरराइड करने का इरादा नहीं रखता - यानी, इसे त्वरित और गंदे रीसेट स्टाइलशीट के रूप में उपयोग करना। मैं वास्तव में सार्वभौमिक चयनकर्ता का उपयोग करने की कोशिश कर रहा हूं जैसा कि मुझे लगता है कि यह इरादा है - एक बार और सभी के लिए दस्तावेज़ में सभी तत्वों के लिए एक नियम सेट लागू करने के लिए।
आखिरकार, मैं यह निर्धारित करने की उम्मीद कर रहा हूं कि क्या सार्वभौमिक चयनकर्ता के बारे में कुछ धीमी गति से धीमा है या अगर यह अत्यधिक दुरुपयोग के कारण खराब रैप है। यदि * { margin: 0; } सचमुच body, h1, p { margin: 0; } के बराबर है, तो यह मेरे प्रश्न का उत्तर देगा, और मैं पूर्व के साथ जाने के बारे में जानूंगा क्योंकि यह अधिक संक्षिप्त है। यदि नहीं, तो मैं समझना चाहता हूं कि सार्वभौमिक चयनकर्ता धीरे-धीरे क्यों प्रदर्शन करता है।
एक प्रदर्शन दृष्टिकोण से, यह _ever__ के लिए एक विशेषता के लिए _ever_ बेहतर है, केवल अंततः इसे फिर से सेट करने के लिए? ब्राउजर डिफॉल्ट सीखना आपको अधिक समय नहीं लगेगा - आप सीएसएस फाइलों को "रीसेट" से संकेत प्राप्त कर सकते हैं, लेकिन मैं वास्तव में एक का उपयोग करने के लिए अब तक नहीं जाऊंगा। ओपन सोर्स ब्राउजर में ओपन सोर्स सीएसएस डिफॉल्ट हैं जिन्हें आप देख सकते हैं। – reisio
मुझे यकीन नहीं है कि आपने मेरा प्रश्न समझा है। मैं रीसेट करने की तलाश नहीं कर रहा हूं और फिर शैलियों को फिर से लागू कर रहा हूं, बल्कि पृष्ठ पर प्रत्येक तत्व के लिए एक नियम लागू करता हूं। मेरा सवाल यह है कि क्या यह सार्वभौमिक चयनकर्ता का उपयोग करने के लिए तकनीकी रूप से समान है क्योंकि यह प्रत्येक तत्व को अलग-अलग चुनने के लिए है, या यदि किसी भी कारण से प्रदर्शन जुर्माना लगाता है। – Bungle
'*' स्पष्ट रूप से स्पष्ट रूप से 'body, h1, p' के बराबर नहीं है। * केवल * कारण यह धीरे-धीरे क्यों करता है क्योंकि आप सब कुछ के लिए शैलियों को लागू करते हैं, जबकि कोई अन्य चयनकर्ता आपको डीओएम में तत्वों के एक विशिष्ट सबसेट तक सीमित करता है। लेकिन असली सवाल यह है कि, क्या यह इतना धीमा है कि एक ब्राउज़र बहुत अधिक शैलियों को लागू करने से उत्तरदायी नहीं होगा? मुझे उस पर बेहद शक़ है। यह भी देखें: [* {बॉक्स-आकार: सीमा बॉक्स} FTW] (http://paulirish.com/2012/box-sizing-border-box-ftw) – BoltClock