मूंछों और जेटली के बीच के अंतर क्या हैं?

333

मेरे द्वारा देखे गए प्रमुख अंतर हैं:

हैंडल कहते हैं #if, #unless, #with, और#each
हैंडलबार्स सहायकों को जोड़ता है
हैंडलबार टेम्पलेट संकलित किए गए हैं (मूंछें भी हो सकती हैं)
हैंडलबार्स रास्तों का समर्थन करता है
{{this}}ब्लॉकों का उपयोग करने की अनुमति देता है (जो वर्तमान आइटम के स्ट्रिंग मूल्य को आउटपुट करता है)
Handlebars.SafeString() (और शायद कुछ अन्य तरीके)
हैंडलबार्स 2 से 7 गुना तेज है
मूंछें उल्टे खंडों का समर्थन करती हैं (अर्थात if !x ...)

(कृपया मुझे सही करें अगर मैं ऊपर के साथ गलत हूं।)

क्या कोई और बड़ा अंतर है जो मुझे याद आ रहा है?

9

यहाँ इन दोनों jsperf.com/dom-vs-innerhtml-based-templating/366 की तुलना में एक प्रदर्शन परीक्षण भी है - बेहतर विकल्प हैं;)

— मिको ओक्टामा

1

... और मेरा मानना है कि यह # नीच है, # लिस्ट नहीं।

— शैडो मैन

@ShadowCreeper धन्यवाद अपडेट की गई पोस्ट।

— चाड जॉनसन 3

1

मैंने इसके बारे में गहराई से लिखा है और यह भी दिखाया है कि आप डायनामिक कंटेंट के लिए सुपर बेसिक जावास्क्रिप्ट टेम्प्लेट के लिए कुछ ऐसा कैसे कर सकते हैं: http://stephentvedt.com/2013/09/23/html-templating-comparison/

— स्टीफन हेवड

3

मुझे आश्चर्य है कि अंतिम संपादन (2014-10-16) को किसने स्वीकार किया। इसका जवाब होना चाहिए था।

— वाल्टर ट्रॉस

125

आपने इसे बहुत पसंद किया है, हालांकि मूंछें भी संकलित की जा सकती हैं।

मूंछें सहायकों और अधिक उन्नत ब्लॉकों को याद कर रही हैं क्योंकि यह तर्कहीन होने का प्रयास करता है। हैंडलबार्स के कस्टम हेल्पर्स बहुत उपयोगी हो सकते हैं, लेकिन अक्सर अपने टेम्प्लेट में तर्क का परिचय देते हैं।

मूंछों के कई अलग-अलग संकलक हैं (जावास्क्रिप्ट, रूबी, पायथन, सी, आदि)। हैंडलबार जावास्क्रिप्ट में शुरू हुए, अब django-handlebars , handlebars.java , handlebars-ruby , lightncandy (PHP) , और handlebars-objc जैसी परियोजनाएं हैं ।

— frontendbeauty
स्रोत

7

स्कैंडलबार्स, स्कैला-हैंडलबार्स कार्यान्वयन को मत भूलना!

— कोड व्हिस्पर

1

रूबी कार्यान्वयन के लिए एक जावास्क्रिप्ट दुभाषिया की आवश्यकता होती है, इसलिए यह वास्तव में रूबी संकलक नहीं है।

— इलीटेयर

72

मूंछों पर मुकदमा:

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

मूंछे विपक्ष:

थोड़ा बहुत लॉजिक-लेस: बेसिक टास्क (जैसे अलग-अलग CSS कक्षाओं के साथ लेबल वैकल्पिक पंक्तियाँ) मुश्किल हैं।
देखें तर्क को अक्सर सर्वर पर वापस धकेल दिया जाता है या "लैम्ब्डा" (कॉल करने योग्य फ़ंक्शन) के रूप में लागू किया जाता है।
क्लाइंट और सर्वर पर काम करने के लिए लैम्ब्डा के लिए, आपको उन्हें जावास्क्रिप्ट में लिखना होगा।

हैंडलबार पेशेवरों:

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

हैंडलबार विपक्ष:

सर्वर पर रेंडर करने के लिए सर्वर-साइड जावास्क्रिप्ट की आवश्यकता होती है।

स्रोत: क्लाइंट साइड टेम्प्लेटिंग थ्रैडडाउन: मूंछें, हैंडलबार, डस्ट.जेएस, और बहुत कुछ

— फ़राज़ केलहिनी
स्रोत

37

रे मूंछें "थोड़ा बहुत तर्क-कम"। मेरा तर्क है कि वैकल्पिक पंक्तियाँ CSS को सीएसएस छद्म वर्ग जैसे tr:nth-child(even)और tr:nth-child(odd)या के साथ किया जाना चाहिए tr:nth-child(2n)। हालांकि यह सिर्फ एक उदाहरण है, मुझे लगता है कि (ज्यादातर समय) अगर मूंछ के साथ कुछ कठिन या अजीब है, तो आप इसे गलत कर रहे हैं; इसके लिए एक बेहतर जगह है।

