यह कहते हुए कि एसवीजी दस्तावेज़ के शीर्ष पर ब्लॉक को निश्चित रूप से काम करता है। इसके कुछ फायदे भी हैं, जैसे कि कोई HTTP अनुरोध करने की आवश्यकता नहीं है, ग्राफिक्स ड्राइंग के लिए सभी जानकारी पृष्ठ पर सही है। लेकिन, इसके कुछ नुकसान भी हैं। वह सभी जानकारी दस्तावेज़ से प्रत्येक पृष्ठ पर ब्राउज़र द्वारा पार्स की जानी चाहिए। यह एक अलग दस्तावेज नहीं है जो पहले से ही ग्राहक द्वारा कैश किया जा सकता है, जैसे अन्य संपत्ति हो सकती है। और कैश की बात करें, यदि आपकी साइट HTML (आमतौर पर एक अच्छा विचार) को कैश करती है, तो आप इस "पेज कैश ब्लोट" पर विचार कर सकते हैं क्योंकि हर एक कैश्ड पेज में कोड का यह बड़ा दोहराव ब्लॉक शामिल है - सर्वर कैश का बहुत कुशल उपयोग नहीं।
अच्छी खबर यह है कि हम एसवीजी को किसी बाहरी फ़ाइल को ब्लॉक कर सकते हैं, और इसे वैसे ही इस्तेमाल कर सकते हैं जैसे हम एक छवि या किसी अन्य संपत्ति को बनाते हैं।
जब हम इसका उपयोग करते हैं, तो फ़ाइल पथ इस प्रकार होगा:
यह जानना महत्वपूर्ण है: इस पर क्रॉस-डोमेन प्रतिबंध कठिन हैं। यहां तक कि CORS हेडर मेरे अनुभव में आपकी मदद नहीं करेंगे। तो कोई सीडीएन (कोडपैन पर भी नहीं खेल सकता है, और निश्चित रूप से एक फ़ाइल में नहीं खेल सकता है: // URL)।
जानने के लिए एक और महत्वपूर्ण बात: इस काम के लिए आपको निश्चित रूप से xmlns विशेषता की आवश्यकता है जैसा कि, आपका एसवीजी डीपीएस ब्लॉक शुरू होना चाहिए:
मैं इस धारणा के तहत था कि आपको HTML5 दस्तावेज़ में (उसी तरह जिस तरह से आपको s पर प्रकारों की आवश्यकता नहीं है) की आवश्यकता नहीं है , लेकिन शायद इसलिए कि यह फ़ाइल अब HTML5 दस्तावेज़ की सीमा में नहीं है (यह बाह्य रूप से संदर्भित होने के नाते), आपको इसकी आवश्यकता है।
उस कारण से, इसके लिए डेमो यहाँ है।
समान रूप से जानना महत्वपूर्ण है: IE का कोई भी संस्करण इसका समर्थन नहीं करता है (इस प्रकाशन के समय 11 तक)। लेकिन इसे काम करने का एक तरीका है, अनिवार्य रूप से एसवीजी की थोड़ी मात्रा में अजाक्सिंग करके और जहां आवश्यकता होगी, वहां डालने से यह समर्थित "सामान्य" इनलाइन एसवीजी बनाता है। ब्राउज़रस्टैक का उपयोग करके इंटरनेट एक्सप्लोरर में यह काम करने और परीक्षण करने में हमें एक गर्म मिनट लगता है, लेकिन अंततः हम इसे प्राप्त करते हैं।
फ़ाइलें
- 16-svg4everybody.js
- 16-svg-defs-test.svg