La sua API primitiva consente la programmazione per Internet, e il suo client è un capolavoro di restrizione. Come funziona Google Calendar e cosa possiamo imparare da esso come ingegneri. Architettura Nessuna (!).Solo alcune librerie interne per cose come l'autenticazione e gli utensili condivisi. Frontend framework Nomi di classe CSS, invocati da JS. Frontend Styling : Cache Storage, IndexedDB (modo offline), CDN (immagini e caratteri). Frontend Storage Spanner di DB. API Storage Google Meet, Google Contacts e Google Auth. External APIs : battito del cuore, avvenimento, notifiche. Services Un compilatore interno che rende JS scaricare e eseguire più velocemente. Other Problemi interessanti Certo, un calendario è una grande app CRUD, ma non lasciarti ingannare – ci sono stati molti problemi tecnici impegnativi che dovevano essere risolti. Calendario delle fiamme REST+JSON dal 2011 (originalmente feed in stile REST+RSS) Il modello di dati si appoggia fortemente alle stringhe di ricorrenza RFC 5545 iCalendar (Microsoft e Apple usano oggetti proprietari) I clienti possono guardare / iscriversi per ricevere una notifica di webhook quando gli eventi cambiano Supporta le sincronizzazioni incrementali per la velocità... ma richiede anche di gestire le scadenze e le ri-sincronizzazioni da soli Utilizza quote e limiti tariffari per ridurre i problemi di prestazione Potenti ma primitivi: ti daranno abbastanza da fare quello che devi, ma non lo scopriranno per te. Il layout HTML Sì, strutturare HTML può essere davvero interessante! Poiché le visualizzazioni del calendario sono ricche di contenuti, Se gli elementi non sono isolati. Ci sono grandi problemi di prestazioni Ecco gli elementi HTML più importanti: La griglia: fila giornaliera, colonne giornaliere, eventi orari, contenitore L'evento di preview, che non può essere bloccato in una riga/colonna Lo strato di trascinamento. Questo consente di eseguire attività DND sulla griglia Forms: fluttuano accanto agli eventi sulla griglia e si espandono in un dialogo a schermo intero Messaggi di conferma: Messaggi di conferma Algoritmi frontali Ogni client di calendario ha alcuni algoritmi succhi : the length, height, and coordinates (X, Y) of each event div. To compute this, you need to account for the event duration and view scale. Event position : The width and Y coordinates, which need to be adjusted based on the surrounding events. All-day event lengths : how to adjust events when they share times. Gcal’s implementation is more sophisticated compared to Outlook’s (which halves each event). Pseudo-code below. Overlapping events // overlapping events logic if start or end of targetEvent overlaps with any(events): if start and end of targetEvent = start and end of any(events): orderEventsAlphabeticallyByTitle() if start of targetEvent = start of any(events) and end != end of any(events): orderByDuration() //longest events go behind shorter events if start or end of targetEvent != start or end of any(events): if targetEvent overlaps multiple events: targetEventGoesInFrontOfEvents() else: orderEventsByStart() //events that start earlier go behind Questo per la piena attuazione di queste alghe. Il compass repo Servizi Questi sono i cavalli di lavoro esterni che consentono al codice client di rimanere semplice e affidabile Servizio Heartbeat – consente a GCal di essere affidabile e di tornare in modalità offline in modo grazioso Servizio di eventi - eventi pub/sub-style che alimentano i webhooks per i client. Questo consente ad altre app di costruire sull'API GCal. Servizio di notifica – coordinare il momento delle notifiche pre-evento. Il cliente potrebbe farlo da solo in teoria, ma sarebbe meno affidabile. [ di Takeaways Costruire un'app CRUD su scala globale potrebbe sembrare semplice dal diagramma architettonico, ma questa semplicità richiede ancora un alto livello di esecuzione. Affidabilità dell'API: poiché molte app si basano sulla sincronizzazione bidirezionale con il GCal di un utente, l'API deve essere semplice, estensibile e affidabile. Sicurezza dei dati: i dati del calendario sono estremamente sensibili e si basano fortemente su ruoli basati sull'ambito per garantire che solo le persone/applicazioni autorizzate possano accedere ai dati. Servizi di monitoraggio: le verifiche sanitarie, il logging e la sincronizzazione avvengono senza sosta dietro le quinte. Date le esigenze di scala, puoi rendere la vita più facile per te stesso semplicemente . not doing things Non fare le cose Non hai bisogno di usare la pila di tendenza. Immaginate se abbandonassero tutto per riscrivere la loro app in Angular. Poi reagire. Poi Svelete. Poi NextJS. Poi HTMX. Tutti quelli sono venuti dopo che Google Calendar è stato spedito. GCal ha scelto JS, ha tirato sulla pista destra e ha costato a 64MPH per decenni. Nessuno si preoccupa. Non è necessario pubblicare su tutte le piattaforme. ritirare l'applicazione desktop Google Calendar ora. Non è necessario tenere il passo con le tendenze di stile. Bootstrap. Bulma. componenti di stile. Tailwind. nomi di classe CSS. Non è necessario avere il miglior UX. modalità buia. moduli che risparmiano spazio. #FFFFFF modalità leggera. moduli di pagina completa. Non è necessario avere le migliori prestazioni. Il loro punteggio di punta sulla performance è 31/100. Come nella vita, vale la pena conoscere se stessi quando si spedisce il prodotto. Google Calendar non sta cercando di essere l'app moderna che gli assistenti esecutivi usano per pianificare 40 riunioni al giorno (questo è ciò per cui Vimcal è). Google Calendar mira ad essere un'app semplice che qualsiasi dei suoi 2 miliardi di utenti può operare senza maneggiare. Raccoglie 88/100 sull'accessibilità. L'interfaccia utente non cambia. Non cade, e ha supporto offline se lo fa. Ma funziona solo. Questo è abbondante. Per ottenere queste immersioni profonde nella tua casella di posta in arrivo, iscriviti alla mia newsletter, . Ingegnere Fullstack
