विकास
क्या है Web Components
पुन: प्रयोज्य UI घटकों के लिए मानक
Web Components कैप्सूलेटेड कार्यक्षमता के साथ पुन: प्रयोज्य कस्टम HTML तत्व बनाने के लिए वेब मानकों का एक सेट है।
मुख्य प्रौद्योगिकियां
- Custom Elements — कस्टम HTML टैग बनाना
- Shadow DOM — स्टाइल और मार्कअप एनकैप्सुलेशन
- HTML Templates — पुन: प्रयोज्य टेम्पलेट
- ES Modules — मॉड्यूलर कंपोनेंट लोडिंग
लाभ
- फ्रेमवर्क के बिना काम करते हैं
- सभी ब्राउज़रों के साथ संगत
- स्टाइल एनकैप्सुलेशन
- प्रोजेक्ट्स में पुन: प्रयोज्य
उदाहरण
class MyButton extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: 'open' });
}
}
customElements.define('my-button', MyButton);
लाइब्रेरी
- Lit (Google)
- Stencil (Ionic)
- FAST (Microsoft)