- 16 साल बाद पूरी तरह दोबारा लिखा गया Video.js v10 अब bundle size को 88% तक घटाकर आधुनिक development environment के अनुरूप नई संरचना के साथ पेश किया गया है
- यह React·TypeScript·Tailwind को first-class support देता है, साथ ही आकर्षक default UI और AI-friendly documentation structure प्रदान करता है
- नए Streaming Processor Framework(SPF) के साथ केवल ज़रूरी फीचर्स को जोड़कर इस्तेमाल करने योग्य modular streaming engine बनाया गया है, जो HLS.js की तुलना में 12% स्तर तक हल्का है
- Composition-based architecture और React/Web Components skin system की मदद से UI और फीचर्स को स्वतंत्र रूप से बदला या हटाया जा सकता है
- इसका लक्ष्य 2026 में औपचारिक रिलीज़ है, और AI सहयोगी development तथा विस्तार योग्य preset ecosystem के जरिए यह अगली पीढ़ी के open source media platform की दिशा में विकसित हो रहा है
Video.js v10 बीटा का अवलोकन
- Video.js v10.0.0 बीटा 16 साल में पहली पूर्ण पुनर्लेखन है, और यह सिर्फ Video.js ही नहीं बल्कि Plyr, Vidstack, Media Chrome जैसे कई open source projects के सहयोग का परिणाम है
- कुल 75 हजार GitHub stars और हर महीने अरबों प्लेबैक वाले ecosystem की भागीदारी के साथ, इसे आधुनिक development workflow और AI-assisted development environment को ध्यान में रखकर फिर से डिज़ाइन किया गया है
- इसके मुख्य लक्ष्य हैं bundle size में 88% कमी, React·TypeScript·Tailwind के लिए first-class support, सुंदर default UI, और AI-friendly documentation structure
Bundle size और performance में सुधार
- आधारभूत Video.js v10 player में v8 की तुलना में default bundle size 88% कम है, और ABR(Adaptive Bitrate) फीचर हटाने पर भी 66% कमी रहती है
- उदाहरण: v8 default 260.5kB(minified) → v10 HTML video player 97.4kB(minified), जबकि React version 62.0kB है
- नए Streaming Processor Framework(SPF) के कारण अब केवल आवश्यक फीचर्स के संयोजन से modular streaming engine बनाया जा सकता है
- साधारण HLS उपयोग में v10+SPF, v8+VHS की तुलना में file size का 19% है
- SPF engine स्वयं HLS.js-light के आकार का 12%(38.5kB minified) है और सरल ABR processing के लिए अनुकूलित है
- SPF, HLS.js, Shaka, dash.js जैसे मौजूदा engines के साथ पूरी तरह compatible है, और जब जटिल DRM या advertising फीचर्स की ज़रूरत न हो तो बेहद हल्का configuration संभव है
Composition-based architecture
- v10 में State, UI, Media को अलग करने वाली component structure अपनाई गई है, जिससे हर हिस्से को स्वतंत्र रूप से बदला या हटाया जा सकता है
createPlayer() फ़ंक्शन features array लेता है और केवल ज़रूरी फीचर्स शामिल करता है- उदाहरण: अगर audio फीचर की ज़रूरत नहीं है, तो
volume, mute कोड bundle में शामिल नहीं होगा
- UI हटाने के लिए सिर्फ skin को लोड न करना पर्याप्त है — यानी अनावश्यक code को पूरी तरह बाहर रखा जा सकता है
- न्यूनतम React configuration का उदाहरण 5kB से कम(gzipped) में चलता है और इसमें सिर्फ play/pause button शामिल है
UI customization और skin system
- v10, React और Web Components आधारित skin system प्रदान करता है और Base UI, Radix आदि से प्रेरित unstyled UI primitives संरचना अपनाता है
- हर UI component एक ही HTML element आउटपुट करता है, जिससे उसे सीधे नियंत्रित किया जा सकता है
- v8 में जहाँ timeline handle को CSS pseudo-elements से नियंत्रित किया जाता था, वहीं v10 में यह वास्तविक DOM element के रूप में दिया गया है, जिससे styling आसान हो जाती है
- बीटा में दो skins शामिल हैं
- Default skin: frosted जैसी सौंदर्य शैली और स्मूद animations
- Minimal skin: customization के लिए सरल आधार
- skin के error dialog design को भी एकरूप किया गया है, जिससे दृश्य गुणवत्ता बेहतर होती है
Preset system
- v10, उपयोग उद्देश्य के अनुसार preset की अवधारणा लाता है, जो skin, फीचर्स और media configuration को मिलाकर तुरंत इस्तेमाल योग्य player templates देता है
- Video preset: सामान्य web video के लिए
- Audio preset: podcast आदि के लिए audio-only
- Background video preset: background video के लिए, जिसमें controls और audio हटाए गए हैं
- preset तेज़ शुरुआत का आधार देते हैं, लेकिन साथ ही हर component को बदला जा सकता है, इसलिए पूरी extensibility बनी रहती है
- आगे चलकर education, short-form, creator platform के लिए अतिरिक्त presets जोड़े जाएंगे
AI-friendly design
- v10 का लक्ष्य ऐसी संरचना बनाना है जिसमें AI agents भी development में साथ काम कर सकें
- कम abstraction वाले components और unstyled UI primitives से code को समझना आसान होता है
- documentation navigation को बेहतर बनाने के लिए llms.txt फ़ाइल दी गई है, जिसमें framework-specific versions भी शामिल हैं
- सभी docs Markdown format में दिए गए हैं, ताकि AI बिना अनावश्यक HTML context के सीधे उन्हें उपयोग कर सके
- repository के भीतर AI skill sets के जरिए आगे चलकर user development support देने की योजना है
बीटा उपयोग गाइड
- API अभी स्थिर नहीं है, इसलिए औपचारिक रिलीज़ से पहले कुछ interfaces बदल सकते हैं
- अभी इसका फोकस बेसिक वेबसाइट playback functionality पर है; accessibility, subtitles, और विभिन्न formats का समर्थन संभव है, लेकिन settings menu जैसी सुविधाएँ अभी लागू नहीं हुई हैं
- GitHub issues और Discord feedback सक्रिय रूप से एकत्र किए जा रहे हैं
- मौजूदा version उपयोगकर्ताओं को migration guide जारी होने के बाद स्थानांतरण करने की सलाह दी गई है
आगे की roadmap
- 2026 के मध्य में औपचारिक रिलीज़(GA) का लक्ष्य
- Plyr, Vidstack, Media Chrome के स्तर की feature parity हासिल करने की योजना
- advertising support 2026 की दूसरी छमाही के लिए नियोजित है
- migration guide और अतिरिक्त presets उपलब्ध कराए जाएंगे
अभी कोई टिप्पणी नहीं है.