Backbone.js और jQuery

Question

ऐसा कहा जाता है कि बैकबोन सभी उच्च स्तर के सार को संभालता है, जबकि jQuery या इसी तरह के पुस्तकालय डोम के साथ काम करते हैं, घटनाओं को सामान्य करते हैं और इसी तरह ..

क्या कोई मुझे इस कथन को किसी भी सरल व्यावहारिक उदाहरण के साथ समझने में मदद कर सकता है।

बैकबोन, नॉकआउट जैसे एमवीसी ढांचे की एक महत्वपूर्ण विशेषता यह है कि यह मॉडल (डेटा) और दृश्य को सिंक में रखता है। लेकिन यह पृष्ठ-स्तर पर विशिष्ट प्रतीत होता है और संपूर्ण अनुप्रयोग में नहीं। तो क्या हमारे पास मॉडल / डेटा हो सकता है और दृश्य कई पृष्ठों में सिंक किया जा सकता है .. (वैश्विक प्रकार)

Comments

आपको "बैकबोन और jQuery" कहना चाहिए

— नवजात शिशु

Noobs द्वारा - Noobs के लिए। thomasdavis.github.com/2011/02/01/backbone-introduction.html । वे दोनों रोजमर्रा के मुद्दों के लिए आसानी से उपयोग और स्केलेबल समाधान प्रदान करना चाहते हैं। एक (jQuery) मौजूदा तत्वों के साथ काम करने और DOM लोड के बाद डेटा में हेरफेर करने के लिए आपको आसान बनाने पर बहुत अधिक ध्यान केंद्रित करता है। अन्य (बैकबोन) आपको एक "एमवी (वीएम / सी / सीआर)" एप्लिकेशन बनाने की अनुमति देता है जो मॉडल को निर्देशित करता है (हमारा डेटा जिसे हम प्रदर्शित करना चाहते हैं), हमारा दृष्टिकोण (हम अपना डेटा कैसे प्रदर्शित करना चाहते हैं) और हमारे नियंत्रक ( बैकबोन इसे दो तरीकों से तोड़ता है - कलेक्शन / राउटिंग) डेटा ट्रैवलिंग / हेरफेर BEFORE लोड।

— ओहगोद्वि

इसके लिए Thx ... मैंने सवाल अपडेट किया है ...

— testndtv

Answer 1

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

एक विशिष्ट रीढ़ ऐप की विशेषताएं हैं:

• सर्वर पर उत्पन्न कुछ भी नहीं के साथ अनिवार्य रूप से स्थिर HTML पृष्ठ
• सर्वर एक JEST REST एपि के रूप में कार्य करता है, जो एप के लिए सामग्री प्रदान करता है
• डेटा प्रदर्शित करने के लिए मुख्य तत्वों को बैकबोन विचारों में जावास्क्रिप्ट के साथ बनाया गया है, jQuery और विभिन्न टेंपलेटिंग पुस्तकालयों का उपयोग करने में मदद करने के लिए
• सर्वर के साथ-साथ ऐप के विभिन्न हिस्सों के बीच संचार रीढ़ की हड्डी के मॉडल के माध्यम से किया जाता है

डेटा को कई पृष्ठों में समकालिक रखने के बारे में आपके प्रश्न के बारे में, मेरा सहज जवाब है कि आपको कई पृष्ठों की आवश्यकता नहीं है: उपयोगकर्ता यह महसूस कर सकता है कि पृष्ठ बदल रहा है, url बार में पता पुशस्टैट कार्यक्षमता के लिए धन्यवाद बदलता है, लेकिन तकनीकी रूप से पूरा ऐप एक पेज का है।

इस तरह के दृष्टिकोण का सबसे बड़ा लाभ एक चिकनी उपयोगकर्ता अनुभव (पुन: लोड करने वाले पृष्ठ नहीं हैं), कैशिंग डेटा के अलावा सब कुछ के रूप में अच्छा कैशिंग समर्थन है, मोबाइल लक्ष्य के लिए मोबाइल ऐप को फोनगैप के साथ मोबाइल ऐप में बदलने की संभावना है (क्योंकि json को छोड़कर सब कुछ स्थिर है)।

Comments

हम्म् ... बहुत कुछ ... मैं थोड़ा उलझन में हूँ जब यू कहता है कि बैकबोन मुख्य रूप से केवल सिंगल पेज एप्स के लिए उपयोग किया जाता है ... निश्चित रूप से कितने एप्स केवल सिंगल पेज नहीं हैं ... अधिकांश में कई पेज हैं ... यहां तक ​​कि मेरे पास मल्टी पेज ऐप है ... तो क्या मैं Backbone.js का उपयोग नहीं कर सकता हूं?

