Remote Compose के कॉन्सेप्ट और आर्किटेक्चर

Remote Compose, Jetpack की एक लाइब्रेरी है. इसकी मदद से, अपने ऐप्लिकेशन में Compose-स्टाइल वाले एपीआई का इस्तेमाल करके यूज़र इंटरफ़ेस (यूआई) बनाया जा सकता है. साथ ही, इसे सिस्टम प्रोसेस में दिखाया जा सकता है. जैसे, ऐप्लिकेशन विजेट या Wear OS विजेट. आपका ऐप्लिकेशन, यूज़र इंटरफ़ेस (यूआई) को एक कॉम्पैक्ट दस्तावेज़ के तौर पर रिकॉर्ड करता है. साथ ही, होस्ट प्रोसेस में मौजूद प्लेयर उसे रेंडर करता है. इसके अलावा, यह आपके ऐप्लिकेशन को कॉल किए बिना, इंटरैक्शन, स्टेटस में बदलाव, और ऐनिमेशन को स्थानीय तौर पर मैनेज करता है.

इस गाइड में, Remote Compose आर्किटेक्चर के बारे में बताया गया है. साथ ही, यह भी बताया गया है कि यह स्टैंडर्ड Jetpack Compose से किस तरह अलग है. इस गाइड में, कॉम्पोनेंट की मदद से यूज़र इंटरफ़ेस (यूआई) बनाने के बारे में बताया गया है.

रिमोट कंपोज़ के इस्तेमाल के उदाहरण

रिमोट कंपोज़ की सुविधा का इस्तेमाल, किसी भी डिवाइस पर किया जा सकता है. इसके लिए, उस डिवाइस पर YouTube प्लेयर होना चाहिए. Android पर, यह ऐप्लिकेशन विजेट और Wear OS विजेट को बेहतर बनाता है.

यह कैसे काम करता है: तीन ब्लॉक वाला आर्किटेक्चर

रिमोट Compose और स्टैंडर्ड Jetpack Compose के बीच आर्किटेक्चर का बुनियादी अंतर, यूज़र इंटरफ़ेस (यूआई) की परिभाषा को लागू करने से अलग करने में है. इसके लिए, तीन हाई-लेवल ब्लॉक का इस्तेमाल किया जाता है:

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

इस आर्किटेक्चर से मिलने वाले मुख्य फ़ायदे, इंतज़ार के समय को सीधे तौर पर कम करते हैं:

• दस्तावेज़ का छोटा साइज़: सीरियलाइज़ किए गए दस्तावेज़ के स्नैपशॉट छोटे और हल्के होते हैं.
• कम दोतरफ़ा यात्रा: रिमोट होस्ट प्लेयर, इंटरैक्शन और स्टेटस में होने वाले बदलावों को स्थानीय तौर पर मैनेज करता है. इसलिए, ऐप्लिकेशन या सर्वर पर वापस जाने वाली दोतरफ़ा यात्रा कम हो जाती हैं.

वेबपेज / एचटीएमएल की समानता: रिमोट कंपोज़, वेबपेज दिखाने की तरह ही काम करता है. ऐप्लिकेशन सर्वर, एक बार एचटीएमएल/दस्तावेज़ स्ट्रक्चर जनरेट करता है और भेजता है. इसके बाद, ब्राउज़र होस्ट उसे रेंडर करता है और बैकएंड से लगातार क्वेरी किए बिना, इंटरैक्शन को स्थानीय तौर पर मैनेज करता है.

घटक

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

• बुनियादी लेआउट कॉम्पोनेंट: Compose जैसे सामान्य लेआउट एलिमेंट, जैसे कि RemoteBox, RemoteRow, और RemoteColumn.
• अडैप्टिव लेआउट कॉम्पोनेंट: खास कॉम्पोनेंट, जैसे कि RemoteFitBox, RemoteCollapsibleRow, और RemoteCollapsibleColumn. इन्हें इस तरह डिज़ाइन किया गया है कि ये रिमोट डिवाइसों की स्क्रीन पर आसानी से अडजस्ट हो सकें.
• मटीरियल डिज़ाइन थीम: Wear OS विजेट के लिए थीमिंग उसी तरह काम करती है जिस तरह RemoteMaterialTheme के रंग और टाइपोग्राफ़ी की हैरारकी काम करती है. इससे आपके ऐप्लिकेशन और विजेट में, एक जैसी ब्रैंडिंग और डिज़ाइन सिस्टम लागू करने में मदद मिलती है.

RemoteCanvas की मदद से, पसंद के मुताबिक ड्रॉइंग

