MonoStart - कस्टमाइज़ करने योग्य नया-टैब Chrome एक्सटेंशन

यह क्यों बना

मैं दिन में करीब 200 बार एक नया टैब खोलता हूं, और सालों तक यह बदले में कुछ नहीं देता था: एक सर्च बार और उन साइटों की एक ग्रिड जिनका Google ने अंदाज़ा लगाया। असली समस्या खाली पेज नहीं थी, समस्या वह सब कुछ थी जो मैं उससे निपटने के लिए करता था। सिर्फ़ URL दोबारा टाइप करने से बचने के लिए तीन Chrome प्रोफाइल में चालीस से ज़्यादा टैब खुले रहते थे, हर एक एक लाइव प्रोसेस जिसे Chrome गर्म रखता था। मैं अपना काम व्यवस्थित नहीं कर रहा था, मैं पेज नहीं बल्कि पॉइंटर पकड़े रखने के लिए RAM-और-फैन टैक्स चुका रहा था। जो भी मौजूदा नया-टैब एक्सटेंशन मैंने आज़माया, उसने उस खाली पेज को किसी बदतर चीज़ से बदल दिया: एक अजनबी UI जो मसल मेमोरी तोड़ देता, एक अकाउंट और क्लाउड सिंक, स्पॉन्सर्ड लिंक, टेलीमेट्री। मैं इसका इकलौता योगदानकर्ता हूं, जून 2026 से 222 कमिट, अब भी सक्रिय रूप से मेंटेन किया जा रहा है, पहले अपना खुद का ब्राउज़र ठीक करने के लिए बना और उसके बाद एक लाइव, पब्लिक एक्सटेंशन के रूप में शिप किया गया।

एक ही नियम: Chrome जैसा दिखें, कोई ऐप जैसा नहीं

इस कोडबेस में हर फैसला एक ही शर्त के आगे जवाबदेह है: आपको यह बता पाना नहीं चाहिए कि Chrome कहां खत्म होता है और डैशबोर्ड कहां शुरू होता है। यही वजह है कि असली Google सर्च बार बना रहता है, असली Chrome हिस्ट्री सुझावों के साथ, बजाय एक कस्टम सर्च UI के जिसे अपना हिस्ट्री इंडेक्स चाहिए होता। यही वजह है कि कोई ऑनबोर्डिंग फ्लो नहीं है, कोई लॉगिन स्क्रीन नहीं है, कोई अकाउंट सिस्टम नहीं है: नया टैब खोलना ऐसा महसूस होना चाहिए जैसे कुछ इंस्टॉल ही नहीं हुआ। कोई भी फीचर जो पेज को एक अलग ऐप जैसा महसूस कराता, चाहे वह कितना भी उपयोगी क्यों न हो, शिप नहीं हुआ।

ऐसे Service Worker में ऑडियो जो ऑडियो चला ही नहीं सकता

Manifest V3 बैकग्राउंड स्क्रिप्ट सर्विस वर्कर होती हैं, और सर्विस वर्कर सीधे भरोसेमंद तरीके से ऑडियो नहीं चला सकते। Chrome जब भी मेमोरी वापस लेना चाहे, इन्हें सस्पेंड और तोड़ देता है, बीच-प्लेबैक में भी। रिमाइंडर को फिर भी एक ऐसी आवाज़ चाहिए जो असल में बजे। इसका फिक्स रिमाइंडर शेड्यूल करने के लिए chrome.alarms इस्तेमाल करता है, क्योंकि अलार्म एक मारे गए सर्विस वर्कर से बच जाते हैं और उसे वापस जगा देते हैं, और प्लेबैक को खुद सर्विस वर्कर के बजाय एक chrome.offscreen डॉक्यूमेंट के ज़रिए रूट करता है, एक छिपा हुआ पेज जिसे Chrome खासतौर पर ऐसे कामों के लिए ज़िंदा रखता है। यह उसी तरह का वर्कअराउंड है जिससे ज़्यादातर MV3 एक्सटेंशन आखिरकार टकराते हैं, क्योंकि MV3 में अब कोई स्थायी बैकग्राउंड पेज मौजूद नहीं है।

Chrome से ही रिवर्स-इंजीनियर की गई थीम

एक मनमाना कलर पैलेट बनाने के बजाय, MonoStart की 15 बिल्ट-इन थीम Chrome के अपने "Customize Chrome" सीड कलर से निकाली गई हैं, जिसकी एक्सट्रैक्शन प्रोसेस रेपो में कदम-दर-कदम दस्तावेज़ीकृत है। उस एक्सट्रैक्शन के एक शुरुआती वर्ज़न में एक hue-shift बग था। फिक्स v1.1.1 में शिप हुआ, उन सभी के लिए एक माइग्रेशन पाथ के साथ जिन्होंने पुराने गणित के तहत पहले ही कोई थीम चुन ली थी, ताकि मौजूदा यूज़र्स उस रंग से अलग किसी रंग के साथ न जागें जो उन्होंने चुना था।

