इस साल फ़रवरी 2026 में, Chrome 145 ने स्प्लिट व्यू की नेटिव सुविधा लॉन्च की थी. इसकी मदद से, उपयोगकर्ता एक ही विंडो में टैब को अगल-बगल देख और मैनेज कर सकते हैं. इससे अलग-अलग ओएस विंडो को मैनेज करने के लिए, तीसरे पक्ष के टूल पर निर्भर रहने की ज़रूरत नहीं पड़ती. उपयोगकर्ता, ब्राउज़र कंट्रोल की मदद से स्प्लिट व्यू में टैब को मैन्युअल तरीके से जोड़ और हटा सकते हैं. हालांकि, डेवलपर के पास Chrome एक्सटेंशन में इन नए टैब लेआउट को प्रोग्राम के हिसाब से कंट्रोल करने का विकल्प नहीं था.
हमें यह बताते हुए खुशी हो रही है कि स्प्लिट व्यू एपीआई का नया वर्शन अब उपलब्ध है. यह Chrome 155 से उपलब्ध होगा! इस नए एपीआई को Mozilla और अन्य ब्राउज़र वेंडर के साथ मिलकर, WebExtensions Community Group में बनाया गया है. इसकी मदद से एक्सटेंशन, स्प्लिट व्यू का पता लगा सकते हैं, उन्हें बना सकते हैं, और मैनेज कर सकते हैं.
डेमो
यह कैसे काम करता है
पहले, एक साथ कई एक्सटेंशन चलाने के लिए, कई तरह के मुश्किल तरीके इस्तेमाल किए जाते थे. जैसे, कई नेटिव विंडो का साइज़ बदलना, <iframe> एलिमेंट में पेजों को एम्बेड करना या साइड पैनल का इस्तेमाल करना. अब नया स्प्लिट व्यू एपीआई, Chrome के टैब एपीआई के साथ सीधे तौर पर इंटिग्रेट हो जाता है. इससे टैब के लेआउट को मैनेज करने की नई सुविधाएं मिलती हैं.
मेनिफ़ेस्ट की अनुमतियां
स्प्लिट व्यू एपीआई, browser.tabs नेमस्पेस का हिस्सा है. इनका इस्तेमाल करने के लिए, किसी अनुमति की ज़रूरत नहीं होती.
स्प्लिट व्यू की पहचान करना
हर Tab ऑब्जेक्ट में, splitViewId प्रॉपर्टी होती है.
अगर टैब, स्प्लिट व्यू का हिस्सा है, तो वह अपने पेयर किए गए टैब के साथ एक यूनीक आइडेंटिफ़ायर शेयर करता है. ऐसा न होने पर, splitViewId की डिफ़ॉल्ट वैल्यू -1 होती है.
// Querying all split views in the current windows
const tabs = await browser.tabs.query({ currentWindow: true });
const splitViews = tabs.map(tab => tab.splitViewId).filter(splitViewId => splitViewId !== -1);
सामान्य शर्तें
स्प्लिट व्यू में दो टैब को शामिल करने के लिए, उन्हें ये ज़रूरी शर्तें पूरी करनी होंगी:
- टैब एक-दूसरे के बगल में होने चाहिए या बनाए जाने चाहिए.
- टैब पहले से ही स्प्लिट व्यू में नहीं होने चाहिए.
- टैब की
pinned,windowId, औरgroupIdस्थिति एक जैसी होनी चाहिए.
इसके उलट, जब दो टैब को अनस्प्लिट किया जाता है, तो वे एक-दूसरे के साथ अपनी रिलेटिव पोज़िशन के साथ-साथ pinned, windowId, groupId की स्थितियां बनाए रखेंगे.
स्प्लिट व्यू बनाना
एक्सटेंशन, स्प्लिट व्यू बनाने के लिए इन दो तरीकों का इस्तेमाल कर सकता है:
- एक नया टैब बनाएं, जो
browser.tabs.createमें मौजूद नएsplitWithTabIdपैरामीटर का इस्तेमाल करके, किसी मौजूदा टैब के साथ स्प्लिट हो जाएगा. - मौजूदा दो टैब को नई
browser.tabs.createSplitसुविधा के साथ जोड़ें.
उदाहरण
मौजूदा टैब के साथ स्प्लिट करने के लिए, splitWithTabId का इस्तेमाल करके नया टैब बनाया जा सकता है.
await browser.tabs.create({splitWithTabId: existingTab.id});
डिफ़ॉल्ट रूप से, नया टैब मौजूदा टैब के दाईं ओर बनाया जाएगा.
मौजूदा टैब के बाईं ओर नया टैब बनाने के लिए, इंडेक्स को उस टैब के इंडेक्स के तौर पर सेट करें:
await browser.tabs.create({splitWithTabId: existingTab.id, index: existingTab.index});
दो मौजूदा टैब को एक साथ रखकर भी नया स्प्लिट व्यू बनाया जा सकता है.
await browser.tabs.createSplit([existingTab1.id, existingTab2.id]);
स्प्लिट व्यू को हटाना
स्प्लिट व्यू को दो अलग-अलग टैब में बांटने के लिए, एक्सटेंशन browser.tabs.unsplit नए तरीके का इस्तेमाल कर सकता है.
const splitViewId = browser.tabs.createSplit([tab1.id, tab2.id]);
// Unsplitting the split view into two independent tabs
await browser.tabs.unsplit(splitViewId);
ज़्यादा जानें
हमें उम्मीद है कि इस नई सुविधा से, आपके एक्सटेंशन के लिए ज़्यादा प्रॉडक्टिव वर्कफ़्लो तैयार करने में मदद मिलेगी. स्प्लिट व्यू की सुविधाओं वाले एक्सटेंशन बनाने के लिए, Tabs API से जुड़ा दस्तावेज़ देखें. अगर आपको स्प्लिट व्यू एपीआई के बारे में कुछ पूछना है या इससे जुड़ी मदद चाहिए, तो Chromium एक्सटेंशन Google ग्रुप पर जाएं.
स्प्लिट करने का आनंद लें!