कस्टम ग्राफ़िक और समय के हिसाब से चलने वाले ऐनिमेशन के लिए, RemoteCanvas का इस्तेमाल करें. यह ड्रॉइंग कमांड को रिकॉर्ड करता है, जिन्हें प्लेयर होस्ट पर चलाता है. इस गाइड में, कॉम्पोनेंट की मदद से यूज़र इंटरफ़ेस (यूआई) बनाने के बारे में बताया गया है.

मुख्य अंतर

Remote Compose, स्टेट, लॉजिक, और कार्रवाइयों को कैसे मैनेज करता है, यह समझने के लिए यहां दिए गए मुख्य कॉन्सेप्ट देखें.

सिंबॉलिक स्टेट रेफ़रंस

स्टैंडर्ड Compose में, स्टेट कंटेनर में लोकल ऐप्लिकेशन मेमोरी में मौजूद, ऐक्टिव और पढ़ी जा सकने वाली वैल्यू सेव होती हैं. इन वैल्यू में, ऐप्लिकेशन कोड (लैम्ब्डा) की मदद से बदलाव किया जाता है. Remote Compose में, स्टेट डिक्लेरेशन, सिंबॉलिक रेफ़रंस के तौर पर काम करते हैं. लोकल ऐप्लिकेशन मेमोरी में ऐक्टिव वैल्यू सेव करने के बजाय, वे ऐसी बाइंडिंग तय करते हैं जिन्हें रिमोट प्लेयर मैनेज करता है और रनटाइम के दौरान लोकल तौर पर अपडेट करता है. Remote Compose में स्टेट का एलान करते समय, इन बातों का ध्यान रखें:

• rememberMutableRemoteInt, rememberMutableRemoteFloat या rememberMutableRemoteString जैसी स्थिति तय करने के लिए, Remote Compose फ़ैक्ट्री फ़ंक्शन का इस्तेमाल करें.
• आपका ऐप्लिकेशन कोड, कंपोज़िशन के दौरान सीधे तौर पर रिमोट स्टेट वैरिएबल की वैल्यू की जांच नहीं कर सकता या उसे पढ़ नहीं सकता.
• जब उपयोगकर्ता दस्तावेज़ के साथ इंटरैक्ट करता है, तब प्लेयर इन वैल्यू को डिवाइस पर सेव और अपडेट करता है.

रिमोट स्टेट बनाम Kotlin कंट्रोल फ़्लो

Kotlin कोड सिर्फ़ तब चलता है, जब आपका ऐप्लिकेशन दस्तावेज़ बनाता है. Kotlin स्टेटमेंट, जैसे कि if, when, और for, उस समय की वैल्यू के आधार पर दस्तावेज़ को आकार दे सकते हैं. जैसे, सूची में मौजूद हर आइटम के लिए एक लाइन दोहराना. हालांकि, वे बाद में बदलने वाली रिमोट स्थिति पर प्रतिक्रिया नहीं दे सकते. रिमोट कंपोज़ में काम करते समय, इन बातों का ध्यान रखें:

• ब्रांचिंग लॉजिक: डाइनैमिक यूज़र इंटरफ़ेस (यूआई) स्विचिंग, RemoteStateLayout का इस्तेमाल करके की जाती है. इसके लिए, स्टेट को अलग-अलग RemoteComposable स्लॉट पर मैप किया जाता है.
• टेक्स्ट का आकलन: स्टैंडर्ड Kotlin स्ट्रिंग इंटरपोलेशन ("$remoteValue") का इस्तेमाल करने से बचें. इसका आकलन सिर्फ़ तब होता है, जब दस्तावेज़ बनाया जाता है. इसके बजाय, RemoteText को RemoteString पास करें.

RemoteModifier का इस्तेमाल करके डाइनैमिक स्टाइलिंग

होस्ट पर डाइनैमिक स्टाइलिंग की सुविधा, कंपोज़िशन को फिर से नहीं चलाती. इसके बजाय, रिमोट स्टेट वैरिएबल सीधे तौर पर मॉडिफ़ायर में पास किए जाते हैं, जैसे कि RemoteModifier.background(remoteColor).

रिमोट सिस्टम कॉन्टेक्स्ट

