जेएसपी स्क्रिप्ट खराब होने पर जेएसएक्स अच्छा क्यों है?

Question

React.js जेएसएक्स को घटकों और तत्वों के एक पेड़ के निर्माण के लिए एक एक्सएचटीएमएल-जैसे सिंटैक्स के रूप में प्रदान करता है। JSX जावास्क्रिप्ट को संकलित करता है, और JSX में लूप या कंडीशंस प्रदान करने के बजाय, आप सीधे जावास्क्रिप्ट का उपयोग करते हैं:

<ul>
  {list.map((item) =>
    <li>{item}</li>
  )}
</ul>

जो मैं अभी तक स्पष्ट नहीं कर पाया हूं, वह अच्छा क्यों माना जाता है यदि अनुरूप निर्माणों को जेएसपी में बुरा माना जाता है?

जेएसपी में कुछ इस तरह

<ul>
   <% for (item in list) { %>
     <li>${item}</li>
   <% } %>
</ul>

टैग के साथ हल करने के लिए एक पठनीयता समस्या माना जाता है <c:forEach>। JSTL टैग के पीछे तर्क यह भी लगता है कि वे JSX पर लागू हो सकते हैं:

• जब आप XHTML जैसे सिंटैक्स (एंगल ब्रैकेट, नेस्टिंग) और जावा / जावास्क्रिप्ट (कर्ल, कॉमा, परेंस) के बीच टॉगल नहीं कर रहे हों तो यह पढ़ना थोड़ा आसान है
• जब आपके पास रेंडरिंग फंक्शन के अंदर उपयोग के लिए पूरी भाषा और प्लेटफ़ॉर्म उपलब्ध है, तो आपको तर्क देने से कम नहीं है कि इसमें कोई तर्क नहीं है।

केवल यही कारण है कि मैं सोच सकता हूं कि JSX अलग क्यों है:

• जावा में, आपके पास गलत काम करने के लिए एक प्रोत्साहन था - जेएसपी गर्म-पुनः लोड किया जाएगा, इसलिए एक पुनर्निर्माण / पुनरारंभ चक्र से बचने के लिए जेएसपी में कोड डालना आकर्षक था। तत्काल उत्पादकता के लिए स्थिरता का त्याग किया गया था। टेम्प्लेट निर्माणों के एक निश्चित समूह तक लिपिबद्धता को गायब करना प्रभावी रूप से स्थिरता बनाए रखने का एक तरीका था। जेएस दुनिया में ऐसी कोई विकृति मौजूद नहीं है।

• जेएसपी और जावा सिंटैक्स <% ... %>तत्व पीढ़ी से जावा कोड को अलग करने के लिए अतिरिक्त है, और जावा के मूल सिंटैक्स में एक foreachअवधारणा या प्रथम श्रेणी के कार्यों (हाल ही तक) की कमी है । JSX में लूप और सशर्त के लिए देशी जावास्क्रिप्ट का उपयोग करने का वाक्यविन्यास दंड गैर-शून्य है (मेरी राय में) लेकिन JSP जितना बुरा नहीं है, और यकीनन लूप और सशर्त के लिए JSX- विशिष्ट तत्वों को प्रस्तुत करने के लिए वारंट के लिए बुरा नहीं है।

क्या मुझे कुछ और याद आ रहा है?

Comments

मुझे नहीं लगता कि आपके JSP प्रति सेगमेंट में लूप होना बुरा है, समस्या स्क्रिप्ट टैग में कोड एम्बेडिंग के साथ है। यदि आप इन्हें बंद कर देते हैं और JSTL का उपयोग करते हैं तो आप अपने JSP को सरल बनाने के लिए बाध्य होंगे। इसके अलावा, जैसा कि आप बताते हैं, एक अतिरिक्त बोनस यह है कि JSTL सिंटैक्स स्क्रिप्टलेट सिंटैक्स की तुलना में थोड़ा कम है। जबकि मैं JSX से परिचित नहीं हूँ, मेरा अनुमान है कि आप शायद बहुत सारे तर्क युक्त तर्क के साथ JSX अंशों का दुरुपयोग कर सकते हैं, जिसकी अनुशंसा नहीं की जाएगी, लेकिन इसे रोका नहीं जाएगा।

— फिल्डिन

Answer 1

मुख्य रूप से, जेएसएक्स को बनाने वाले लोग उन लोगों से असहमत थे जिन्होंने जेएसपी को नापसंद किया था। उनकी चर्चा यहाँ देखें: हमने प्रतिक्रिया क्यों बनाई? साथ ही डेटा प्रदर्शित करना

टेम्प्लेट पृष्ठ के तर्क और प्रस्तुति के बीच एक विभाजन बनाने के विचार पर आधारित है। इस सिद्धांत पर आपके जावास्क्रिप्ट (या जावा) कोड को चिन्हित नहीं किया जाना चाहिए कि कौन सा मार्कअप प्रदर्शित होता है, और आपके मार्कअप का संबंध किसी भी तर्क से नहीं होना चाहिए। यह विभाजन अनिवार्य रूप से है क्यों लोग विभिन्न टेम्पलेट भाषाओं की आलोचना करते हैं जो आसानी से आपके टेम्पलेट (PHP / JSP / ASP) के साथ मिश्रण कोड की अनुमति देते हैं।

प्रतिक्रिया घटकों पर आधारित है। प्रतिक्रिया के लेखकों का तर्क है कि एक घटक के तर्क और प्रस्तुति कसकर जुड़े हुए हैं, और उन्हें विभाजित करने का प्रयास करने का कोई मतलब नहीं है। इसके बजाय, एक पृष्ठ को तार्किक टुकड़ों द्वारा तोड़ दिया जाना चाहिए। तो आप अलग घटकों में हेडर बार, टिप्पणियाँ, पोस्ट, संबंधित प्रश्न आदि को तोड़ सकते हैं। लेकिन प्रस्तुति से संबंधित प्रश्नों के लिए तर्क को विभाजित करने और विभाजित करने का कोई मतलब नहीं है।

जेएसएक्स और जेएसपी जैसे कुछ के बीच प्राथमिक अंतर यह है कि जेएसपी एक टेम्पलेट भाषा है जिसमें तर्क के लिए थोड़ा सा जावा शामिल है। JSX को HTML के टुकड़े बनाने के लिए आसान बनाने के लिए एक सिंटैक्स एक्सटेंशन के साथ जावास्क्रिप्ट है। जोर अलग है। चूंकि JSX इस दृष्टिकोण को अपनाता है, इसलिए यह JSP या दोस्तों द्वारा किए गए एक अच्छे, क्लीनर दृष्टिकोण का उत्पादन करता है।

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

Comments

मैं renderअन्य घटक तर्क के रूप में एक ही स्थान पर फ़ंक्शन को इनकैप्सुलेट करने के बारे में शिकायत नहीं कर रहा हूं । मैं तत्व पीढ़ी को अन्य प्रकार के कोड के साथ मिलाने की पठनीयता से बहुत चिंतित हूं।

— wrschneider

@wrschneider, एक renderविशिष्ट प्रकार के कोड को कैसे मिश्रित किया जा रहा है, तो आपकी विशिष्ट टेम्पलेट भाषा में एक प्रतिक्रिया कार्य होता है?

— विंस्टन एवर्ट

Answer 2

एक बाहरी व्यक्ति के रूप में रिएक्ट करने के लिए, मैंने जेएसएक्स को फ्रेमवर्क के बहुत भीड़ भरे चिड़ियाघर में एक और "फ्रेमवर्क गंध" के रूप में देखा। मैं अभी भी आश्वस्त नहीं हूं कि यह मामला नहीं है।

मुझे लगता है कि "उपयोगी" की एक व्यावहारिक परिभाषा यह है कि एक पुस्तकालय / रूपरेखा / पैटर्न से अधिक समस्याओं का कारण बनता है। मैं अभी तक आश्वस्त नहीं हूं कि JSX उस परिभाषा को फिट करता है। यह कहावत है "गुब्बारे को निचोड़ना" ... आप यहाँ एक समस्या को दरकिनार करते हैं, यह वहाँ से बाहर निकलता है। मेरे लिए, JSX किसी विशेष समस्या को हल नहीं कर रहा है ... यह केवल "अलग है।"

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

Comments

"उपयोगी की एक व्यावहारिक परिभाषा है ..." यह महान बिंदु है। और हाँ JSX अधिक समस्याओं को हल करता है तो हमें लगता है। प्रतिक्रिया दृश्य घटक JSX के साथ अधिक सरल और अभिव्यंजक है। यह उथले प्रतिपादन के साथ इकाई परीक्षण योग्य हो सकता है। यदि आप कहते हैं कि गंध में जेएसपी की गंध आ सकती है और इसमें त्रुटियों की अधिक संभावना है। और मैं अज्ञेय नहीं हूं।

— सागर

क्षमा करें, लेकिन मैं यह नहीं देखता कि यह प्रश्न का उत्तर कैसे देता है।

— सालेस्के

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

— dwoz

Answer 3

संक्षेप में:

• फ्रंट-एंड डेवलपर्स से स्क्रिप्टिंग और टेंपलेटिंग जानने की उम्मीद की जाती है
• JSX और JSP दोनों टेम्प्लेटिंग लैंग्वेज हैं
• जावास्क्रिप्ट एक स्क्रिप्टिंग भाषा है
• जावा एक स्क्रिप्टिंग भाषा नहीं है

संदर्भ

• HTML और JavaScript को अलग करना हानिकारक है? | Cory हाउस द्वारा बिटनेटिव

• स्क्रिप्ट को हानिकारक क्यों माना जाता है और आपके प्रोग्राम में स्क्रिप्टिंग को कैसे अक्षम करना है?

• JSP फ़ाइलों में जावा कोड से कैसे बचें? - स्टैक ओवरफ़्लो

Answer 4

जबकि मैं आपके वर्णन के आधार पर JSX का उपयोग नहीं करता, JSX टुकड़ा का काम डेटा प्रस्तुत करना है, अर्थात यह MVC के पार्लेंस में एक दृश्य घटक है। JSX टुकड़ा संभवतः पता नहीं है या परवाह नहीं है कि डेटा कहाँ से आया है जो आप चाहते हैं।

एक अच्छी तरह से संरचित जेएसपी पृष्ठ में आपके उल्लेख के समान ही जेएसटीएल के निर्देश होंगे। JSTL के निर्देश आपके JSPs को सरल बनाते हैं, इसलिए वे स्कोप से नहीं हटते हैं, अशक्त आदि की जाँच करते हैं। आश्चर्य की बात है कि यह कितना अव्यवस्था हटाता है और यह आपको इसे अस्वीकृत रखने के लिए प्रोत्साहित भी करता है।

जेएसएक्स टुकड़े की तरह; जेएसपी का एकमात्र काम यह पता लगाना चाहिए कि इसे प्राप्त किए गए डेटा के बारे में चिंता किए बिना कैसे पेश किया जाए।

सारांश में, चाहे आपका दृश्य JSX या JSP हो, यदि आप इसे ठीक से कर रहे हैं तो आपका दृश्य केवल डेटा प्रस्तुत करेगा।

जैसा कि आप सर्वर पर करने के बजाय प्रेजेंटेशन को क्लाइंट में शिफ्ट कर सकते हैं, इससे आपको अधिक फ्लेक्सिबिलिटी मिलती है। आपकी वेब साइट वेब सेवाओं (उदाहरण के लिए ReST) के माध्यम से अपना डेटा प्राप्त कर सकती है और सिर्फ एक अन्य ग्राहक हो सकती है। यदि आप बाद में निर्णय लेते हैं कि आप एक देशी Android या iOS ऐप चाहते हैं, तो वे आपकी वेब साइट के समान वेब सेवाओं के सेट का उपभोग कर सकते हैं।

Comments

ध्यान दें कि JSX का उपयोग क्लाइंट-साइड या सर्वर-साइड किया जा सकता है। JSX का उपयोग करने का फैंसी तरीका सर्वर पर प्रारंभिक नियंत्रणों को प्रस्तुत करना है और फिर DOM अपडेट (सेवा कॉल के जवाब में) क्लाइंट-साइड पर करना है। किसी भी तरह, आप सही हैं कि रिएक्ट दृश्य परत है ( फेसबुक को उद्धृत करते हुए) : "बहुत से लोग एमवीसी में वी के रूप में रिएक्ट का उपयोग करते हैं")।

— ब्रायन

विशिष्ट सवाल यह है कि रिएक्ट / जेएसएक्स इसे लूप्स / कंडीशन के लिए देशी जावास्क्रिप्ट सिंटैक्स का उपयोग करने के लिए अच्छी बात मानता है जबकि जेएसपी ने देशी जावा सिंटैक्स (स्क्रिप्टलेट) को समाप्त कर दिया।

— २०:३० पर wrschneider

क्षमा करें, मुझे वह बिंदु याद आ गया। मैंने जवाब लिखना शुरू कर दिया, लेकिन तब महसूस हुआ कि यह "आपका अनुमान उतना ही अच्छा है जितना मेरा"। JSX के लिए एक अच्छा प्रेजेंटेशन लेयर सिंटैक्स उपयोगी हो सकता है, मैं केवल यह बता सकता हूं कि यह Java डिजाइनरों के लिए महत्वपूर्ण था न कि JSX डिजाइनरों के लिए।

— फिलिदिन