🌫️ ✌🏽 ⚰️ एक्सट्रीम GWT 3.0 में नया 📨 👩🏾‍🍳 🌏

एक्सटी जेएस और एक्सट्रीम जीडब्ल्यूटी जावास्क्रिप्ट लाइब्रेरी को अन्य चीजों के अलावा, दृश्य घटकों के सर्वोत्तम सेटों के लिए - डिजाइन और क्रॉस-ब्राउज़र संगतता, और स्थिरता दोनों में जाना जाता है। इसलिए, GWT पर किसी भी प्रोजेक्ट के लिए हाथ खुद ही खींचे जाते हैं ताकि एक्सट्रीम को जोड़ने के लिए और अच्छे आकार और खिड़कियों के साथ उबाऊ Google विजेट को प्रतिस्थापित किया जा सके।

हालांकि, एक्सटीडब्ल्यू GWT और GWT का एकीकरण अभी भी बहुत वांछित है - वास्तव में, एक्सटीडब्ल्यू GWT का दूसरा संस्करण पूरी तरह से GWT इंटरफ़ेस को संकलित करने के सभी साधनों को पूरी तरह से अलग कर देता है, प्रसंस्करण सहित हर चीज के लिए अपने स्वयं के एपीआई की पेशकश करता है। इसलिए, लाइब्रेरी के तीसरे संस्करण के लिए, जो अब एक डेवलपर पूर्वावलोकन के रूप में उपलब्ध है, Sencha डेवलपर्स GWT में स्वीकार किए गए पैटर्न और मुहावरों का उपयोग करके सक्रिय रूप से एक्सट जेएस स्क्रिप्टिंग विरासत को फिर से लिख रहे हैं। मुख्य अपेक्षित लाभ GWT के साथ एक अधिक सही एकीकरण है और परिणामस्वरूप, एक अधिक कॉम्पैक्ट और अनुकूलित इंटरफ़ेस कोड: जावास्क्रिप्ट और सीएसएस उत्पन्न होते हैं और आस्थगित बाध्यकारी तंत्र का उपयोग करते हुए GWT संकलन के चरण में उत्पन्न होते हैं, जो कोड टुकड़े का उपयोग नहीं करता है। वर्तमान परियोजना।

विगेट्स का प्रयोग करें

GWT से अपनाए गए पैटर्न में से एक सूरत है, जो आपको एक विजेट, उसके लेआउट, शैली और तर्क को स्वतंत्र और बदली भागों में चयन करने की अनुमति देता है। यह दृष्टिकोण आपको विगेट्स की शैलियों और विषयों और यहां तक कि उनके लेआउट को आसानी से बदलने की अनुमति देता है - उदाहरण के लिए, बटन के DOM कार्यान्वयन के रूप में div या बटन का उपयोग करें। यहाँ एक सरल div बटन पर सूरत पैटर्न को लागू करने का सबसे सरल उदाहरण है जहां आप पाठ और आइकन बदल सकते हैं:

public interface Appearance { void render(SafeHtmlBuilder sb); void onUpdateText(XElement parent, String text); void onUpdateIcon(XElement parent, Image icon); } public static class DefaultAppearance implements Appearance { public interface Style extends CssResource { String testButton(); String testButtonText(); String testButtonImage(); } public interface Resources extends ClientBundle { @Source("DefaultAppearance.css") Style style(); } public interface Template extends XTemplates { @XTemplate(source = "DefaultAppearance.html") SafeHtml template(Style style); } private final Style style; private final Template template; public DefaultAppearance() { this((Resources) GWT.create(Resources.class)); } public DefaultAppearance(Resources resources) { this.style = resources.style(); this.style.ensureInjected(); this.template = GWT.create(Template.class); } @Override public void onUpdateIcon(XElement parent, Image icon) { XElement element = parent.selectNode("." + style.testButtonImage()); element.removeChildren(); element.appendChild(icon.getElement()); } @Override public void onUpdateText(XElement parent, String text) { parent.selectNode("." + style.testButtonText()).setInnerText(text); } @Override public void render(SafeHtmlBuilder sb) { sb.append(template.template(style)); } }

नेस्टेड स्टाइल इंटरफ़ेस घटक की प्रतिपादन शैली का प्रतिनिधित्व करता है। डिफ़ॉल्ट रूप से, यह बाहरी फ़ाइल से लिंक होता है DefaultAppearance.css - यह कनेक्शन संसाधन इंटरफ़ेस में सेट किया गया है। अंत में, तीसरा नेस्टेड इंटरफ़ेस, टेम्प्लेट, घटक के लेआउट का प्रतिनिधित्व करता है, और डिफ़ॉल्ट रूप से बाहरी फ़ाइल DefaultAppearance.html से जुड़ा होता है। DefaultAppearance ऑब्जेक्ट के निर्माता में, आप संसाधन इंटरफ़ेस के कार्यान्वयन को ओवरराइड कर सकते हैं, इस प्रकार घटक की शैली या थीम को बदल सकते हैं। इसी तरह से, आप टेम्पलेट टेम्प्लेट, या यहां तक कि पूरे DefaultAppearance ऑब्जेक्ट को बदल सकते हैं - विजेट को मापदंडों की सेटिंग या घटनाओं के प्रसंस्करण के लिए इसे प्रस्तुत करने के लिए सरल प्रकटन इंटरफ़ेस को जानने की आवश्यकता है।

