क्या इसकी दृश्यता को टॉगल करने से पहले डीओएम तत्व की दृश्यता की जांच करना उचित है? या यह समयपूर्व अनुकूलन है?

Question

निम्नलिखित jQuery कोड पर विचार करें:

if ($(this).is(':hidden')) { 
    $(this).show(); 
} 

मेरे प्रश्न:

• यह शो() आदेश जारी करने से पहले तत्व की दृश्यता के लिए जाँच करने के लिए सार्थक है?
  • यानी क्या डोम डीओएम की तुलना में अधिक महंगा लिखता है, और क्या इस पैटर्न में एक छोटा प्रदर्शन अनुकूलन शामिल है?
• या कोई उपयोगिता की दृश्यता जांच नहीं है, और यह केवल बिना शर्त के क्लीनर कोड होगा, शो() कमांड जारी करें?

Answer 1

यदि आप इसे दिखाना चाहते हैं, तो मैं यह देखने के लिए परेशान नहीं होगा कि यह छिपा हुआ है - मैं इसे दिखाऊंगा। मुझे लगता है कि शुरू करने के लिए सशर्त चेक न करने के लिए एक छोटा सा लाभ होगा, लेकिन मुझे पूरा भरोसा है कि यह काफी नगण्य हो सकता है।

मैंने एक प्रदर्शन परीक्षण बनाया है जो 25% तेज निष्पादन में कोई जांच परिणाम इंगित करता है। आप http://jsperf.com/is-hidden-check पर इसे ऑनलाइन देख सकते हैं (और इसे कुछ ब्राउज़रों में परीक्षण कर सकते हैं)।

Answer 2

आपकी दृश्यता जांच कुछ प्रयासों को बचा सकती है क्योंकि यह .show() को जारी नहीं करेगा अगर यह वास्तव में छुपा नहीं है।

तो मुझे लगता है कि इसके साथ जाना

Answer 3

आप, सबसे अच्छे गति में एक अत्यंत कम से कम वृद्धि देने इसके संभावित यह और भी हमेशा व्यवहार नहीं हो सकता है के अलावा आप यह करना चाहते हैं के रूप में:

Source:

कैसे: jQuery 1.3.2 में छुपा निर्धारित किया गया था। एक तत्व छुपा हुआ माना जाता है यदि यह या उसके माता-पिता दस्तावेज़ में कोई स्थान नहीं लेते हैं। सीएसएस दृश्यता को ध्यान में नहीं रखा जाता है (इसलिए $(elem).css('visibility','hidden').is(':hidden') == false)।

दृश्यता की जांच अविश्वसनीय रूप से जटिल नहीं है, लेकिन आईएमएचओ भी इस अंश से पता चलता है कि यह बिल्कुल मामूली नहीं है। जबकि आप यह सुनिश्चित करने के मुद्दे से निपट सकते हैं कि :hidden का उपयोग करते समय आपकी दृश्यता जांच ठीक से काम करती है, हर बार जब आप यह सुनिश्चित करना चाहते हैं कि यह कोड सही तरीके से काम कर रहा है, तो आप केवल 5 मिलीसेकंड भूल सकते हैं जिनके पास आपके पास मौका हो सकता है और इसके बजाय अपने आप को कोड को समझने के लिए बिताए गए समय को बचाएं और इस क्षेत्र के साथ हर बार दस्तावेज की जांच करें।

बस सादे पुराने show() का उपयोग करें; अगर पहले से चेक करने का कोई कारण था, तो मुझे पूरा भरोसा है कि अच्छे ओल 'लोग जो jQuery बनाते हैं, या तो कहीं भी दस्तावेज़ों में ऐसा करने की सिफारिश प्रदान करते हैं या show विधि/चेक में हार्डकोड किया गया है: डी