👩‍👧‍👧 👋🏾 🅰️ जेएस और सीएसएस फ़ाइलों के लिए लोडिंग समय घटाएं ❎ 👩🏽‍🎓 🚣

हर जावास्क्रिप्ट एप्लिकेशन डेवलपर जल्दी या बाद में प्लग-इन जेएस और सीएसएस फ़ाइलों के लिए एक बड़े (अपेक्षाकृत परिमित) लोड समय की समस्या का सामना करता है। यह समस्या, जैसा कि आप जानते हैं, दो कारणों से आती है: बड़ी संख्या में कनेक्टेड फ़ाइलें (ब्राउज़र में एक साथ डाउनलोड की गई फ़ाइलों की संख्या पर सीमा होती है, इसलिए जब तक एक डाउनलोड नहीं किया जाता है, तब तक ब्राउज़र दूसरे को डाउनलोड करना शुरू नहीं करता है) और पुस्तकालयों के बड़े आकार का उपयोग किया जाता है (प्रोटोटाइप, एक्सटज, आदि) डी।)

समाधान मैन्युअल रूप से सभी सम्मिलित फ़ाइलों को एक में संयोजित करने के लिए हो सकता है, लेकिन यह आगे फ़ाइल समायोजन को असुविधाजनक बनाता है, इसलिए परिणामी फ़ाइल के स्वत: संयोजन और संपीड़न का उपयोग करना उचित है। लेकिन, संपीड़न सर्वर पर लोड बढ़ाता है, इसलिए कैशिंग का उपयोग करना उचित है, और फाइलों को बदलने की संभावना को ध्यान में रखना ...

डेवलपर नील्स लेहेंर (http://rakaz.nl/) ने अपनी स्क्रिप्ट में वर्णित प्रक्रिया के कार्यान्वयन का प्रस्ताव दिया: rakaz.nl/projects/combine/combine.phps

स्क्रिप्ट को सेट करना आसान है और आपकी साइट के रूट में Comb.php फ़ाइल का पता लगाने में शामिल हैं, जावास्क्रिप्ट, css और कैश फ़ाइलों के लिए अलग-अलग डायरेक्टरीज़ बनाते हैं और इन रास्तों को Comb.php फ़ाइल में लिखते हैं।

एक संयोजन से एक सापेक्ष रास्तों का उदाहरण। php स्थान:

$cachedir = dirname(__FILE__) . '/cache'; 
      

        
        
        
      

     $cssdir = dirname(__FILE__) . '/css'; 
      

        
        
        
      

     $jsdir = dirname(__FILE__) . '/script';

इसके बाद, आपको निम्नलिखित सामग्रियों के साथ .htaccess फ़ाइल बनाना या संशोधित करना होगा:

RewriteEngine On 
      

        
        
        
      

     RewriteBase / 
      

        
        
        
      

     RewriteRule ^css/(.*\.css) /combine.php?type=css&files=$1 
      

        
        
        
      

     RewriteRule ^javascript/(.*\.js) /combine.php?type=javascript&files=$1

यदि .htaccess फ़ाइल पहले से मौजूद है और इसका उपयोग RewriteEngine द्वारा किया जाता है, तो पहले दो पंक्तियों की आवश्यकता नहीं है।

उपयोग उदाहरण:

<script type="text/javascript" src="script/yui-utilities.js,ext-yui-adapter.js,ext-all.js"></script> 
      

        
        
        
      

     <link rel="stylesheet" type="text/css" href="css/ext-all.css,vista.css,main.css">

कितना वर्णित समाधान आप प्रभावी रूप से अपने लिए तय कर सकते हैं।

जेएस और सीएसएस फ़ाइलों के लिए लोडिंग समय घटाएं

More articles: