सीएसएस डिलीवरी को अनुकूलित करना: विलंबित सीएसएस लोडिंग की तकनीक को समझना
वेबसाइट के प्रदर्शन को बेहतर बनाने के लिए, डेवलपर्स अक्सर सीएसएस डिलीवरी को अनुकूलित करते हैं। Google डेवलपर्स दस्तावेज़ में उल्लिखित एक रणनीति में
अनुभाग में महत्वपूर्ण CSS को इनलाइन करना शामिल है, जबकि मूल CSS फ़ाइल की लोडिंग को पृष्ठ लोड होने तक स्थगित करना शामिल है। यह दृष्टिकोण प्रारंभ में आवश्यक स्टाइल के प्रदर्शन को प्राथमिकता देकर रेंडरिंग को अनुकूलित करता है।हालाँकि, यह हमारे सामने सवाल खड़ा करता है: पेज लोड होने के बाद हम एक बड़ी सीएसएस फ़ाइल कैसे लोड कर सकते हैं?
समाधान: बड़ी सीएसएस फ़ाइलों की लोडिंग को स्थगित करना
एक बड़ी सीएसएस फ़ाइल की लोडिंग को स्थगित करने के लिए, हम एक सरल jQuery कोड स्निपेट का उपयोग कर सकते हैं:
function loadStyleSheet(src) { if (document.createStyleSheet){ document.createStyleSheet(src); } else { $("head").append($("<link rel='stylesheet' href='" src " />")); } };
इस फ़ंक्शन को $(document).ready() या window.onload फ़ंक्शन के भीतर कॉल करके, हम पेज लोड होने के बाद सीएसएस फ़ाइल को गतिशील रूप से लोड कर सकते हैं।
विधि सत्यापन
यह सत्यापित करने के लिए कि यह विधि काम करती है, अपने ब्राउज़र में जावास्क्रिप्ट को अक्षम करने का प्रयास करें और फिर पृष्ठ को पुनः लोड करें। यदि लागू स्टाइलशीट के साथ पृष्ठ अभी भी सही ढंग से लोड होता है, तो यह सीएसएस लोडिंग के सफल स्थगन को दर्शाता है।
वैकल्पिक तरीके
सीएसएस लोडिंग को स्थगित करने के लिए वैकल्पिक तरीके हैं, जैसे
अस्वीकरण: उपलब्ध कराए गए सभी संसाधन आंशिक रूप से इंटरनेट से हैं। यदि आपके कॉपीराइट या अन्य अधिकारों और हितों का कोई उल्लंघन होता है, तो कृपया विस्तृत कारण बताएं और कॉपीराइट या अधिकारों और हितों का प्रमाण प्रदान करें और फिर इसे ईमेल पर भेजें: [email protected] हम इसे आपके लिए यथाशीघ्र संभालेंगे।
Copyright© 2022 湘ICP备2022001581号-3