हम विकास मोड में IE के लिए बहुत सीएसएस लोड करते हैं

ओस्ट्रोवका में , साइट को विकसित करने के लिए एक मॉड्यूलर संरचना का उपयोग किया जाता है। तार्किक तत्वों में मार्कअप, शैलियाँ और जावास्क्रिप्ट फाइलें शामिल होती हैं।

इस तरह की संरचना में संक्रमण के बाद, कुछ महीनों तक सब कुछ ठीक था। फिर IE में, विभिन्न ब्लॉकों की शैलियों गायब होने लगीं, और हमने महसूस किया कि हमें सभी बड़ी परियोजनाओं के साथ एक समस्या थी - IE9 और छोटी में, 31 से अधिक सीएसएस फ़ाइल एक बार में लोड नहीं होती है।

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

समाधान का अर्थ ज्ञात और सफलतापूर्वक लागू किया गया है। उदाहरण के लिए, यैंडेक्स में, सीएसएस में एक बैकएंड पर, प्रत्येक 31 के ब्लॉक में फाइलें आयात की जाती हैं।

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

कार्य एल्गोरिथ्म था:

1. दस्तावेज़ से सभी शैली फ़ाइलों को हटा दें
2. 31 वीं आयात के साथ शैली टैग पीढ़ी।

डेमो ।

आधे साल के लिए हमने सब कुछ डिबग कर दिया है, और स्क्रिप्ट प्रकाश को देखने के लिए तैयार है। बस इसे उत्पादन पर उपयोग न करें - यह IE में पुराने पृष्ठ के प्रतिपादन को बहुत धीमा कर देगा।

कैसे उपयोग करें

जावास्क्रिप्ट फ़ाइल को पेज से कनेक्ट करना आवश्यक है।

और सभी सीएसएस फाइलों के बाद, कोड लिखें जो केवल IE में दिखाई देगा:

<!--[if IE]> <script> fixIESheets(); </script> <![endif]--> 

यह स्क्रिप्ट संभव css'ok की संख्या को 961 तक बढ़ाएगी। मुझे उम्मीद है कि यह सभी के लिए पर्याप्त है।