लेख निर्देशिका
WordPressपृष्ठ रेन्डरिङ विधिहरूको गति बढाउन जाभास्क्रिप्टको अल्छी लोडिङ।
JavaScript को Defer गुण के हो?
सबैले सायद यस अवस्थाको सामना गरेका छन्:
हेडमा N स्क्रिप्टहरू छन्, र जब स्क्रिप्टहरू लोड हुन्छन्, पृष्ठ रेन्डरिङ अवरुद्ध हुन्छ, जुन सामान्यतया खाली हुन्छ।
अवश्य पनि, हामी फुटरमा स्रोत कोडमा लिपि राखेर यसको वरिपरि प्राप्त गर्न सक्छौं।
यद्यपि, केही जटिल विकास वातावरणले यो सरल कार्यलाई विशेष गरी जटिल बनाउन सक्छ।
यस बिन्दुमा हामी Defer गुण प्रयोग गर्न सक्छौं, जुन JavaScript मा एक अपेक्षाकृत दुर्लभ गुण हो।
तपाईंले यसलाई कहिल्यै प्रयोग गर्न सक्नुहुन्न, तर यो परिचय पढेपछि, म पक्का छु कि तपाईंले यसलाई छोड्नुहुने छैन।
यसको मुख्य कार्य भनेको सम्पूर्ण पृष्ठ लोड भएपछि स्क्रिप्टलाई पार्स गर्न दिनु हो, यसलाई लोडमा पार्स गर्नुको सट्टा, जसले केवल घटना-ट्रिगर गरिएको JavaScript समावेश गर्ने स्क्रिप्टहरूको लागि पूर्ण पृष्ठ लोड गति प्रदान गर्दछ।
हो, यदि स्क्रिप्ट ट्यागमा डिफर एट्रिब्युट छ भने, यो हेडमा राखिएको भए पनि HTML पृष्ठ पार्स गरेपछि कार्यान्वयन हुनेछ, जुन पृष्ठको फेदमा लिपि राख्ने जस्तै हो।
अवश्य पनि, ढिलाइको प्रयोग पनि सीमित छ, सामान्यतया 2 बिन्दुहरूमा ध्यान दिनुहोस्:
1) स्थगित स्थगित प्रकार स्क्रिप्ट ब्लकमा document.write आदेशलाई कल नगर्नुहोस्;
- किनभने document.write ले प्रत्यक्ष आउटपुट प्रभाव उत्पादन गर्नेछ।
2) कुनै पनि तत्काल कार्यान्वयन लिपिहरू सहित, डिफर स्क्रिप्टहरूमा ग्लोबल चर वा प्रकार्यहरू प्रयोग नगर्नुहोस्।
WordPress मा प्रयोग गरिएको स्क्रिप्टमा Defer विशेषता थप्नुहोस्
WordPress मा, हामी कसरी स्वचालित रूपमा WordPress द्वारा प्रयोग गरिएको स्क्रिप्टहरूमा Defer विशेषता थप्न सक्छौं?
हामी हालको थिमको functions.php फाइलमा निम्न कोड थप्न सक्छौं ▼
add_filter( 'clean_url', 'wpcwl_defer_script',11,1);
function wpcwl_defer_script( $url ){
if(strpos($url, '.js') === false){
return $url;
}
return "$url' defer='defer";
};- माथिको कोडले मात्र काम गर्दछ, अनुसारवर्डप्रेस द्वारा पेश गरिएको जाभास्क्रिप्ट कोडप्रभावकारी हुनेछ।
सावधानी
प्रत्यक्ष पूर्वावलोकन व्यवस्थापन खाली देखाउन सक्छ:
यदि तपाइँ माथिको कोड प्रयोग गर्नुहुन्छ भने, जब तपाइँ वास्तविक-समय पूर्वावलोकन व्यवस्थापन (रूप → अनुकूलन) खोल्नुहुन्छ, यसले खाली देखाउन सक्छ, त्यसैले कृपया यसलाई उपयुक्त रूपमा प्रयोग गर्नुहोस्।
जब वास्तविक-समय पूर्वावलोकन व्यवस्थापन आवश्यक हुन्छ, माथिको कोड टिप्पणी गर्नुहोस्, र अनुकूलन पूरा भएपछि टिप्पणी गरिएको कोड मेटाउनुहोस्।
PHP टिप्पणी कोड उदाहरण:
/* 这里是代码 */
आशा चेन वेइलियाङ ब्लग ( https://www.chenweiliang.com/ ) साझा गरियो "पृष्ठ रेन्डरिङको गति बढाउन WordPress लेजी लोड जाभास्क्रिप्ट कसरी बनाउने? , तपाईंलाई मद्दत गर्न।
यस लेखको लिङ्क साझा गर्न स्वागत छ:https://www.chenweiliang.com/cwl-954.html