-webkit-backface-visibility

Question

का अंतर्निहित जादू मुझे पता होना चाहिए कि क्यों webkit-backface-visibility उस उद्देश्य के एस्पिरिन की तरह है जो सभी प्रकार की विषम समस्याओं को हल करता है या इससे भी बदतर होता है, जो ज्यादातर कलाकृतियों और झटके से संबंधित होते हैं।

मैंने पढ़ा है और समझ लिया है कि वास्तव में backface-visibility क्या है: यह स्क्रीन का सामना नहीं करते समय गीलेर 3 डी घुमावदार वस्तुओं को नियंत्रित करता है। वहाँ एक अच्छा, straighforward डेमो here

है लेकिन मैं उत्सुक हूँ क्यों, हर मैं सीएसएस दुनिया में अजीब खामियों है, पूरी तरह से 3 डी के लिए असंबंधित रोटेशन और उनके छिपा backfaces, समस्याग्रस्त परत को backface-visibility लागू करने या में से एक अपने पूर्वजों आमतौर पर चीजों को और खराब करने में मदद करता है, लेकिन शायद ही कभी कुछ भी नहीं करता है। मैं चीज़ों के बारे में

• एनिमेशन की तरह बात कर रहा हूँ
• फिक्स्ड परतों झिलमिलाते z- सूचकांक समस्याओं
• प्रदर्शन: कोई नहीं <> दिखाई झिलमिलाहट और कलाकृतियों झिलमिलाहट
• स्क्रॉल

दिलचस्प बात यह है और हमेशा मेरे विनम्र अनुभव में, backface-visibility:hidden फिक्स्ड-पोजिशनिंग से संबंधित सामानों को हल करने के लिए जाता है, और backface-visibility:visible झिलमिलाहट के लिए "सर्वश्रेष्ठ" है। दिलचस्प बात यह है कि क्रोम और सफारी में साइड इफेक्ट अलग हैं, लेकिन लड़के हैं!

मैं एक दृश्य HTML निर्माता में काम कर रहा हूं, इसलिए परिस्थितियों में मेरे पास झिलमिलाहट/कलाकृतियों बल्कि जटिल हैं (यानी कई परतों पर एक एनीमेशन, निश्चित तत्वों के पीछे एक स्क्रॉलिंग div, जेड-इंडेक्स के साथ निश्चित पर पूर्ण। ..)

कोई भी मुझे प्रबुद्ध कर सकता है?

Answer 1

मुझे यकीन है कि जादू की किस तरह आप के बारे में बात कर रहे हैं नहीं कर रहा हूँ, लेकिन वहाँ कुछ मामलों में जहां सीएसएसbackface-visibility संपत्ति एक परत को डोम तत्व को बढ़ावा देने के इतना है कि ब्राउज़र GPU की adventage ले जा सकते हैं मदद कर सकते हैं उस तत्व को प्रस्तुत करते समय।

नोट: केवल hidden मूल्य visible पर एक परत को बढ़ावा देगा।

इसके अलावा ऐसे मामले भी हैं जहां यह संपत्ति तत्वों के चारों ओर जंजीर किनारों को ठीक कर सकती है। GPU प्रतिपादन के लिए सभी धन्यवाद।

कुछ अन्य सीएसएस गुण है कि translateZ(0) या translate3d(0,0,0) की तरह एक ही बात कर रहे हैं। ये सभी हैक्स हैं, और नई सीएसएस संपत्ति will-change के साथ repalaced जाएगा।

आप सीएसएस के साथ एनिमेशन कर रहे हैं, प्रदर्शन के मामले में सबसे अच्छा विकल्प केवल इन सीएसएस गुणों को बदलने के लिए है: transforms और opacity। लेकिन यह परिवर्तन का विषय है और ब्राउज़र लगातार बदल रहे हैं ताकि भविष्य में यह भी बदल सके। लक्ष्य एनिमेट करते समय हर सीएसएस संपत्ति को यथासंभव चिकनी बनाना (आदर्श रूप से 60 एफपीएस पर) बनाना है।मुझे पता है कि क्रोम टीम इस पर बहुत मेहनत कर रही है, लेकिन अन्य विक्रेताओं के बारे में निश्चित नहीं है।