अपना build setup समझाइए। जब ब्राउज़र modules को सीधे सपोर्ट करते हैं तो bundle करने की ज़रूरत ही क्या है?

native modules चलते हैं, पर बिना bundle की सैकड़ों फाइलें भेजने का मतलब है सैकड़ों requests और dependency का गहरा झरना, जो HTTP/2 पर भी धीमा है। bundling से tree shaking, minification, हर route पर code splitting, लंबी cache उम्र के लिए content hashed filenames, और TypeScript तथा JSX बदलने की एक जगह मिलती है। dev servers अब तुरंत शुरू होने के लिए native modules परोसते हैं, फिर प्रोडक्शन के लिए bundle करते हैं, यानी दोनों का सबसे अच्छा हिस्सा।

native modules अब सच में इस्तेमाल लायक हैं, पर जिस पल मेरे पास असली dependency tree होता है, मैं ब्राउज़र से कह रहा होता हूं कि सैकड़ों छोटी फाइलें झरने की तरह ढूंढो और लाओ, और graph का हर स्तर एक और round trip लेता है। bundling उसे समेट देती है। साथ ही मुझे tree shaking मिलती है, तो बिना इस्तेमाल वाले exports जाते ही नहीं, minification, content hashed filenames ताकि मैं assets को साल भर cache कर सकूं, और TypeScript compile करने की एक ही जगह। development में मैं ऐसा server इस्तेमाल करता हूं जो native ES modules परोसता है और मांग पर बदलता है, तो प्रोजेक्ट कितना भी बड़ा हो startup तुरंत होता है, फिर प्रोडक्शन के लिए एक rolled up build बनता है। splitting में मैं डिफ़ॉल्ट रूप से हर route पर बांटता हूं, और उसके ऊपर हर भारी चीज़ के इर्द गिर्द lazy सीमाएं रखता हूं जो पहले render के लिए ज़रूरी नहीं, जैसे rich text editor या charting library। और मैं CI में एक size बजट रखता हूं जो सीमा पार होते ही build फेल कर देता है, क्योंकि bundle size हमेशा एक एक छोटी dependency से बिगड़ता है, और जब तक वह साफ दिखे तब तक वह एक fix नहीं, एक पूरा प्रोजेक्ट बन चुका होता है।