नतीजतन, एक्सट जीडब्ल्यूटी हमें तीन एक्सटेंशन पॉइंट देता है जिसके माध्यम से हम विजेट के प्रदर्शन को प्रभावित कर सकते हैं: इसकी सीएसएस शैली, एचटीएमएल मार्कअप को बदलकर, या उपस्थिति वस्तु और तंत्र को पूरी तरह से पुनर्परिभाषित करके जिसके द्वारा यह विजेट को प्रस्तुत करने के लिए डोम के साथ बातचीत करता है। उपस्थिति पैटर्न के लिए धन्यवाद, ये सभी पहलू एक-दूसरे से बड़े करीने से अलग हैं।

जावाबीन डेटा मॉडल के रूप में ऑब्जेक्ट

अंत में, मॉडलडेटा इंटरफ़ेस को छोड़ना संभव होगा, जिसमें पहले किसी भी जावाबिन ऑब्जेक्ट को लपेटना आवश्यक था ताकि वे डेटा मॉडल के रूप में सेवा कर सकें। स्टोर और लोडर में, किसी भी वस्तु का उपयोग करना संभव हो सकता है जो किसी भी इंटरफ़ेस अनुबंध से जुड़ा नहीं है और विशेष कक्षाओं का विस्तार नहीं करता है। यह सब आस्थगित बाध्यकारी जादू के माध्यम से प्राप्त किया जाता है - वस्तु के विशिष्ट क्षेत्रों तक पहुंचने के लिए कोड GWT संकलन के चरण में उत्पन्न होता है। अब तक, रिपॉजिटरी और बूटलोडर्स के साथ काम करने के लिए नए एपीआई के कोई उदाहरण नहीं हैं, लेकिन एक और नवाचार के उदाहरण द्वारा नवाचार का प्रदर्शन किया गया है - नया डिज़ाइन किया गया XTemplate टेम्प्लेट इंजन:

 interface TemplateTest extends XTemplates { @XTemplate("<div><span>{name}</span></div>") SafeHtml renderCustomer(Customer customer); @XTemplate(source="template.html") SafeHtml renderCustomerExternal(Customer customer); } ... TemplateTest template = GWT.create(TemplateTest.class); SafeHtml html = template.renderCustomer(customer);

किसी भी स्थानांतरित वस्तु के क्षेत्र को अब सीधे टेम्पलेट के शरीर में उपयोग किया जा सकता है - उदाहरण के लिए, उपरोक्त कोड में customer.name फ़ील्ड का उपयोग किया जाता है। इस कोड का परीक्षण करने के लिए, मुझे किसी भी मेटा-इंटरफेस को घोषित करने की आवश्यकता नहीं थी - संकलन चरण में जादुई रूप से आवश्यक सभी चीजें उत्पन्न होती हैं। टेम्पलेट को, जैसा कि उदाहरण से देखा जा सकता है, को XTemplate एनोटेशन के मान स्ट्रिंग में या बाहरी फ़ाइल में समाहित किया जा सकता है, जिसका नाम उसी एनोटेशन के स्रोत फ़ील्ड में रखा गया है। टेम्पलेट का उपयोग करने का परिणाम सुरक्षित HTML है - इस अर्थ में सुरक्षित है कि प्राप्त SafeHtml सटीक रूप से प्रेषित फ़ील्ड और मूल्यों में XSS हमलों के संभावित स्रोतों को संभालता है।

यूबिंदर: घोषणात्मक इंटरफ़ेस लेआउट

