इमेज कॉन्टेंट डिलीवरी नेटवर्क (सीडीएन), इमेज को ऑप्टिमाइज़ करने के मामले में बेहतरीन हैं वेब पर. अपनी वेबसाइट को किसी इमेज सीडीएन पर स्विच करने से, इमेज में 40 से 80% की बचत फ़ाइल साइज़ देता है और ज़्यादातर मामलों में वे आपकी इमेज को बिल्ड-टाइम इमेज ऑप्टिमाइज़ेशन स्क्रिप्ट.
सीडीएन इमेज क्या होती है?
इमेज सीडीएन, इमेज को बदलने, ऑप्टिमाइज़ करने, और डिलीवर करने में माहिर हैं. आपने लोगों तक पहुंचाया मुफ़्त में इस्तेमाल की गई इमेज को ऐक्सेस करने और उनमें बदलाव करने के लिए, इन्हें एपीआई के तौर पर भी इस्तेमाल किया जा सकता है साइज़ पर असर डाल सकते हैं. इमेज सीडीएन से लोड की गई इमेज के लिए, इमेज के यूआरएल का मतलब है कि सिर्फ़ किस इमेज को लोड करना है, बल्कि साइज़, फ़ॉर्मैट, और क्वालिटी जैसे पैरामीटर भी. इसकी मदद से, इस्तेमाल के अलग-अलग उदाहरणों के लिए, इमेज के अलग-अलग वैरिएशन बनाए जा सकते हैं.
![इमेज सीडीएन और क्लाइंट के बीच अनुरोध/रिस्पॉन्स फ़्लो दिखाता है. साइज़ और फ़ॉर्मैट जैसे पैरामीटर का इस्तेमाल, एक ही इमेज के वैरिएशन का अनुरोध करने के लिए किया जाता है.](https://web.dev/static/articles/image-cdns/image/shows-requestresponse.jpg?authuser=6&hl=hi)
इमेज सीडीएन, बिल्ड-टाइम इमेज ऑप्टिमाइज़ेशन स्क्रिप्ट से अलग होते हैं. ज़रूरत के हिसाब से इमेज के नए वर्शन बना सकता है. इस वजह से, सीडीएन आम तौर पर उन इमेज को बनाने के लिए बेहतर है जो हर व्यक्ति की पसंद के हिसाब से बनाए गए हों बिल्ड स्क्रिप्ट के मुकाबले क्लाइंट होते हैं.
ऑप्टिमाइज़ेशन के विकल्प दिखाने के लिए, इमेज सीडीएन यूआरएल का इस्तेमाल कैसे करते हैं
इमेज सीडीएन में इस्तेमाल किए जाने वाले इमेज यूआरएल, किसी इमेज के बारे में ज़रूरी जानकारी देते हैं और उन्हें लागू किया जाना चाहिए. यूआरएल के फ़ॉर्मैट इस्तेमाल की जा रही इमेज सीडीएन के हिसाब से अलग-अलग होती हैं. हालांकि, हाई लेवल पर उन सभी में मिलती-जुलती सुविधाएं. यहां कुछ सबसे सामान्य सुविधाओं के बारे में बताया गया है.
![इमेज के यूआरएल में आम तौर पर ये कॉम्पोनेंट शामिल होते हैं: ऑरिजिन, इमेज, सुरक्षा कुंजी, और ट्रांसफ़ॉर्मेशन.](https://web.dev/static/articles/image-cdns/image/image-urls-typically-cons-16db5f5e5c5df.jpg?authuser=6&hl=hi)
शुरुआत की जगह
इमेज सीडीएन आपके डोमेन या आपकी इमेज सीडीएन के डोमेन पर मौजूद हो सकता है. तीसरे पक्ष की इमेज सीडीएन आम तौर पर, शुल्क. अपने डोमेन का इस्तेमाल करने से, बाद में इमेज के सीडीएन आसानी से स्विच किए जा सकते हैं, क्योंकि इसके लिए, यूआरएल में बदलाव करने की ज़रूरत नहीं होगी.
पिछले उदाहरण में, सीडीएन के डोमेन ("example-cdn.com") का इस्तेमाल पसंद के मुताबिक बनाया गया सबडोमेन शामिल करें.
इमेज
इमेज सीडीएन को आम तौर पर, उनके यूआरएल से इमेज अपने-आप वापस पाने के लिए कॉन्फ़िगर किया जा सकता है
ज़रूरत होने पर मौजूदा जगहों को चुनें. यह क्षमता अक्सर इसलिए हासिल की जाती है,
इमेज के यूआरएल में मौजूदा इमेज का पूरा यूआरएल शामिल करें
इमेज CDN से जनरेट किया गया. उदाहरण के लिए, आपको
इससे: https://my-site.example-cdn.com/https://flowers.com/daisy.jpg/quality=auto
.
यह यूआरएल, https://flowers.com/daisy.jpg
पर मौजूद इमेज को वापस लाएगा और उसे ऑप्टिमाइज़ करेगा.
हो सकता है कि अनुरोध किया गया फ़ाइल फ़ॉर्मैट (उदाहरण में, JPG)
इमेज फ़ाइल फ़ॉर्मैट (उदाहरण में, WebP) लौटाया गया. content-type
एचटीटीपी
हेडर, ब्राउज़र को बताता है कि यूआरएल किस फ़ॉर्मैट में है, ताकि वह यूआरएल को प्रोसेस कर सके
सही तरीके से काम करना चाहिए. अगर फ़ाइल को डिस्क पर सेव किया जाता है और इसका इस्तेमाल किया जाता है, तो इससे भ्रम की स्थिति बन सकती है
जो फ़ाइल एक्सटेंशन के फ़ॉर्मैट से मेल खाने की उम्मीद करता है.
किसी इमेज सीडीएन में इमेज अपलोड करने का दूसरा तरीका यह है कि उन्हें भेजें को इमेज सीडीएन के एपीआई के लिए एचटीटीपी पोस्ट अनुरोध में सबमिट करें.
सुरक्षा कुंजी
सुरक्षा कुंजी, दूसरे लोगों को आपकी इमेज के नए वर्शन बनाने से रोकती है. यह सुविधा चालू होने पर, किसी इमेज के हर नए वर्शन के लिए सुरक्षा कुंजी.
अगर कोई व्यक्ति इमेज के यूआरएल के पैरामीटर बदलने की कोशिश करता है, लेकिन कोई मान्य सुरक्षा कुंजी उपलब्ध नहीं कराता है, तो नई सुरक्षा कुंजी नहीं बनाई जा सकेगी वर्शन है. आपकी इमेज सीडीएन, जनरेट और ट्रैक करने का काम करता है सुरक्षा कुंजियां हैं.
ट्रांसफ़ॉर्मेशन
इमेज सीडीएन में दसियों और कुछ मामलों में सैकड़ों अलग-अलग इमेज मिलती हैं बदलाव लाने के लिए किया जा सकता है. इन बदलावों की जानकारी यूआरएल स्ट्रिंग में दी जाती है और एक ही समय में कई ट्रांसफ़ॉर्मेशन ऐक्शन का इस्तेमाल करने पर कोई पाबंदी नहीं है. वेब परफ़ॉर्मेंस के लिए साइज़, पिक्सल डेंसिटी, फ़ॉर्मैट, और कंप्रेशन. इन बदलावों की वजह से किसी इमेज सीडीएन पर स्विच करने से, आम तौर पर आपकी साइट की इमेज फ़ाइलें छोटी हो जाती हैं.
ऐसा इसलिए होता है, क्योंकि आम तौर पर परफ़ॉर्मेंस के लिए सबसे अच्छी सेटिंग होती है ट्रांसफ़ॉर्मेशन, कुछ इमेज सीडीएन "ऑटो" के साथ काम करते हैं इन सब के लिए बदलाव लाने के लिए किया जा सकता है. उदाहरण के लिए, यह तय करने के बजाय कि इमेज में बदलाव किया जाए WebP फ़ॉर्मैट में, सीडीएन को अपने-आप सबसे सही फ़ॉर्मैट. इमेज सीडीएन, इमेज को बदलने का सबसे सही तरीका तय कर सकता है दूसरे सिग्नल के साथ-साथ, इन सिग्नल का इस्तेमाल करके:
- क्लाइंट के सुझाव (उदाहरण के लिए, व्यूपोर्ट की चौड़ाई, डीपीआर, और इमेज की चौड़ाई)
Save-Data
हेडर- उपयोगकर्ता-एजेंट हेडर का अनुरोध करें
- Network Information API
उदाहरण के लिए, इमेज सीडीएन, Chrome ब्राउज़र पर AVIF और WebP को Edge के लिए इस्तेमाल कर सकता है और JPEG होना चाहिए. अपने-आप काम करने वाली सेटिंग इसलिए लोकप्रिय हैं, क्योंकि आपको सीडीएन की इमेज का को ऑप्टिमाइज़ करने में माहिर नहीं है. इमेज सीडीएन शुरू होने पर, नई टेक्नोलॉजी अपनाने के लिए अपना कोड बदलने की ज़रूरत हो मदद मिलती है.
इमेज सीडीएन के टाइप
इमेज सीडीएन की दो मुख्य कैटगरी हैं: खुद मैनेज की जाने वाली और कैंपेन को तीसरे पक्ष से मैनेज किया जाता है.
खुद मैनेज की जाने वाली इमेज सीडीएन
खुद मैनेज किए जाने वाले सीडीएन, इंजीनियरिंग स्टाफ़ वाली साइटों के लिए बेहतर विकल्प हो सकते हैं खुद के इन्फ़्रास्ट्रक्चर का रखरखाव करने में सहज महसूस करते हैं.
- थंबर, खुद मैनेज करने वाली सबसे लोकप्रिय वेबसाइट है चित्र CDN. यह ओपन सोर्स और इस्तेमाल के लिए मुफ़्त है. हालांकि, इसमें कम सुविधाएं हैं ज़्यादातर कमर्शियल सीडीएन, और इसके दस्तावेज़ कुछ हद तक सीमित होते हैं. पसंद करने वाली साइटों में Wikipedia, स्क्वेयर और 99डिज़ाइन हैं. नीचे दिए गए लिंक के लिए, Tumbor इमेज सीडीएन इंस्टॉल करने का तरीका देखें उसे सेट अप करने पर निर्देश मिलेंगे.
- इमैजिनरी
- इमेजर
तीसरे पक्ष की इमेज सीडीएन
तीसरे पक्ष की इमेज सीडीएन, इमेज सीडीएन को सेवा के तौर पर उपलब्ध कराते हैं. जिस तरह से क्लाउड सेवा देने वाली कंपनियां, सर्वर और अन्य इन्फ़्रास्ट्रक्चर के लिए शुल्क देकर, इमेज सीडीएन उपलब्ध कराती हैं शुल्क देकर इमेज ऑप्टिमाइज़ेशन और डिलीवरी की सुविधा देते हैं. क्योंकि तीसरे पक्ष की इमेज सीडीएन इस टेक्नोलॉजी को बनाए रखते हैं. आम तौर पर, इनका इस्तेमाल शुरू किया जा सकता है काफ़ी तेज़ी से, हालांकि एक बड़ी साइट का माइग्रेशन पूरा होने में थोड़ा समय लग सकता है लंबा. तीसरे पक्ष की इमेज के सीडीएन की कीमत, आम तौर पर उसके इस्तेमाल के टीयर के आधार पर तय होती है. साथ ही, ज़्यादातर इमेज सीडीएन, फ़्री टीयर या फ़्री ट्रायल उपलब्ध कराते हैं, ताकि आप उन्हें आज़मा सकें उनके प्रॉडक्ट.
कोई इमेज सीडीएन चुनें
इमेज सीडीएन के लिए कई अच्छे विकल्प हैं. कुछ ऐप्लिकेशन में दूसरों से ज़्यादा सुविधाएं होती हैं, लेकिन उनमें से कोई भी आपकी इमेज में बाइट बचाने और इसलिए इमेज को लोड करने में आपकी मदद कर सकता है तेज़ी से लोड होता है. फ़ीचर सेट के अलावा, चुनने के लिए अन्य कारक इमेज सीडीएन के लिए कीमत, सहायता, दस्तावेज़, और सेटअप या माइग्रेशन में आसानी होती है.
सबसे बड़े एलिमेंट को रेंडर करने में लगने वाले समय (एलसीपी) पर असर
इमेज कई वेबसाइटों पर उपयोगकर्ता अनुभव का अहम हिस्सा होती हैं. इसलिए, वे साइट के सबसे बड़े एलिमेंट को रेंडर करने में लगने वाले समय के अहम फ़ैक्टर. यहां दी गई हैं अगर आप इमेज सीडीएन इस्तेमाल करने का फ़ैसला लेते हैं, तो इन बातों का ध्यान रखें:
- सीडीएन से दिखाई जाने वाली इमेज, क्रॉस-ऑरिजिन सर्वर से आ सकती हैं. यह सर्वर ये काम कर सकता है सेटअप करने में लगने वाला समय बढ़ाया जा सकता है. अगर हो सके, तो इमेज का इस्तेमाल करें सीडीएन जो मुख्य ऑरिजिन से प्रॉक्सी करता है, ताकि अतिरिक्त ऑरिजिन न जोड़े जा सकें ब्राउज़र को कनेक्ट करने के लिए किया जा सकता है. इसका असर सेल्फ़-होस्टिंग इमेज जैसा ही है मुख्य ऑरिजिन पर मौजूद है.
"high"
एट्रिब्यूट कीfetchpriority
वैल्यू का इस्तेमाल करें ताकि ब्राउज़र उस इमेज को लोड करना शुरू कर सके किया जा सकता है.- अगर कोई इमेज शुरुआती एचटीएमएल में तुरंत नहीं खोजी जा सकती, तो
rel=preload
आपको एलसीपी उम्मीदवार की इमेज के लिए संकेत देता है, ताकि ब्राउज़र उस इमेज को समय. - अगर आपकी साइट के ऑरिजिन के ज़रिए प्रॉक्सी नहीं की जा सकती और ब्राउज़र को यह पता नहीं चलेगा कि किस इमेज पेज लोड होने के बाद के समय तक लोड होने के लिए, क्रॉस-ऑरिजिन इमेज सीडीएन के साथ जल्द से जल्द कनेक्शन सेट अप करें का इस्तेमाल करें.