संयोजन मैं एक्सप्रेस + प्रतिक्रिया के साथ एक आइसोमोर्फिक जावास्क्रिप्ट ऐप पर काम कर रहा हूं। हमने स्थैतिक सामग्री के लिए सर्वर साइड टेम्पलेट्स के लिए जेड का उपयोग करना शुरू कर दिया, लेकिन दोनों के संयोजन तेजी से अनावश्यक हो रहा है।प्रतिक्रिया और जेड
एक्सप्रेस रास्ते में:
router.get("/", function(req, res) {
var webpackStats = require('../../config/webpack-stats.json');
var reactHtml = React.renderToString(HiwApp({}));
var slideshowHtml = React.renderToString(slideshowApp({}));
var config = {
webpackStats: webpackStats,
reactOutput: reactHtml,
slideshowHtml: slideshowHtml
};
res.render("how_it_works/howitworks", config);
});
जेड में: हम कुछ इस तरह से समाप्त हो गया है
body
.company-logo.center
#react-main-mount
!= reactOutput
include ./content_block_1.jade
include ./content_block_2.jade
#slideshow-main-mount
!= slideshowHtml
यह बहुत भंगुर-यदि है हम jsx चाहते तो एक जेड टेम्पलेट फिर और अधिक जेएसएक्स, हमें यह सुनिश्चित करना है कि हमें सही ऑर्डर मिल जाए।
मेरा विचार यह है कि सभी जेएसएक्स के साथ करें। मुझे पता है कि इस तरह की चीज़ के लिए React.renderToStaticMarkup है, लेकिन यह स्थैतिक पृष्ठों के साथ गतिशील मिश्रण की समस्या को हल नहीं करता है।
बड़े प्रश्न: यदि हम जेएसएक्स (लेआउट.जेएसएक्स जिसमें सभी घटकों को शामिल करते हैं) के साथ ऐसा करने का निर्णय लेते हैं, तो React.renderToString(App({});
पर कॉल करें, क्या यह एक प्रमुख प्रदर्शन हिट होगा? यदि हां, तो स्थिर और गतिशील ब्लॉक को आसानी से संयोजित करने के लिए ऐसा करने का एक बेहतर तरीका है?
प्रतिक्रियाओं 'रेंडर टॉस्ट्रिंग' के साथ अपने पूरे दस्तावेज़ को प्रस्तुत करने के लिए यह बिल्कुल ठीक है। प्रारंभिक पृष्ठ लोड प्रतिपादन पर एक जुर्माना है, हालांकि यह बहुत ही कम है। आपको लगता है कि आप एसपी ऐप बनाने की अधिक संभावना रखते हैं, यह वास्तव में एक मामूली मुद्दा है क्योंकि उपयोगकर्ता केवल प्रारंभिक पृष्ठ को एक बार उपयोग करते हैं। – AndrewMcLagan