CompositionLocal प्रोवाइडर, जैसे कि LocalConfiguration या LocalDensity, दस्तावेज़ रिकॉर्ड किए जाने के समय सिर्फ़ लोकल ऐप्लिकेशन एनवायरमेंट को दिखाते हैं. ये रिमोट होस्ट पर डाइनैमिक तौर पर अपडेट नहीं होते हैं. ऐसा तब होता है, जब प्लैटफ़ॉर्म का साइज़ बदलता है, डिसप्ले की स्थिति बदलती है या समय के साथ आगे बढ़ता है. इसके बजाय, ऐसी वैल्यू का इस्तेमाल करें जिन्हें प्लेयर, रनटाइम के दौरान होस्ट पर रिज़ॉल्व करता है. जैसे, कॉम्पोनेंट का मौजूदा साइज़, RemoteConfiguration या RemoteDensity.

डिक्लेरेटिव ऐक्शन

स्टैंडर्ड Compose में, क्लिक हैंडलर ऐसे लैम्ब्डा होते हैं जो आपके ऐप्लिकेशन में चलते हैं. होस्ट, आपके ऐप्लिकेशन का कोड नहीं चला सकता. इसलिए, Remote Compose में इसके बजाय कार्रवाइयां अटैच की जाती हैं. उदाहरण के लिए, RemoteModifier.clickable(action) के साथ. कोई कार्रवाई, valueChange का इस्तेमाल करके सीधे होस्ट पर रिमोट की स्थिति को अपडेट कर सकती है. इसके अलावा, pendingIntentAction या hostAction का इस्तेमाल करके, आपके ऐप्लिकेशन या होस्ट को कार्रवाई की ज़िम्मेदारी सौंपी जा सकती है. एक क्लिक से कई कार्रवाइयां करने के लिए, combinedAction का इस्तेमाल करें.

हाई-लेवल पैराडाइम की तुलना

सुविधा का डोमेन	स्टैंडर्ड Jetpack Compose	रिमोट कंपोज़
क्लिक और टच इवेंट	प्रोसेस में मौजूद सिंक्रोनस लैम्ब्डा	डिक्लेरेटिव सीरियलाइज़्ड ऐक्शन ऑब्जेक्ट
शर्त वाला लॉजिक	Kotlin में if और when कंट्रोल फ़्लो	दस्तावेज़ जनरेट करते समय, स्टैटिक स्टेट के लिए स्टैंडर्ड Kotlin if/when सामान्य तौर पर काम करता है. डाइनैमिक ब्रांचिंग, RemoteStateLayout का इस्तेमाल करती है (यूज़र इंटरफ़ेस (यूआई) ट्री के लिए).
कंट्रोल फ़्लो लूप	Kotlin में स्टैंडर्ड for और while लूप	स्टैंडर्ड Kotlin लूप (repeat, for, forEach) सिर्फ़ तब चलते हैं, जब दस्तावेज़ बनाया जाता है. वे होस्ट पर रिमोट स्टेट को लूप नहीं कर सकते
एक्ज़ीक्यूशन होस्ट	ऐप्लिकेशन प्रोसेस	लॉन्चर (AppWidget), Wear OS विजेट या किसी भी डिवाइस के साइज़, डाइमेंशन या कॉन्फ़िगरेशन के हिसाब से बनाया गया ऐसा ऐप्लिकेशन जिसमें मीडिया प्लेयर की सुविधा हो
प्रोसेस लाइफ़साइकल	फिर से कंपोज़ और रेंडर करने के लिए, प्रोसेस चालू रहनी चाहिए	प्रोसेस रिकॉर्ड यूज़र इंटरफ़ेस (यूआई) स्नैपशॉट दस्तावेज़; रिमोट प्लेयर इंजन, कॉम्पोनेंट ट्री को पार्स करता है, स्टेट म्यूटेशन को ट्रैक करता है, और ऐप्लिकेशन को कॉल बैक किए बिना स्थानीय तौर पर फिर से ड्रॉ करता है.
खराब असर	Coroutine लाइफ़साइकल (LaunchedEffect)	होस्ट पर उपलब्ध नहीं है. दस्तावेज़ बनाने के लिए, कंपोज़िशन आपके ऐप्लिकेशन में चलता है. इसलिए, कोरूटीन इफ़ेक्ट, रिमोट यूज़र इंटरफ़ेस (यूआई) को तब तक कंट्रोल नहीं कर सकते, जब तक इंटिग्रेशन कंपोज़िशन को खुला नहीं रखता.
स्टेट पैराडाइम	लोकल मेमोरी स्टेट वैल्यू	फ़ैक्ट्री फ़ंक्शन (rememberMutableRemoteInt(), rememberNamedRemoteColor()), जो रॉ वैल्यू के बजाय सिंबॉलिक स्टेट रेफ़रंस दिखाते हैं.