नई सीएसएस सुविधाओं में उपसर्ग लगाने का क्या कारण है?

Question

क्या ब्राउज़र के लिए नई सीएसएस सुविधाओं को उपसर्ग करने का एक वैध कारण है, बजाय इसके कि वेबमास्टरों को गैर-उपसर्ग संस्करण का उपयोग करने दिया जाए?

उदाहरण के लिए, पृष्ठभूमि ढाल के लिए एक नमूना कोड इस तरह दिखता है:

#arbitrary-stops {
  /* fallback DIY*/

  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, left top, right top, from(#2F2727), color-stop(0.05, #1a82f7), color-stop(0.5, #2F2727), color-stop(0.95, #1a82f7), to(#2F2727));

  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);

  /* Firefox 3.6+ */
  background: -moz-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);

  /* IE 10 */
  background: -ms-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);

  /* Opera 11.10+ */
  background: -o-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);
}

वेबमास्टर्स को एक ही परिणाम के लिए एक ही कोड को चार बार कॉपी-पेस्ट करने के लिए मजबूर करने का क्या मतलब है?

---

नोट: अक्सर उद्धृत किए जाने वाले कारणों में से एक यह है कि उपसर्ग शैली अस्थायी होने का इरादा है जबकि या तो ब्राउज़र कल्पना को सही ढंग से लागू नहीं करता है, या कल्पना निश्चित नहीं है ।

IMO, यह कारण एक बकवास है:

• यदि ब्राउज़र इंजन कल्पना को सही ढंग से कार्यान्वित नहीं करता है, तो ब्राउज़र का अनुपालन नहीं होगा, चाहे वह इसे किसी गैर-उपसर्ग रूप में लागू नहीं करता हो या इसे पूर्व-निर्मित रूप में लागू नहीं करता हो।
• यदि कल्पना निश्चित नहीं है, तो यह तब हो सकता है जब एक ही नाम के साथ पिछले कार्यान्वयन थे। उदाहरण के लिए यदि CSS2 था linear-gradient, लेकिन CSS3 को linear-gradientअतिरिक्त सुविधाओं के साथ विस्तारित करने का इरादा था , यह अस्थायी रूप से उपसर्ग नया, मसौदा, -css3-<style>कार्यशील CSS2 एक और प्रयोगात्मक CSS3 एक के बीच अंतर द्वारा कार्यान्वयन के लिए चतुर होगा । व्यवहार में, CSS2 के पास linear-gradientया अन्य CSS3 सस्ता माल नहीं है।

मुझे यह भी समझ में आएगा कि यदि अलग-अलग ब्राउज़रों के अलग-अलग कार्यान्वयन प्रारूप थे : उदाहरण के लिए, आइए हम कहते हैं कि फ़ायरफ़ॉक्स आवश्यक है, पाठ छाया के लिए <weight-of-shadow distance-x distance-y color>, जबकि क्रोम की आवश्यकता है <distance-x distance-y weight-of-shadow color>। लेकिन वास्तव में, यह मामला नहीं है; CSS3 के कम से कम सभी नए फीचर्स जो मैंने अब तक इस्तेमाल किए हैं उनमें एक ही प्रारूप था।

Comments

If the browser engine does not implement the spec correctly, the browser will not be compliant- रियल वर्ल्ड में आपका स्वागत है। ™

— रॉबर्ट हार्वे

मैंने ब्राउज़र के बीच गोल सीमाओं के वेरिएंट देखे हैं - विशेषकर जब एक विशिष्ट कोने को असाइन करने की कोशिश कर रहा हो। इस मामले में, मुझे लगता है कि राउंडर सीमाओं के लिए विनिर्देशन लिखे जाने से पहले ब्राउज़र विशिष्ट कार्यान्वयन लागू थे।

— होरूसकोल

Answer 1

इस W3C नोट के अनुसार :

भविष्य की सीएसएस सुविधाओं के साथ टकराव से बचने के लिए, CSS2.1 विनिर्देश सीएसएस के लिए मालिकाना और प्रयोगात्मक एक्सटेंशन के लिए एक उपसर्ग सिंटैक्स रखता है ।

W3C प्रक्रिया में उम्मीदवार अनुशंसा चरण तक पहुंचने वाले विनिर्देश से पहले, सीएसएस सुविधा के सभी कार्यान्वयन प्रायोगिक माने जाते हैं। CSS कार्य समूह अनुशंसा करता है कि कार्यान्वयन W3C वर्किंग ड्राफ्ट में ऐसी विशेषताओं के लिए एक वेंडर-प्रीफ़िक्स किए गए सिंटैक्स का उपयोग करें। यह मसौदे में भविष्य में बदलाव के साथ असंगतताओं से बचा जाता है।

---

आप यहाँ और यहाँ CSS की स्थिति का अनुसरण कर सकते हैं ।

Answer 2

मुझे यह भी समझ में आएगा कि क्या अलग-अलग ब्राउज़रों के अलग-अलग कार्यान्वयन प्रारूप थे ... [ख] वास्तव में, यह मामला नहीं है; CSS3 के कम से कम सभी नए फीचर्स जो मैंने अब तक इस्तेमाल किए हैं उनमें एक ही प्रारूप था।

यह मुझे बताता है कि आप लंबे समय से इस खेल को नहीं खेल रहे हैं।

