MonoStart trasforma la pagina predefinita di nuova scheda del browser in una dashboard personale veloce e personalizzabile. Organizza segnalibri, liste di attività, note rapide e timer di concentrazione in uno spazio di lavoro configurabile. Costruita come estensione Chrome Manifest V3, memorizza tutto localmente sul dispositivo: nessun account, nessun database server, nessuna analytics.
Cosa ho costruito
- Dashboard personalizzabile: una griglia drag-and-drop, con gruppi di widget annidati, dove i widget (link rapidi, cartelle categorizzate, note, liste di cose da fare, timer countdown, promemoria, ricerca vocale e ricerca visiva Google Lens) possono essere disposti per adattarsi a qualsiasi flusso di lavoro.
- Layout ad accesso rapido: link fissati nell'header e cartelle raggruppate sostituiscono i menu segnalibri profondi, mantenendo i siti visitati di frequente a un clic di distanza.
- Personalizzazione dei temi: 15 temi colore integrati, ricostruiti per reverse engineering dalla palette "Personalizza Chrome" di Chrome stesso, un selettore hex personalizzato, supporto per modalità chiara/scura e sfondi con gradiente o wallpaper.
- Strumenti di produttività: timer countdown integrati e promemoria programmati con avvisi audio locali e notifiche desktop.
- Storage local-first: note, cose da fare, layout e immagini vivono in chrome.storage.local e IndexedDB sul dispositivo. Nessun account utente e nessun database server; l'unica chiamata di rete è verso l'API pubblica di suggerimenti di Google per l'autocompletamento della ricerca, la stessa usata dalla barra degli indirizzi di Chrome.
Perché è stato importante
La pagina di nuova scheda viene aperta decine di volte al giorno. MonoStart trasforma quello spazio vuoto in una dashboard di produttività istantanea e local-first che rispetta la privacy: i tuoi dati non lasciano mai il dispositivo.
Perché esiste
Apro una nuova scheda circa 200 volte al giorno, e per anni non ha restituito nulla: una barra di ricerca e una griglia di siti indovinati da Google. Il vero problema non era la pagina vuota, era tutto quello che facevo per aggirarla. Oltre quaranta schede tenute aperte su tre profili Chrome solo per evitare di riscrivere gli URL, ognuna un processo vivo che Chrome teneva caldo. Non stavo organizzando il mio lavoro, stavo pagando una tassa di RAM e ventole per tenere puntatori, non pagine. Ogni estensione per nuove schede che ho provato scambiava quella pagina vuota con qualcosa di peggiore: un'interfaccia estranea che rompeva la memoria muscolare, un account con sincronizzazione cloud, link sponsorizzati, telemetria. Sono l'unico contributore, 222 commit da giugno 2026, ancora attivamente mantenuta, costruita prima per risolvere il mio browser personale e poi rilasciata come estensione pubblica e live.
L'unica regola: sembrare Chrome, non un'app
Ogni decisione in questo codebase risponde a un solo vincolo: non deve essere possibile capire dove finisce Chrome e dove inizia la dashboard. È per questo che la vera barra di ricerca di Google resta, con i veri suggerimenti della cronologia Chrome, invece di un'interfaccia di ricerca personalizzata che avrebbe bisogno di un proprio indice di cronologia. Ed è per questo che non c'è un flusso di onboarding, nessuna schermata di login, nessun sistema di account: aprire una nuova scheda deve sembrare come se non fosse stato installato nulla. Una funzionalità che facesse sentire la pagina come un'app separata, per quanto utile, non veniva rilasciata.
Audio in un service worker che non può riprodurre audio
Gli script in background di Manifest V3 sono service worker, e i service worker non possono riprodurre audio in modo affidabile in modo diretto. Chrome li sospende e li smonta ogni volta che vuole recuperare memoria, anche a metà riproduzione. I promemoria hanno comunque bisogno di un suono che scatti davvero. La soluzione usa chrome.alarms per programmare il promemoria, poiché gli alarm sopravvivono a un service worker terminato e lo riattivano, e instrada la riproduzione tramite un documento chrome.offscreen invece del service worker stesso, una pagina nascosta che Chrome mantiene viva specificamente per compiti come questo. È lo stesso tipo di soluzione alternativa in cui finisce la maggior parte delle estensioni MV3, dato che una pagina di background persistente non esiste più in MV3.
Temi ricostruiti per reverse engineering da Chrome stesso
Invece di inventare una palette di colori arbitraria, i 15 temi integrati di MonoStart sono estratti dai colori seed di "Personalizza Chrome" di Chrome stesso, con il processo di estrazione documentato passo passo nel repository. Una versione iniziale di quell'estrazione aveva un bug di hue-shift. La correzione è stata rilasciata nella v1.1.1 con un percorso di migrazione per chiunque avesse già scelto un tema con la vecchia matematica, così gli utenti esistenti non si sono ritrovati con un colore diverso da quello scelto.
Sicurezza: sanificare gli embed senza fidarsi solo del sanificatore
I widget immagine ed embed accettano HTML arbitrario, sanificato tramite DOMPurify prima del rendering. DOMPurify da solo non bastava: non rimuove un attributo srcdoc, e un iframe con srcdoc impostato eredita l'origine stessa dell'estensione, un vero percorso XSS se la CSP dell'estensione si allentasse mai. srcdoc viene rimosso esplicitamente nel sanificatore indipendentemente da ciò che DOMPurify permette da solo, un secondo livello indipendente invece di fidarsi completamente di una singola libreria.
Modello dati e scala
- I dati testuali (note, cose da fare, layout, promemoria, impostazioni) vivono in chrome.storage.local.
- Le immagini di wallpaper e sfondo vivono invece in un database IndexedDB separato, con garbage collection dei riferimenti orfani, così le immagini eliminate o sostituite non si accumulano silenziosamente.
- Il limite di circa 10MB di chrome.storage.local viene rimosso tramite il permesso
unlimitedStorage, necessario da quando le immagini sono state spostate completamente fuori da quella quota. - 216 test su 25 file (Vitest, jsdom, fake-indexeddb) coprono direttamente questo livello di storage, non solo l'interfaccia sopra di esso.
Lo storage esclusivamente locale è un compromesso deliberato, non una svista: significa nessuna sincronizzazione tra macchine o profili, ma è lo stesso meccanismo che dà gratuitamente a tre profili Chrome la propria dashboard indipendente e isolata, senza un sistema di account condiviso da costruire e proteggere. L'autocompletamento della barra di ricerca è l'unica chiamata di rete in tutta l'app, verso l'API pubblica di suggerimenti di Google, allo stesso modo in cui fa la barra degli indirizzi di Chrome; tutto ciò che l'utente crea effettivamente resta locale.
Costruire vs. comprare
Nessun motore drag-and-drop personalizzato: react-grid-layout gestisce la griglia, inclusi i gruppi annidati, invece di reimplementare da zero il rilevamento delle collisioni e le maniglie di ridimensionamento. Nessuna libreria di componenti personalizzata: il pattern di shadcn/ui, che copia direttamente i componenti basati su Radix (invece di installare un pacchetto UI opaco), mantiene visibile e modificabile il codice di ogni componente, e ogni sua deviazione. Nessuna pipeline di localizzazione personalizzata: react-i18next più un insieme crescente di file di locale (oltre 50 lingue) invece di una ricerca di stringhe scritta a mano.
Stack
React 19, Vite, TypeScript, Tailwind CSS, shadcn/ui su primitive Radix UI, react-grid-layout per la griglia della dashboard, react-i18next per la localizzazione, DOMPurify per la sanificazione degli embed, Vitest per i test, la piattaforma di estensioni Manifest V3 di Chrome (chrome.alarms, chrome.offscreen, chrome.storage, IndexedDB), concessa in licenza sotto PolyForm Noncommercial 1.0.0.