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

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

Thomas Steiner

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

प्रॉपर्टी इस्तेमाल करना
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 प्रॉपर्टी को डैनियल मर्फ़ी ने आधिकारिक तौर पर लॉन्च किया था.