समस्या यह है कि वेब ब्राउज़र कभी भी एक ही तरीके से नई सुविधाओं को लागू नहीं करते हैं। एक ब्राउज़र कार्यान्वयन सुविधाओं को देखना आम है जो मानकीकृत नहीं किए गए हैं, और इसका परिणाम यह है कि सब कुछ अलग-अलग ब्राउज़रों पर अलग-अलग कार्य करता है।

इतना ही नहीं, नई सुविधाएँ अक्सर छोटी-छोटी होती हैं (हम IE को नाम से पुकारने से बचते हैं), और इसलिए भले ही विभिन्न तत्वों के लिए वाक्यविन्यास समान हो, परिणाम भिन्न होता है।

यह उन डेवलपर्स के लिए सिरदर्द का कारण बनता है जो नई सुविधाओं का उपयोग करने के लिए ट्रिंग कर रहे हैं। अपनी स्टाइलशीट लिखने के बाद, उन्हें जल्दी से पता चलता है कि यह अलग-अलग ब्राउज़रों पर अलग-अलग कारणों से अलग-अलग तरीके से प्रस्तुत करता है।

पहले उपसर्गों के साथ आने से पहले, डेवलपर्स को ब्राउज़रों के बीच पता लगाने योग्य अंतरों पर भरोसा करने के लिए मजबूर किया गया था, अक्सर सीएसएस पार्सर में त्रुटियों का दोहन करके। इसके परिणामस्वरूप इस तरह से घृणा उत्पन्न हुई:

padding: 10px;
width: 200px;
w\idth: 180px;
height: 200px;
heigh\t: 180px;

हैक के ये प्रकार एक डेवलपर के प्रत्येक ब्राउज़र के लिए अपनी स्टाइलशीट को अनुकूलित करने के प्रयास का परिणाम थे, किसी भी प्रकार के आउटलैंडिश तरीकों का उपयोग करके वे पा सकते हैं।

उपसर्गों को मानकीकृत करके, यह डेवलपर्स को उन विशेषताओं का उपयोग करने की अनुमति देता है जो विभिन्न ब्राउज़रों में स्थिर नहीं हैं। -moz-और -webkit-उपसर्गों यह बहुतायत से स्पष्ट है कि लेखक एक शैली है कि केवल कुछ वेब ब्राउज़र में लागू किया जाना चाहिए प्रदान करने के लिए कोशिश कर रहा है बनाते हैं।

एक बार जब सुविधाएँ स्थिर हो जाती हैं और ब्राउज़र समान कार्य करने लगते हैं, तो आप उपसर्ग को हटा सकते हैं और एक बार सुविधा की घोषणा कर सकते हैं।

मुझे लगता है कि यह समझना महत्वपूर्ण है कि उपसर्ग का मतलब यह नहीं है कि आपको हर ब्राउज़र के लिए एक बार शैलियों की घोषणा करनी चाहिए। उपसर्गों का मतलब है कि किसी भी समय अतिरिक्त शैलियों की घोषणा करना चाहिए जो आपको लगता है कि एक वेब ब्राउज़र एक मानक के अनुरूप नहीं है। उदाहरण के लिए, आपके उपरोक्त कोड के बजाय, आपको इसके साथ शुरू करना चाहिए:

 background: linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);

यदि आपको अचानक पता चलता है कि Microsoft एक रैखिक ढाल की सही गणना करने में असमर्थ है, तो आप इस समस्या को ठीक करने के लिए एक उपसर्ग जोड़ सकते हैं:

 /* Friggin IE */
 background: -ms-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);
 background: linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);

हर ब्राउज़र में अचानक आपका पेज एक जैसा दिखता है, इस तथ्य के बावजूद कि उनमें से एक ने चीजों को अलग तरीके से किया था।

आप पाएंगे कि इस सूची में ए लिस्ट के अलावा इस पर बहुत व्यापक तरीके से कवर किया गया है ।

Answer 3

यदि ब्राउज़र इंजन कल्पना को सही ढंग से कार्यान्वित नहीं करता है, तो ब्राउज़र का अनुपालन नहीं होगा, चाहे वह इसे किसी गैर-उपसर्ग रूप में लागू नहीं करता हो या इसे पूर्व-निर्मित रूप में लागू नहीं करता हो।

अंतर यह है कि ब्राउज़र संगतता को नहीं होगा जब यह है करता आज्ञाकारी बन जाते हैं। यदि ब्राउज़र का व्यवहार कल्पना से भिन्न है, तो वे इसे बदलने पर पुराने कोड को नहीं तोड़ेंगे- क्योंकि यह एक नए नाम के तहत सूचीबद्ध है।

Comments

तो क्या आप कह रहे हैं कि मामले में यह आज्ञाकारी नहीं है (या आज्ञाकारी नहीं बनता है) विक्रेता इसे छोड़ देता है, और एक और उपसर्ग संस्करण बनाता है जो आज्ञाकारी है? मैंने सोचा था कि उपसर्गों के संस्करण जहां दूर जाना चाहिए था क्योंकि वे अनुरूप / आधिकारिक हो गए थे?

— जैकब स्कोन

@jschoen: ऐसा कभी नहीं हो सकता है, क्योंकि आप उस विरासत कोड को तोड़ देंगे जो इस पर निर्भर करता है।

— डेडएमजी सेप