आने वाले समय में, डिसप्ले मोड के हिसाब से तैयारी की जा रही है

डिसप्ले के खास मोड से निपटने के लिए, PWA "display_override" प्रॉपर्टी इस्तेमाल कर सकता है.

थॉमस स्टाइनर
थॉमस स्टाइनर
Twitter GitHub Glitch Mastodon होम पेज

वेब ऐप्लिकेशन मेनिफ़ेस्ट एक JSON फ़ाइल होती है. यह ब्राउज़र को आपके प्रोग्रेसिव वेब ऐप्लिकेशन के बारे में बताती है. साथ ही, यह भी बताती है कि उपयोगकर्ता के डेस्कटॉप या मोबाइल डिवाइस पर इंस्टॉल किए जाने पर यह कैसे काम करना चाहिए. display प्रॉपर्टी की मदद से, यह तय किया जा सकता है कि आपका ऐप्लिकेशन लॉन्च होने पर कौनसा ब्राउज़र यूज़र इंटरफ़ेस (यूआई) दिखे. उदाहरण के लिए, आप पता बार और ब्राउज़र Chrome को छिपा सकते हैं. गेम खेलने की सुविधा भी, फ़ुल स्क्रीन मोड में लॉन्च की जा सकती है. रीकैप के रूप में हम आपको बता दें कि यहां वे डिसप्ले मोड दिए गए हैं जिनकी जानकारी लेख लिखे जाते समय दी गई थी.

प्रॉपर्टी इस्तेमाल
fullscreen बिना किसी ब्राउज़र यूज़र इंटरफ़ेस (यूआई) के वेब ऐप्लिकेशन खोलता है और उपलब्ध डिसप्ले एरिया का पूरा इस्तेमाल करता है.
standalone इससे वेब ऐप्लिकेशन, स्टैंडअलोन ऐप्लिकेशन की तरह दिखता है. यह ऐप्लिकेशन, ब्राउज़र से अलग अपनी विंडो में चलता है. साथ ही, यह ब्राउज़र के स्टैंडर्ड यूज़र इंटरफ़ेस (यूआई) एलिमेंट को छिपा देता है, जैसे कि यूआरएल बार.
minimal-ui यह मोड, standalone की तरह ही है. हालांकि, उपयोगकर्ता को नेविगेशन को कंट्रोल करने के लिए, यूज़र इंटरफ़ेस (यूआई) एलिमेंट का कम से कम सेट उपलब्ध कराता है. जैसे, 'वापस जाएं' और 'फिर से लोड करें'.
browser सामान्य ब्राउज़र अनुभव.

ये डिसप्ले मोड, अच्छी तरह से तय की गई फ़ॉलबैक चेन ("fullscreen" → "standalone" → "minimal-ui" → "browser") के हिसाब से होते हैं. अगर कोई ब्राउज़र किसी दिए गए मोड के साथ काम नहीं करता, तो वह चेन में अगले डिसप्ले मोड पर वापस चला जाता है.

display प्रॉपर्टी की कमियां

हार्ड-वायर वाली फ़ॉलबैक चेन में समस्या तीन गुना है:

  • अगर किसी ब्राउज़र पर "minimal-ui" काम नहीं करता है, तो डेवलपर "browser" डिसप्ले मोड में ज़बरदस्ती हटाए बिना "minimal-ui" का अनुरोध नहीं कर सकता.
  • डेवलपर के पास क्रॉस-ब्राउज़र अंतरों को हैंडल करने का कोई तरीका नहीं होता. उदाहरण के लिए, अगर ब्राउज़र "standalone" मोड के लिए विंडो में वापस जाएं बटन शामिल करता है या बाहर रखता है.
  • मौजूदा व्यवहार की वजह से, पुराने सिस्टम के साथ काम करने की सुविधा वाले नए डिसप्ले मोड को शामिल करना नामुमकिन हो जाता है. ऐसा इसलिए होता है, क्योंकि टैब किए गए ऐप्लिकेशन मोड जैसे एक्सप्लोरेशन की फ़ॉलबैक चेन में स्वाभाविक जगह नहीं होती.

display_override प्रॉपर्टी

इन समस्याओं को display_override प्रॉपर्टी से हल किया जाता है, जिसे ब्राउज़र display प्रॉपर्टी से पहले मानता है. इसकी वैल्यू उन स्ट्रिंग का क्रम होती है जिन्हें ऑर्डर में शामिल माना जाता है. इस पर सबसे पहले काम करने वाला डिसप्ले मोड लागू किया जाता है. अगर इनमें से कोई भी काम नहीं करता, तो ब्राउज़र display फ़ील्ड का फिर से आकलन करता है.

नीचे दिए गए उदाहरण में, डिसप्ले मोड फ़ॉलबैक चेन इस तरह होगी. (इस लेख में, "window-controls-overlay" के बारे में जानकारी नहीं दी गई है.)

  1. "window-controls-overlay" (पहले, display_override देखें.)
  2. "minimal-ui"
  3. "standalone" (display_override खत्म होने पर, display को आकलन करें.)
  4. "minimal-ui" (आखिर में, display फ़ॉलबैक चेन का इस्तेमाल करें.)
  5. "browser"
{
  "display_override": ["window-controls-overlay", "minimal-ui"],
  "display": "standalone",
}

पुराने सिस्टम के साथ काम करते रहने के लिए, आने वाले समय में डिसप्ले मोड को सिर्फ़ display_override की वैल्यू के तौर पर स्वीकार किया जाएगा, लेकिन display को नहीं. ऐसे ब्राउज़र जो display_override के साथ काम नहीं करते, वे फिर से display प्रॉपर्टी का हिस्सा बन जाते हैं. साथ ही, display_override को अज्ञात वेब ऐप्लिकेशन मेनिफ़ेस्ट प्रॉपर्टी के तौर पर अनदेखा कर देते हैं.

लोगों का आभार

display_override प्रॉपर्टी को डेनियल मर्फ़ी ने औपचारिक तौर पर तैयार किया था.