— Testndtv

सिंगल पेज ऐप का मतलब है कि यह तकनीकी रूप से एक html पृष्ठ है - उपयोगकर्ताओं के दृष्टिकोण से इसमें आमतौर पर कई दृश्य ("पृष्ठ") और फ़ंक्शन होते हैं। एक उदाहरण के रूप में मैं मोबाइल लिंक्डइन पृष्ठों को स्पर्श दे सकता हूं। www.linkedin.com जो वास्तव में बैकबोन या यहां तक ​​कि जीमेल का उपयोग करके विकसित किया गया है।

— ओलीएम

बेशक, आप मल्टी-पेज एप्लिकेशन के लिए बैकबोन का उपयोग कर सकते हैं, और उस स्थिति में आप शायद उतने ही बैकबोन राउटर का उपयोग करेंगे, जितने आपके पास स्वतंत्र पुनः लोड किए गए पृष्ठ हैं

— अलेक्जेंडर मिल्स

Answer 2

आपका शुरुआती वाक्य वास्तव में Backbone.js और jQuery के बीच के अंतर का एक बहुत अच्छा बयान था, इसलिए इसे थोड़ा अनपैक करें।

एक बात के लिए, दो पुस्तकालय प्रतिस्पर्धा में बिल्कुल नहीं हैं - वे मानार्थ हैं।

एक उदाहरण के रूप में, यहाँ कुछ चीजें हैं जो मैं jQuery के साथ करूंगा:

• एनिमेटेड स्लाइडशो
• एक आईओएस-स्टाइल नंबर "स्पिनर" की तरह फॉर्म नियंत्रण में वृद्धि
• एक वर्ग के नाम के आधार पर तत्वों की टॉगलिंग दृश्यता

और कुछ चीजें जो मैं Backbone.js में कर सकता हूं:

• एक फोटो एल्बम बनाएं, जहां उपयोगकर्ता एक थंबनेल पर क्लिक करता है और फ़ोटो का एक बड़ा संस्करण देख सकता है, साथ ही कुछ डेटा जैसे कैमरा का उपयोग किया गया था, स्थान और फोटोग्राफर का नाम
• एक मास्टर / विवरण प्रकार का पेज बनाएं जो डेटा का एक ग्रिड प्रस्तुत करता है और उपयोगकर्ता को व्यक्तिगत तत्वों पर क्लिक करने और उन्हें एक रूप में अपडेट करने की अनुमति देता है।

माइक्रो लेवल पर jQuery के एक्सेल - पेज एलिमेंट्स को सेलेक्ट करते हुए, ब्राउजर्स को हैंडल करने के तरीकों में अंतर को स्मूद करते हुए।

Backbone.js अधिक बड़ी तस्वीर है। यह आपको डेटा और एप्लिकेशन लॉजिक को प्रबंधित करने में मदद करता है। ऊपर दिए गए फोटो एल्बम उदाहरण में, बैकबोन कई उपयोगी संरचनाएं प्रदान करता है: आपके पास फ़ोटो से संबंधित डेटा (एक मॉडल), एल्बम में सभी फ़ोटो की एक सूची (एक संग्रह), और कहीं न कहीं रखने के लिए कुछ होगा। तर्क जो यह निर्धारित करता है कि जब कोई उपयोगकर्ता थंबनेल (दृश्य) पर क्लिक करता है तो क्या होता है। बैकबोन नियंत्रण या अनुप्रयोग में वे मुख्य टुकड़े हैं।

Backbone.js को jQuery से लाभ मिलता है, हालांकि, या ऐसा कुछ, जो आपके एप्लिकेशन के डेटा और तर्क के परिणामों को DOM में प्रस्तुत करने में मदद करता है। यह आम है, उदाहरण के लिए, पृष्ठ पर उस तत्व का चयन करने के लिए jQuery का उपयोग करना जो आपके बैकबोन ऐप के लिए कंटेनर के रूप में काम करेगा। $(function () {});अपने बैकबोन नियंत्रण के टुकड़ों को फायर करने के लिए jQuery का उपयोग करना भी आम है । आप संभवतः jQuery के साथ प्रपत्र फ़ील्ड सत्यापन त्रुटि संदेश भी प्रदर्शित करेंगे।

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

मैं वर्तमान में Backbone.js में उन नियंत्रणों में से एक का काम कर रहा हूं। एक अंतिम उदाहरण के रूप में, यहां एक त्वरित सारांश है कि दोनों अलग-अलग पुस्तकालयों में एक ही नियंत्रण पर काम करते समय मेरी विचार प्रक्रिया कैसे भिन्न होती है।

JQuery में, मैं इसके बारे में चिंतित हूं:

• क्या मैं उन liतत्वों के समूह को हथियाने के लिए सही चयनकर्ता का उपयोग कर रहा हूँ जो मुझे चाहिए?
• क्या इस अजाक्स कॉल के पूरा होने पर मुझे मूल्यों की उस सूची को फिर से खोलना होगा?
• मैं इन सरणी मानों inputको पृष्ठ के तत्वों में वापस कैसे डाल सकता हूं ?

बैकबोन में, मैं अधिक ध्यान केंद्रित कर रहा हूं:

• मेरे मॉडल आइटम पर गुणों के इस सेट को मान्य करने के लिए सही तर्क क्या है?
• जब उपयोगकर्ता ऐड बटन पर क्लिक करता है, तो क्या मुझे तुरंत संग्रह में एक नया आइटम जोड़ना चाहिए, या क्या मुझे तब तक इंतजार करना चाहिए जब तक वे सभी डेटा भर नहीं गए हैं और यह "वैध" है?
• मेरे संग्रह में एक आइटम को कैसे प्रतिक्रिया देनी चाहिए जब आइटम को तुरंत पहले या बाद में हटा दिया जाता है?

jQuery के नॉटी-ग्रिट्टी विवरणों को संभालता है, और बैकबोन अधिक उच्च-स्तरीय है।

समापन में, मैंने Backbone.js उदाहरणों पर चर्चा करते समय "कंट्रोल" और "ऐप" शब्दों का उपयोग किया है। यह सच नहीं है कि Backbone.js सिर्फ सिंगल पेज ऐप्स के लिए है। यह सच है, हालांकि, Backbone.js जटिल अनुप्रयोगों के निर्माण के लिए अच्छा है जो डेटा में हेरफेर करते हैं और बहुत सारे तर्क को संभालते हैं। छोटे पैमाने के यूआई तत्वों के लिए इसका उपयोग करना मूर्खतापूर्ण होगा - अतिरिक्त संरचना जो इसे लगाता है, उसकी आवश्यकता नहीं है।

अद्यतन: कई पृष्ठों के मुद्दे पर, हाँ, बैकबोन आपके डेटा को बनाए रखने के लिए एक शक्तिशाली तंत्र प्रदान करता है। प्रत्येक मॉडल में एक saveविधि होती है जो सर्वर पर परिवर्तनों को संग्रहीत करने के लिए एक AJAX कॉल को निष्पादित करेगी। इसलिए जब तक आप अपना डेटा सहेजते हैं, तब तक आपके पास एक बहु-पृष्ठ ऐप हो सकता है। यह एक बहुत ही लचीला मॉडल है, और यह है कि हम कैसे काम पर बैकबोन का उपयोग करेंगे। जबकि मुझे सिंगल-पेज ऐप बनाना पसंद है, हमारे मौजूदा मल्टी-पेज एप्लिकेशन में 10 साल का काम है। हम बैकबोन में हमारे कुछ अधिक तीव्र यूआई घटकों को फिर से बनाना चाहते हैं, फिर उपयोगकर्ता को किसी भिन्न पृष्ठ पर ले जाने से पहले सर्वर में परिवर्तन सिंक करें।

Comments

Thx a lot ... माइंड ब्लोइंग का उत्तर कम से कम कहने के लिए ... जबकि u ने लगभग सभी टुकड़ों को समझाया है, मेरा बस एक ही सवाल था ... यू ने उल्लेख किया कि बैकबोन केवल सिंगल पेज ऐप के लिए नहीं है ... इसलिए u pls एक उदाहरण प्रदान करता हूं कि मैं अपने डेटा को अपने ऐप में कई पृष्ठों पर कैसे जारी रख सकता हूं? इसके अलावा, मैं सर्वर साइड में जावा का उपयोग करता हूं जो वास्तविक डायनामिक डेटा लाता है ... इसलिए क्या मुझे यह भी अपडेट करना चाहिए कि मुझे सही प्रारूप में डेटा वापस करना है और फिर इसकी एक प्रति बैकबोन मॉडल के रूप में

— रखनी चाहिए

@testndtv हर बार जब आप पृष्ठ को रीफ्रेश करते हैं तो आपके सभी मॉडल खो जाते हैं ... तो पृष्ठ को ताज़ा क्यों करें? बैकबोन आपको उसी पृष्ठ पर रहते हुए अपने विचार बदलने की अनुमति देता है, इसलिए केवल 1 पृष्ठ का उपयोग करें।

— मार्क

Ok..Does Backbone में पृष्ठों पर डेटा को बनाए रखने के लिए कोई तंत्र नहीं है? AJAX कॉल या कुछ और के माध्यम से डेटा को

— बनाए रखने की तरह

डेटा को बनाए रखने के बारे में कुछ जानकारी जोड़ी गई, जिसे बैकबोन काफी अच्छी तरह से हैंडल करता है।

— जोश अर्ल

खैर जोश ने कहा, आपने इसे मुझसे बेहतर समझा। Testndtv, जब से आप जावास्क्रिप्ट पर एक शुरुआत लगते हैं, मैं चेतावनी जोड़ दूंगा कि रीढ़ की हड्डी वास्तव में बहुत शुरुआती मित्रवत ढांचा नहीं है - यह बहुत उपयोगी है और जटिल ऐप्स के निर्माण में बहुत मदद करता है, लेकिन अतिरिक्त अवधारणाएं शुरुआती विकास को और अधिक महत्वपूर्ण बनाती हैं। बस दूर हैकिंग। मैं आपको सलाह दूंगा कि आप रीढ़ की हड्डी के प्रलेखन से उदाहरणों का ध्यानपूर्वक अध्ययन करें, ताकि आप सही दिशा में आरंभ करें।

— ओलीएम

Answer 3

मैंने कई पृष्ठों में बैकबोन.जेएस का उपयोग करने वाले लोगों के बारे में कभी नहीं सुना है। यह लगभग हमेशा किसी न किसी पेज का ऐप होता है।

एकल पृष्ठ में कई अलग-अलग मॉडल, दृश्य और राज्य हो सकते हैं और इसका परिणाम पूर्ण विकसित, शक्तिशाली ऐप हो सकता है।

यदि आपके पास जावा में पहले से ही सर्वर-साइड टेम्प्लेट / व्यू रेंडरिंग है तो backbone.js आपके लिए नहीं है। Backbone.js का अधिकतम लाभ उठाने के लिए आपको सामने के अंत जावास्क्रिप्ट में उस कोड को स्थानांतरित या डुप्लिकेट करना होगा।

यदि आप एक पेज ऐप नहीं करना चाहते हैं (इसका मतलब बिना पेज रिफ्रेश या बदलाव के ऐप है, लेकिन यूआरएल अभी भी बदल सकता है और यूज़र को मल्टी-पेज की तरह दिख सकता है) तो आप अपने सभी MVC को चालू रख सकते हैं सर्वर और आपको बैकबोन की कोई आवश्यकता नहीं है।

संपादित करें:

बैकबोन क्या करता है एमवीसी सामान को सर्वर पर सामान्य रूप से संभाला जाता है और उन्हें क्लाइंट में स्थानांतरित करता है। कई लोगों के लिए इसका मतलब है कि सर्वर के बारे में भूल जाना और सिर्फ एक पेज के जावास्क्रिप्ट ऐप के रूप में अपना ऐप लिखना। सर्वर सिर्फ JSON / REST डेटा का एक स्रोत बन जाता है। यदि आप ऐसा करने के लिए तैयार नहीं हैं, तो backbone.js उतना उपयोगी नहीं है।

Answer 4

बैकबोन एक MV * फ्रेमवर्क है जबकि jQuery एक DOM टूलकिट है।

MV * एप्लिकेशन की मुख्य विशेषताएं रूटिंग, डेटा बाइंडिंग, टेम्प्लेट / विचार, मॉडल और डेटा एक्सेस हैं। बैकबोन आंशिक रूप से jQuery पर निर्भर हो सकता है।

व्यापक ब्राउज़र समर्थन और एक जीवंत समुदाय के साथ DOM को क्वेरी करने के लिए jQuery एक ठोस API है। यह इवेंट हैंडलिंग, आस्थगित ऑब्जेक्ट्स और एनिमेशन के साथ आता है।

JQuery का उपयोग करके सरल ईवेंट बाइंडिंग

// When any <p> tag is clicked, we expect to see '<p> was clicked' in the   console.
$( "p" ).on( "click", function() {
console.log( "<p> was clicked" );
});