इस प्रोजेक्ट के बारे में
react-window React घटक प्रदान करता है जो बड़े डेटासेट को रेंडर करने के लिए होते हैं, जबकि एक साथ प्रत्येक आइटम के लिए तत्व बनाने की प्रदर्शन लागत से बचा जाता है। यह दो मुख्य घटक प्रदान करता है: List, जो कई पंक्तियों वाले डेटा के लिए है, और Grid, जो कई पंक्तियों और स्तंभों वाले डेटा के लिए है।
List घटक को rowComponent, rowCount, rowHeight, और rowProps की आवश्यकता होती है। पंक्ति ऊंचाइयों को पिक्सेल, प्रतिशत, एक इंडेक्स और सेल प्रॉप्स के फ़ंक्शन, या useDynamicRowHeight से एक गतिशील पंक्ति-ऊंचाई कैश के रूप में निर्दिष्ट किया जा सकता है। दस्तावेज़ीकरण नोट करता है कि गतिशील ऊंचाइयाँ पूर्वनिर्धारित आकारों की तुलना में कम कुशल होती हैं। वैकल्पिक सुविधाओं में ओवरस्कैन रेंडरिंग, कस्टम पंक्ति कुंजियाँ, आकार बदलने और दृश्य-सीमा कॉलबैक, सर्वर-रेंडरिंग डिफ़ॉल्ट ऊंचाई, कस्टम CSS क्लास और स्टाइल, रूट तत्व ओवरराइड, और स्क्रॉलिंग और DOM एक्सेस के लिए एक अनिवार्य ref API शामिल हैं।
Grid घटक को cellComponent, cellProps, columnCount, columnWidth, rowCount, और rowHeight की आवश्यकता होती है। स्तंभ और पंक्ति आकार पिक्सेल मान, प्रतिशत, या फ़ंक्शन हो सकते हैं, लेकिन List पंक्तियों के विपरीत, Grid सेल आकार रेंडरिंग के बिना निर्धारित होने चाहिए। Grid दोनों दिशाओं में ओवरस्कैन, कस्टम पंक्ति और स्तंभ कुंजियाँ, दिशात्मक पाठ, सर्वर रेंडरिंग के लिए डिफ़ॉल्ट आयाम, आकार बदलने और रेंडर की गई सेल कॉलबैक, ओवरले या टूलटिप चिल्ड्रन, और अनिवार्य ग्रिड refs का भी समर्थन करता है।
पैकेज को npm से "npm install react-window" के साथ स्थापित किया जाता है, और प्रकाशित वितरण में TypeScript परिभाषाएँ शामिल हैं। दस्तावेज़ीकरण react-window.vercel.app पर उपलब्ध है, जिसमें अलग संस्करण 1.x दस्तावेज़ीकरण है। README React DevTools और Replay ब्राउज़र सहित परियोजनाओं में उपयोग का वर्णन करता है, लेकिन विशिष्ट प्रदर्शन बेंचमार्क दावे नहीं करता है।
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.