सुरक्षा: सिर्फ़ Sanitizer पर भरोसा किए बिना एम्बेड को Sanitize करना

इमेज और एम्बेड विजेट मनमाना HTML स्वीकार करते हैं, जिसे रेंडर से पहले DOMPurify के ज़रिए सैनिटाइज़ किया जाता है। सिर्फ़ DOMPurify काफी नहीं था: यह एक srcdoc एट्रिब्यूट को नहीं हटाता, और srcdoc सेट वाला एक iframe एक्सटेंशन के अपने ऑरिजिन को विरासत में लेता है, अगर एक्सटेंशन का CSP कभी ढीला पड़ जाए तो एक असली XSS रास्ता। srcdoc को सैनिटाइज़र में साफ़-साफ़ हटाया जाता है, चाहे DOMPurify खुद जो भी अनुमति दे, एक पूरी लाइब्रेरी पर पूरी तरह भरोसा करने के बजाय एक दूसरी, स्वतंत्र लेयर।

डेटा मॉडल और स्केल

• टेक्स्ट डेटा (नोट्स, टु-डू, लेआउट, रिमाइंडर, सेटिंग्स) chrome.storage.local में रहता है।
• वॉलपेपर और बैकग्राउंड इमेज इसके बजाय एक अलग IndexedDB डेटाबेस में रहती हैं, orphan-reference गार्बेज कलेक्शन के साथ ताकि डिलीट या रिप्लेस की गई इमेज चुपचाप जमा न होती रहें।
• chrome.storage.local की करीब 10MB की सीमा unlimitedStorage परमिशन के ज़रिए हटाई गई है, जो तब ज़रूरी हुई जब इमेज पूरी तरह उस कोटा से बाहर चली गईं।
• 25 फाइलों में फैले 216 टेस्ट (Vitest, jsdom, fake-indexeddb) इस स्टोरेज लेयर को सीधे कवर करते हैं, सिर्फ़ उसके ऊपर के UI को नहीं।

लोकल-ओनली स्टोरेज एक जान-बूझकर लिया गया ट्रेडऑफ़ है, कोई चूक नहीं: इसका मतलब है मशीनों या प्रोफाइल में कोई सिंक नहीं, लेकिन यही वह मैकेनिज़्म है जो तीन Chrome प्रोफाइल को उनका अपना स्वतंत्र, अलग-थलग डैशबोर्ड मुफ्त में देता है, बिना किसी साझा अकाउंट सिस्टम को बनाने और सुरक्षित करने के। सर्च-बार ऑटोकम्प्लीट पूरे ऐप में एकमात्र नेटवर्क कॉल है, जो Google के पब्लिक suggest API को उसी तरह हिट करता है जैसे Chrome की अपनी एड्रेस बार करती है; यूज़र जो कुछ भी असल में बनाता है वह लोकल ही रहता है।

Build vs. Buy

कोई कस्टम ड्रैग-एंड-ड्रॉप इंजन नहीं: react-grid-layout ग्रिड को संभालता है, नेस्टेड ग्रुप सहित, कोलिज़न डिटेक्शन और रीसाइज़ हैंडल को शुरू से दोबारा बनाने के बजाय। कोई कस्टम कंपोनेंट लाइब्रेरी नहीं: shadcn/ui का Radix-आधारित कंपोनेंट सीधे कॉपी करने का पैटर्न (एक अपारदर्शी UI पैकेज इंस्टॉल करने के बजाय) हर कंपोनेंट के कोड को, और उससे किसी भी विचलन को, दिखने योग्य और एडिट करने योग्य बनाए रखता है। कोई कस्टम लोकलाइज़ेशन पाइपलाइन नहीं: react-i18next प्लस लोकल फाइलों (50+ भाषाओं) का बढ़ता हुआ सेट, हाथ से बनाए स्ट्रिंग लुकअप के बजाय।

Stack

React 19, Vite, TypeScript, Tailwind CSS, Radix UI प्रिमिटिव पर shadcn/ui, डैशबोर्ड ग्रिड के लिए react-grid-layout, लोकलाइज़ेशन के लिए react-i18next, एम्बेड सैनिटाइज़ेशन के लिए DOMPurify, टेस्ट के लिए Vitest, Chrome का Manifest V3 एक्सटेंशन प्लेटफॉर्म (chrome.alarms, chrome.offscreen, chrome.storage, IndexedDB), PolyForm Noncommercial 1.0.0 के तहत लाइसेंस प्राप्त।