एक अन्य लंबे समय से प्रतीक्षित फ़ंक्शन GWT 2.0, UiBinder के साथ मौजूदा XML मार्कअप तंत्र के साथ एकीकरण है। यह आपको बाहरी एक्सएमएल फ़ाइल में घटकों के लेआउट को निकालने की अनुमति देता है, यह घोषणात्मक और संरचित बनाता है और इसे जावा कोड में निर्धारित इंटरफ़ेस लॉजिक से अलग करता है। अब तक, UiBinder केवल मानक GWT विजेट्स और कंटेनरों के लिए उपलब्ध था, लेकिन अब Ext GWT डेवलपर्स सक्रिय रूप से इसके साथ अपने घटकों को एकीकृत करने पर काम कर रहे हैं। मुख्य समस्या, जिसके कारण एपीआई अभी तक पूरी तरह से तय नहीं किया गया है और यहां तक कि एक अलग जार फ़ाइल में ले जाया गया है, लेआउटडैटाटा का उपयोग करके कंटेनरों को कॉन्फ़िगर करने की कठिनाई है - यूबिंदर का वर्तमान कार्यान्वयन आपको XML मार्कअप विशेषताओं के साथ अपने स्वयं के पार्सर लिखने की अनुमति नहीं देता है। एक्सटीडब्ल्यू GWT और GWT के डेवलपर्स अब GWT में परिवर्तनों के समन्वय की प्रक्रिया में हैं जो इसे संभव बना देगा। अब तक, निम्नलिखित विकल्प प्रस्तावित किया गया है (रूट टैग पठनीयता के लिए छोड़ा गया है):

 <border:BorderLayoutContainer pixelSize="800, 400"> <border:north layoutData="size:100; margins: 0 0 5 0"> <gxt:ContentPanel /> </border:north> <border:west layoutData="size:150; margins: 0 5 0 0"> <gxt:ContentPanel /> </border:west> <border:center layoutData="0"> <gxt:ContentPanel heading="BorderLayout UiBinder Example" /> </border:center> <border:east layoutData="size:150; margins: 0 0 0 5"> <gxt:ContentPanel /> </border:east> <border:south layoutData="size:100; margins: 5 0 0 0"> <gxt:ContentPanel /> </border:south> </border:BorderLayoutContainer>

यह देखना आसान है कि प्रस्तावित लेआउटडेटा फ़ील्ड सिंटैक्स विशेषता में सीएसएस शैलियों की कुछ हद तक याद दिलाता है। इस तंत्र को काम करने के लिए, आपको gxt-uibinder-3.0.0-SNAPSHOT.jar और uibinder-Bridge-2.3.0-SNAPSHOT.jar पुस्तकालयों को परियोजना से जोड़ना होगा। हालाँकि, मुझे कहना होगा कि मैंने दिए गए उदाहरण का परीक्षण करने का प्रबंधन नहीं किया था - GWT ने लेआउटडैटा सामग्री को अज्ञात रूप से बॉर्डरलैटडैट ऑब्जेक्ट में परिवर्तित करने से इनकार कर दिया।

निष्कर्ष

पुस्तकालय के नए संस्करण में अन्य छोटी सुविधाओं में शामिल हैं:

घटना प्रसंस्करण तंत्र GWT के साथ एकीकृत - कोई श्रोता, मानक हैंडलर नहीं;
फ्लैश से जावास्क्रिप्ट तक अनुवादित चार्ट - वितरण पैकेज में उपलब्ध एक्सट्रीम GWT एक्सप्लोरर एप्लिकेशन से उदाहरण, हमेशा की तरह, अपनी चिकनाई और गति के साथ प्रभावित करते हैं;
कंटेनरों और लेआउट में कुछ सरलीकरण - LayoutContainer कंटेनरों को अब लेआउट लेआउट (RowLayoutContainer, BorderLayoutContainer, आदि) के साथ कसकर जोड़ा जाता है, जो कुछ हद तक उनके विन्यास को सरल बनाता है और विशिष्ट सुरक्षा प्रदान करता है।

निष्कर्ष में, मैं ध्यान देता हूं कि एक्सट जीडब्ल्यूटी 3.0 का वर्तमान संस्करण जीडब्ल्यूटी 2.3.0 के साथ मिलकर काम करता है, और सफल संकलन के लिए कम से कम जावा 1.6 की आवश्यकता होती है, जो कि स्वयं जीडब्ल्यूटी की आवश्यकताओं के कारण भी है। लाइब्रेरी का रूट पैकेज भी बदल गया है - com.extjs की हालिया रीब्रांडिंग की भावना में, इसे com.sencha द्वारा बदल दिया गया है। डेवलपर्स हर कुछ हफ्तों में एक बार डेवलपर पूर्वावलोकन के नए संस्करण जारी करने का वादा करते हैं, हालांकि, वे ध्यान दें कि ये संस्करण केवल नई सुविधाओं और एक एपीआई को प्रदर्शित करते हैं जो अभी तक तय नहीं किए गए हैं, और इसलिए विकास में उपयोग के लिए अनुशंसित नहीं हैं।

एक्सट्रीम GWT 3.0 में नया

विगेट्स का प्रयोग करें

जावाबीन डेटा मॉडल के रूप में ऑब्जेक्ट

यूबिंदर: घोषणात्मक इंटरफ़ेस लेआउट

निष्कर्ष

संदर्भ

More articles: