javascript - पॉलिमर तत्वों और कोणीयजेएस निर्देशों के बीच क्या अंतर है?




angularjs polymer (7)

दोनों के बीच क्या अंतर है?

एक उपयोगकर्ता के लिए: ज्यादा नहीं। आप दोनों के साथ भयानक ऐप्स बना सकते हैं।

एक डेवलपर के लिए: वे अलग-अलग वाक्यविन्यास का उपयोग करते हैं ताकि समाधान में काफी सीधी सीखने की वक्र हो। कोणीय लंबे समय से रहा है और इसमें एक बड़ा समुदाय है, इसलिए हल करने वाली समस्याओं को ढूंढने के लिए आपको कठोर दबाव डालना होगा।

एक वास्तुकार के लिए: बहुत अलग। कोणीय आपके जीवन के सभी पहलुओं के लिए जिम्मेदार एक आवेदन ढांचा है। यदि आप सुविधाओं जैसे घटक चाहते हैं तो इसमें निर्देशों को लंबवत रूप से एकीकृत किया गया है। दूसरी ओर पॉलिमर पे-ए-यू-गो की तरह अधिक है। आप एक मोडल, निश्चित चीज चाहते हैं, आप एक इंटरेक्टिव विजेट चाहते हैं, कोई समस्या नहीं है, आप रूट हैंडलिंग चाहते हैं, हम इसे कर सकते हैं। पॉलिमर भी अधिक पोर्टेबल है कि कोणीय को एक कोणीय ऐप को निर्देशों का पुन: उपयोग करने की आवश्यकता होती है। पॉलिमर के साथ विचार अधिक मॉड्यूलर है और अन्य ऐप्स, यहां तक ​​कि कोणीय ऐप्स भी काम करेगा।

पॉलिमर को यह समस्याएं हल करती हैं कि AngularJS नहीं है या नहीं?

नए वेब घटकों के मानकों का लाभ उठाने की दिशा में पॉलिमर एक दृष्टिकोण है। यदि कस्टम तत्वों, छाया डोम और HTML आयात जैसी सुविधाएं स्थानीय रूप से समर्थित हैं, तो मूर्खतापूर्ण होगा कि उनका लाभ न लें। वर्तमान में अधिकांश वेब घटक सुविधाएं व्यापक रूप से समर्थित नहीं हैं ( वर्तमान स्थिति ) इसलिए पॉलिमर शिम या पुल के रूप में कार्य करता है। एक पॉलीफिल की तरह किंडा (वास्तव में यह पॉलीफिल का उपयोग करता है)।

भविष्य में AngularJS के साथ पॉलिमर बांधने की योजना है?

हम एक वर्ष से अधिक के लिए एक साथ कोणीय और पॉलिमर का उपयोग कर रहे हैं। ऐसा करने का निर्णय पॉलिमर टीम द्वारा सीधे किए गए वादे पर आधारित था कि इंटरऑपरेबिलिटी वहां होगी। हमने उस विचार को छोड़ दिया है। अब हम केवल पॉलिमर का उपयोग करने की ओर बढ़ रहे हैं।

इसे फिर से करने के लिए हम शायद पॉलिमर का उपयोग करने के लिए कदम नहीं उठाएंगे, इसके बजाय परिपक्व होने की प्रतीक्षा करें। ऐसा कहा जा रहा है कि पॉलिमर के पास यह पेशेवर है (कुछ काफी अच्छा है) और विपक्ष (जिनमें से कुछ काफी निराशाजनक हैं) लेकिन मुझे लगता है कि यह एक और धागे के लिए एक चर्चा है।

पॉलिमर प्रारंभ पृष्ठ पर, हम कार्रवाई में पॉलिमर का एक उदाहरण देखते हैं:

<html>
  <head>
    <!-- 1. Shim missing platform features -->
    <script src="polymer-all/platform/platform.js"></script>
    <!-- 2. Load a component -->
    <link rel="import" href="x-foo.html">
  </head>
  <body>
    <!-- 3. Declare the component by its tag. -->
    <x-foo></x-foo>
  </body>
</html>

आप क्या देखेंगे <x-foo></x-foo> platform.js और x-foo.html द्वारा परिभाषित किया जा रहा है।

ऐसा लगता है कि यह AngularJS में निर्देश मॉड्यूल के बराबर है:

angular.module('xfoo', [])
.controller('X-Foo', ['$scope',function($scope) {
    $scope.text = 'hey hey!';
})
.directive('x-foo', function() {
    return {
        restrict: 'EA',
        replace: true,
        controller: 'X-Foo',
        templateUrl: '/views/x-foo.html',
        link: function(scope, controller) {
        }
    };
});
  • दोनों के बीच क्या अंतर है?

  • पॉलिमर को यह समस्याएं हल करती हैं कि AngularJS नहीं है या नहीं?

  • भविष्य में AngularJS के साथ पॉलिमर बांधने की योजना है?


पॉलिमर एक वेब घटक शिम है

  • " वेब घटक " मानकों का एक नया सेट है जो एचटीएमएल 5 द्वारा लिफाफा गया है जो वेब अनुप्रयोगों के लिए पुन: प्रयोज्य बिल्डिंग ब्लॉक प्रदान करने के लिए डिज़ाइन किया गया है।

  • ब्राउज़र "वेब घटक" विनिर्देशन को लागू करने के विभिन्न राज्यों में हैं, और इसलिए वेब घटक का उपयोग करके HTML लिखना बहुत जल्दी है।

  • लेकिन अफसोस! बचाव के लिए बहुलक! पॉलिमर एक पुस्तकालय है जो आपके एचटीएमएल कोड में एक अमूर्त परत प्रदान करता है, जिससे इसे वेब घटक एपीआई का उपयोग करने की इजाजत मिलती है जैसे कि यह सभी ब्राउज़रों में पूरी तरह लागू हो। इसे poly-filling कहा जाता है, और पॉलिमर टीम इस लाइब्रेरी को webcomponents.js रूप में वितरित webcomponents.js । इसे platform.js btw कहा जाता था।

लेकिन पॉलिमर वेब घटकों के लिए पॉलीफिल लाइब्रेरी से अधिक है ...

पॉलिमर एलिमेंट्स के माध्यम से खुले और पुन: प्रयोज्य वेब घटक बिल्डिंग ब्लॉक भी प्रदान करता है

सभी तत्वों को अनुकूलित और विस्तारित किया जा सकता है। इन्हें सोशल विगेट्स से लेकर एनीमेशन तक वेब एपीआई क्लाइंट के लिए कुछ भी ब्लॉक बनाने के लिए उपयोग किया जाता है।

पॉलिमर एक वेब अनुप्रयोग ढांचा नहीं है

  • पॉलिमर एक ढांचे की तुलना में पुस्तकालय से अधिक है।

  • पॉलिमर को रूट, एप्लिकेशन स्कोप, कंट्रोलर इत्यादि जैसी चीजों के लिए समर्थन नहीं है।

    • लेकिन इसमें दो-तरफा बाध्यकारी होता है, और घटकों का उपयोग करके कोणीय निर्देशों का उपयोग करने की तरह "लगता है"।
  • यद्यपि पॉलिमर और एंगुलरजेएस के बीच कुछ ओवरलैप हैं, लेकिन वे समान नहीं हैं। वास्तव में, एंगुलरजेएस टीम ने आगामी रिलीज में पॉलिमर पुस्तकालयों का उपयोग करने का उल्लेख किया है।

  • यह भी ध्यान रखें कि पॉलिमर को अभी भी "खून बह रहा है" माना जाता है जबकि AngularJS स्थिर हो रहा है।

  • इन दोनों Google परियोजनाओं को विकसित करना दिलचस्प होगा!


आप इस सवाल से पूछने वाले पहले व्यक्ति नहीं हैं :) अपने प्रश्नों को प्राप्त करने से पहले मुझे कुछ चीजों को स्पष्ट करने दें।

  1. पॉलिमर का webcomponents.js एक लाइब्रेरी है जिसमें विभिन्न डब्ल्यू 3 सी एपीआई के लिए कई webcomponents.js शामिल हैं जो वेब घटक छतरी के नीचे आते हैं। य़े हैं:

    • कस्टम तत्व
    • एचटीएमएल आयात
    • <template>
    • छाया डोम
    • सूचक घटनाक्रम
    • अन्य लोग

    प्रलेखन में बाएं- polymer-project.org ( polymer-project.org ) में इन सभी "प्लेटफार्म प्रौद्योगिकियों" के लिए एक पृष्ठ है। उन पृष्ठों में से प्रत्येक में व्यक्तिगत पॉलीफिल के लिए पॉइंटर भी होता है।

  2. <link rel="import" href="x-foo.html"> एक HTML आयात है। आयात अन्य HTML में एचटीएमएल सहित एक उपयोगी उपकरण है। आप <script> , <link> , मार्कअप, या किसी भी आयात में शामिल कर सकते हैं।

  3. कुछ भी "लिंक" <x-foo> x-foo.html पर नहीं। आपके उदाहरण में, यह <x-foo> (उदाहरण के लिए <element name="x-foo"> ) की कस्टम एलिमेंट परिभाषा को x-foo.html में परिभाषित किया गया है। जब ब्राउज़र उस परिभाषा को देखता है, तो यह एक नए तत्व के रूप में पंजीकृत है।

प्रश्नों पर!

कोणीय और बहुलक के बीच क्या अंतर है?

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

मैं पॉलिमर के पूरे आर्किटेक्चर स्टैक का वर्णन करने के लिए इस छवि का उपयोग करूंगा:

लाल परत: हमें पॉलिफिल के एक सेट के माध्यम से कल का वेब मिलता है। ध्यान रखें, उन लाइब्रेरी समय के साथ दूर जाते हैं क्योंकि ब्राउज़र नए एपीआई को अपनाते हैं।

पीला परत: polymer.js के साथ कुछ चीनी में छिड़कना। यह परत हमारी राय है कि spec'd एपीआई का उपयोग कैसे करें। यह डेटा-बाइंडिंग, सिंथेटिक शुगर, वॉचर्स, प्रकाशित गुणों जैसे चीजों को भी जोड़ता है ... हमें लगता है कि ये चीजें वेब घटक-आधारित ऐप्स बनाने के लिए सहायक हैं।

हरा: यूआई घटकों का व्यापक सेट (हरी परत) अभी भी प्रगति पर है। ये वेब घटक होंगे जो सभी लाल + पीले परतों का उपयोग करते हैं।

कोणीय निर्देश बनाम कस्टम तत्व?

एलेक्स रसेल का answer देखें। असल में, छाया डोम एचटीएमएल के बिट्स लिखने की अनुमति देता है लेकिन यह HTML भी encapsulating के लिए एक उपकरण है। यह मूल रूप से वेब पर एक नई अवधारणा है और कुछ अन्य ढांचे का लाभ उठाएगा।

पॉलिमर को यह समस्याएं हल करती हैं कि AngularJS नहीं है या नहीं?

समानताएं: घोषणात्मक टेम्पलेट्स, डेटा बाइंडिंग।

मतभेद: एंगुलर में सेवाओं, फिल्टर, एनिमेशन आदि के लिए उच्च स्तरीय एपीआई हैं, आईई 8 का समर्थन करते हैं, और इस बिंदु पर, उत्पादन ऐप्स बनाने के लिए एक और अधिक मजबूत ढांचा है। पॉलिमर अल्फा में बस शुरू हो रहा है।

भविष्य में AngularJS के साथ पॉलिमर बांधने की योजना है?

वे अलग परियोजनाएं हैं । उस ने कहा, कोणीय और एम्बर दोनों टीमों announced कि वे अंततः अंतर्निहित प्लेटफॉर्म एपीआई का उपयोग अपने स्वयं के ढांचे में करने के लिए आगे बढ़ेंगे।

^ यह एक बड़ी जीत आईएमओ है। ऐसी दुनिया में जहां वेब डेवलपर्स के पास शक्तिशाली टूल (छाया डोम, कस्टम एलिमेंट्स) हैं, ढांचे के लेखक भी बेहतर ढांचे बनाने के लिए इन प्राइमेटिव का उपयोग कर सकते हैं। उनमें से ज्यादातर वर्तमान में "काम पूरा करने" के लिए महान हुप्स के माध्यम से जाते हैं।

अद्यतन करें:

इस विषय पर एक बहुत अच्छा लेख है: " पॉलिमर और कोणीय के बीच का अंतर यहां है "


आपके प्रश्न के लिए:

भविष्य में AngularJS के साथ पॉलिमर बांधने की योजना है?

AngularJS के आधिकारिक ट्विटर खाते से: "angularjs अपने विगेट्स के लिए बहुलक का उपयोग करेगा। यह जीत-जीत है"

स्रोत: https://twitter.com/angularjs/status/335417160438542337


एमवीवीएम (मॉडल-व्यू, व्यू-मॉडल) कि कोणीय ऑफ़र एक चिंता नहीं है कि पॉलिमर का लक्ष्य हल करना है। जब आप कोणीय और पॉलिमर की तुलना करने पर विचार करते हैं तो एंजुलर निर्देश आपको (एक कस्टम टैग + संबंधित तर्क संयोजन) के साथ संगत और पुनः उपयोग करने योग्य प्रकृति प्रदान करते हैं। कोणीय एक व्यापक उद्देश्य-सेवा ढांचा बना हुआ है और रहेगा।


कोणीय निर्देश अवधारणात्मक रूप से कस्टम तत्वों के समान हैं लेकिन वे वेब घटक API के उपयोग के बिना लागू किए जाते हैं। कोणीय निर्देश कस्टम तत्वों का निर्माण करने का एक तरीका हैं, लेकिन पॉलिमर और वेब घटक विनिर्देश मानक करने के लिए मानक-आधारित तरीके हैं।

बहुलक-तत्व:

<polymer-element name="user-preferences" attributes="email">
  <template>
    <img src="https://secure.user-preferences.com/path/{{userID}}" />
  </template>
  <script>
    Polymer('user-preferences', {
      ready: function() {
        this.userID= md5(this.email);
      }
    });
  </script>
</polymer>

कोणीय निर्देश:

app.directive('user-preferences', ['md5', function() {
  return {
    restrict: 'E',
    link: function(scope, element, attrs) {
      scope.userID= md5(attrs.email);
    },
    template: '<img src="https://secure.user-preferences.com/path/{{userID}}" />'
  };
}]);

1 और 2) छाया डोम में उनके छिपे हुए पेड़ की वजह से पॉलिमर घटकों को स्कॉप्ड किया जाता है। इसका मतलब है कि उनकी शैली और व्यवहार खून बह नहीं सकता है। कोणीय उस विशेष निर्देश के लिए तैयार नहीं है जिसे आप बहुलक वेब घटक की तरह बनाते हैं। एक कोणीय निर्देश संभवतः आपके वैश्विक दायरे में कुछ के साथ संघर्ष कर सकता है। आईएमओ पॉलिमर से प्राप्त लाभ जो मैंने समझाया है .. मॉड्यूलर घटकों ने उस विशेष घटक को सीएसएस और जावास्क्रिप्ट को स्कॉप्ड किया है जो कुछ भी स्पर्श नहीं कर सकता है। अस्पृश्य डोम!

कोणीय निर्देश बनाए जा सकते हैं ताकि आप कार्यक्षमता के कई टुकड़ों के साथ तत्व को एनोटेट कर सकें। पॉलिमर वेब घटकों में जो मामला नहीं है। यदि आप घटकों की कार्यक्षमता को जोड़ना चाहते हैं तो आप दो घटकों को किसी अन्य घटक में शामिल करते हैं (या उन्हें किसी अन्य घटक में लपेटें) या आप मौजूदा घटक का विस्तार कर सकते हैं। याद रखें कि मुख्य अंतर अभी भी है कि प्रत्येक घटक बहुलक वेब घटकों में scoped है। आप कई घटकों में सीएसएस और जेएस फाइलों को साझा कर सकते हैं या आप इनलाइन कर सकते हैं।

3) हां, रॉब डोडसन और एरिक बिडेलमैन के अनुसार संस्करण 2+ में बहुलक को शामिल करने पर कोणीय योजनाएं

यह मजाकिया है कि यहां किसी ने भी शब्द का दायरा नहीं दिया है। मुझे लगता है कि यह एक बड़ा अंतर है।

कई मतभेद हैं, लेकिन जब ऐप के लिए कार्यक्षमता के टुकड़े जैसे मॉड्यूलर लेगो बनाने की बात आती है तो उनके पास भी बहुत आम बात होती है। मुझे लगता है कि यह कहना सुरक्षित है कि कोणीय अनुप्रयोग ढांचा होगा और बहुलक एक ही ऐप में एक ही ऐप में रह सकता है जिसमें प्रमुख अंतर होता है लेकिन बहुलक आपके कई मौजूदा निर्देशों के प्रतिस्थापन हो सकता है। लेकिन मुझे कोई कारण नहीं दिख रहा कि क्यों कोणीय काम नहीं कर सका और पॉलिमर घटकों को भी शामिल कर सकता है।

जब मैं इसे लिखता हूं तो जवाबों के माध्यम से फिर से पढ़ना, मैंने देखा कि एरिक बिडेलमैन (ईबेल) ने अपने answer में ऐसा कवर किया था:

"छाया डोम एचटीएमएल के बिट्स लिखने की इजाजत देता है लेकिन यह HTML भी encapsulating के लिए एक उपकरण है।"

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

मेरे द्वारा एकत्र की गई जानकारी के लिए मेरे मुख्य स्रोत यहां दिए गए हैं।

जावास्क्रिप्ट जैबर - रॉब डोडसन और एरिक बिडेलमैन के साथ पॉलिमर

शॉप टॉक शो - रॉब डोडसन के साथ वेब घटक





polymer