Lorem Picsum या placehold.co जैसी सर्विसेज़ से placeholder इमेज मंगवाने के लिए हर बार इंटरनेट पर एक HTTP रिक्वेस्ट भेजनी पड़ती है — जबकि canvas में सीधे ब्राउज़र में जनरेट की गई placeholder इमेज को किसी बाहरी सर्वर की ज़रूरत ही नहीं पड़ती, जो अस्थिर कनेक्टिविटी वाले इलाक़ों में डेवलपमेंट के लिए एक बड़ा प्रैक्टिकल फ़ायदा है।
placeholder आख़िर क्यों ज़रूरी हैं
सही प्रोपोर्शन वाला placeholder तुरंत यह दिखा देता है कि कंटेंट तय साइज़ की इमेज के आसपास कैसे सेट होता है, बिना डिज़ाइनर या फ़ोटोग्राफ़र से फ़ाइनल ग्राफ़िक का इंतज़ार किए। इससे डेवलपमेंट तेज़ होता है और लेआउट व कंटेंट पर साथ-साथ काम किया जा सकता है।
lorem ipsum जैसा ही मक़सद, बस इमेज के लिए
placeholder इमेज लेआउट के लिए ठीक वही काम करती है जो lorem ipsum टेक्स्ट पैराग्राफ़ के लिए करता है — यह इशारा करता है कि अभी कंटेंट को नहीं, बस शेप को जज करना है। दोनों टूल्स एक ही समस्या हल करते हैं: बिना असली कंटेंट के, जो ध्यान भटका सकता है, प्रोपोर्शन और हायरार्की जज करने लायक़ एक भरा-पूरा लेआउट देना।
बिना असली इमेज के रिस्पॉन्सिवनेस टेस्ट करना
अलग-अलग साइज़ और प्रोपोर्शन के placeholder यह वेरिफ़ाई करने में मदद करते हैं कि लेआउट अलग-अलग स्क्रीन पर कैसा बर्ताव करता है — क्या इमेज हॉरिज़ॉन्टल की बजाय स्क्वेयर होने पर लेआउट टूटता है, या विंडो रीसाइज़ होने पर क्रॉप सही से काम करता है या नहीं।
यह क्यों ज़रूरी है
- असली ग्राफ़िक तैयार होने से पहले लेआउट को सही साइज़ की इमेज से तेज़ी से भरना।
- अलग-अलग प्रोपोर्शन वाली इमेज पर लेआउट की रिस्पॉन्सिवनेस टेस्ट करना।
- फ़ाइनल कंटेंट का इंतज़ार किए बिना क्लाइंट या टीम को पेज की संरचना दिखाना।
प्लेसहोल्डर फ़ॉर्मैट: SVG बनाम रास्टर इमेज
प्लेसहोल्डर्स को रास्टर इमेज (PNG, JPEG) या SVG के तौर पर जनरेट किया जा सकता है — SVG एक वेक्टर फ़ॉर्मैट है जो क्वालिटी खोए बिना स्केल होता है। एक SVG प्लेसहोल्डर आमतौर पर चुने गए साइज़ से बेपरवाह सिर्फ़ कुछ किलोबाइट्स का होता है, क्योंकि यह पिक्सल डेटा स्टोर करने की बजाय ज्यामितीय आकार और टेक्स्ट को डिस्क्राइब करता है। जब पेज की लोडिंग परफ़ॉर्मेंस टेस्ट करने के लिए भविष्य की असली इमेज के फ़ाइल साइज़ को क़रीब से सिमुलेट करना हो, तो रास्टर फ़ॉर्मैट ज़्यादा उपयोगी होता है।