— IANNNN

3

हैंडलबार्स का सर्वर साइट कार्यान्वयन जावा पर भी है github.com/jknack/handlebars.java

— UR6LAD

2

@IAmNaN जो कि nth-child के बारे में उचित है .. जब तक कि आप एक ईमेल के लिए html नहीं लिख रहे हैं, जहाँ आप केवल इनलाइन css का उपयोग कर सकते हैं - nth चयनकर्ताओं का उपयोग करना बहुत मुश्किल है!

— डायलन वाटसन

24

दो पुस्तकालयों के दृष्टिकोण के दायरे में एक सूक्ष्म लेकिन महत्वपूर्ण अंतर है। मूंछें माता-पिता के दायरे में वापस आ जाएंगी यदि यह वर्तमान संदर्भ में एक चर नहीं पा सकता है; हैंडलबार्स एक रिक्त स्ट्रिंग लौटाएगा।

इसका उल्लेख बमुश्किल GitHub README में किया गया है, जहां इसके लिए एक पंक्ति है:

हैंडलबार्स मूंछों से थोड़ा विचलन करता है कि यह डिफ़ॉल्ट रूप से पुनरावर्ती लुकअप नहीं करता है।

हालांकि, जैसा कि वहां उल्लेख किया गया है, मूंछों के समान हैंडलबार बनाने के लिए एक ध्वज है, लेकिन यह प्रदर्शन को प्रभावित करता है।

इसका प्रभाव उस रास्ते पर पड़ता है, जब आप #सशर्त के रूप में चर का उपयोग कर सकते हैं।

उदाहरण के लिए मूंछों में आप ऐसा कर सकते हैं:

{{#variable}}<span class="text">{{variable}}</span>{{/variable}}

इसका मूल रूप से मतलब है "यदि चर मौजूद है और सत्य है, तो उस चर के साथ एक स्पैन प्रिंट करें"। लेकिन हैंडलबार में, आपको या तो करना होगा:

{{this}}इसके बजाय उपयोग करें
{{../variable}}प्रासंगिक दायरे से बाहर निकलने के लिए , मूल पथ का उपयोग करें
variableमूल variableवस्तु के भीतर एक बच्चे के मूल्य को परिभाषित करें

इस पर अधिक जानकारी, यदि आप उन्हें चाहते हैं, तो यहां ।

— guypursey
स्रोत

23

नोट: यह उत्तर पुराना है। यह उस समय सच था जब यह पोस्ट किया गया था, लेकिन अब नहीं है।

मूंछों की व्याख्या कई भाषाओं में है, जबकि हैंडलबार केवल जावास्क्रिप्ट है।

— KevBurnsJr
स्रोत

11

उनके बीच एक और अंतर फ़ाइल का आकार है:

मूंछें। js में 9kb हैं,
यदि precompiled टेम्पलेट का उपयोग किया जाता है तो Handlebars.js में 86kb या 18kb होता है ।

Handlebars.js के प्रदर्शन लाभ को देखने के लिए हमें पहले से तैयार किए गए टेम्पलेट्स का उपयोग करना चाहिए।

स्रोत: जावास्क्रिप्ट अस्थायी इंजनों का अवलोकन

— simhumileco
स्रोत

7

एक और अधिक सूक्ष्म अंतर {{#property}}...{{/property}}ब्लॉक में मिथ्या मूल्यों का उपचार है । अधिकांश मूंछें लागू करने से यहां केवल जेएस झूठापन का पालन होगा, यदि ब्लॉक 'या' 0 propertyहै तो रेंडर न करें ''।

हैंडलबार्स ब्लॉक के लिए और , लेकिन अन्य गलत मूल्यों को प्रस्तुत नहीं करेगा । यह माइग्रेट करने के दौरान कुछ परेशानी पैदा कर सकता है।''0

— जैकब वासिल्वस्की
स्रोत

5

मुझे लगता है कि "हैंडलेबर्स" के लिए उल्लिखित विपक्ष में से एक अब वास्तव में वैध नहीं है।

Handlebars.java अब हमें क्लाइंट और सर्वर दोनों के लिए समान टेम्प्लेट भाषाओं को साझा करने की अनुमति देता है जो 1000+ घटकों के साथ बड़ी परियोजनाओं के लिए एक बड़ी जीत है जिसमें SEO के लिए सर्वराइड रेंडरिंग की आवश्यकता होती है

Https://github.com/jknack/handlebars.java पर एक नज़र डालें

— midart
स्रोत

3

- हैंडलबार्स के लिए "यह", और मूंछ के लिए चर ब्लॉक के भीतर नेस्टेड वेरिएबल का उपयोग करने के अलावा, आप मूंछ के लिए ब्लॉक में नेस्टेड डॉट का भी उपयोग कर सकते हैं:

    {{#variable}}<span class="text">{{.}}</span>{{/variable}}

— रेजिना सेरम्बाना
स्रोत