इसकी प्राचीन एपीआई इंटरनेट के लिए योजना बनाने की अनुमति देती है, और इसकी क्लाइंट सीमितता का एक चमत्कार है। Google कैलेंडर कैसे काम करता है, और हम इंजीनियरों के रूप में इससे क्या सीख सकते हैं। आर्किटेक्ट : कोई नहीं (!). सत्यापन और साझा उपयोगिता जैसे चीजों के लिए केवल कुछ आंतरिक पुस्तकालय। Frontend framework : CSS क्लास नाम, JS द्वारा बुलाए गए। Frontend Styling Cache Storage, IndexedDB (ऑफ़लाइन मोड), CDN (Images & Fonts) Frontend Storage स्पैनर डीबी। API Storage : Google Meet, Google Contacts, Google Auth। External APIs : दिल की धड़कन, घटनाएं, सूचनाएं। Services : एक आंतरिक संकलक जो जेएस को डाउनलोड और तेजी से चलाता है। Other दिलचस्प समस्याएं निश्चित रूप से, एक कैलेंडर एक बड़ा CRUD ऐप है, लेकिन इसे आपको धोखा न दें - कई कठिन तकनीकी समस्याएं थीं जिन्हें हल किया जाना था। कैलेंडर API 2011 के बाद से REST+JSON (पहले REST+RSS शैली फ़ीड) डेटा मॉडल RFC 5545 iCalendar पुनरावृत्ति श्रृंखलाओं पर भारी झुकता है (माइक्रोसॉफ्ट और ऐप्पल स्वायत्त वस्तुओं का उपयोग करते हैं) ग्राहक घटनाओं में परिवर्तन होने पर एक वेबहॉक नोटिस प्राप्त करने के लिए देख सकते हैं / साइन अप कर सकते हैं गति के लिए वृद्धित्मक सिंक्रनाइज़ का समर्थन करता है ... लेकिन आपको खुद से समाप्ति और पुनः सिंक्रनाइज़ का प्रबंधन करने की भी आवश्यकता होती है प्रदर्शन मुद्दों को कम करने के लिए सीमाओं और दर सीमाओं का उपयोग करता है शक्तिशाली लेकिन प्राचीन. वे आपको जो कुछ भी करने की जरूरत है उसे करने के लिए पर्याप्त दे देंगे, लेकिन वे इसे आपके लिए समझ नहीं पाएंगे. HTML लेआउट हाँ, HTML संरचना वास्तव में दिलचस्प हो सकती है! चूंकि कैलेंडर दृश्य सामग्री से समृद्ध हैं, यदि तत्व अलग नहीं होते हैं। बड़े प्रदर्शन मुद्दों का सामना यहां सबसे महत्वपूर्ण HTML लेयर हैं: ग्रिड: पूरे दिन की पंक्ति, दिन के कॉलम, समयबद्ध घटनाएं, कंटेनर पूर्वावलोकन घटना, जिसे एक पंक्ति / स्तंभ में लॉक नहीं किया जा सकता है ड्रैग लेयर. यह आपको ग्रिड पर DND कार्यों को करने की अनुमति देता है फॉर्म: ग्रिड पर घटनाओं के बगल में डुबकी और एक पूर्ण स्क्रीन संवाद में विस्तार टॉस्ट: पुष्टि संदेशों के लिए Frontend एल्गोरिथ्म प्रत्येक कैलेंडर क्लाइंट में कुछ रसदार एल्गोरिथ्म होते हैं : 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 यह इन एलर्जी को पूरी तरह से लागू करने के लिए। कॉम्पस रीपो सेवाएं ये बाहरी कार्य घोड़े हैं जो क्लाइंट कोड को सरल और विश्वसनीय रहने की अनुमति देते हैं Heartbeat सेवा — GCal को विश्वसनीय होने की अनुमति देता है और आकर्षक रूप से ऑफ़लाइन मोड में वापस गिरता है Eventing सेवा – pub/sub style events जो ग्राहकों के लिए webhooks को power करते हैं. This allows other apps to build on the GCal API. सूचना सेवा – घटना से पहले आपके सूचनाओं के समय को समन्वित करना. क्लाइंट सिद्धांत रूप से इसे अकेले कर सकता है, लेकिन यह कम विश्वसनीय होगा. [ लेते हैं एक वैश्विक पैमाने पर CRUD ऐप का निर्माण वास्तुकला चार्ट से सरल लग सकता है, लेकिन यह सरलता अभी भी एक उच्च स्तर की निष्पादन की आवश्यकता है। एपीआई विश्वसनीयता: चूंकि इतने सारे ऐप्स उपयोगकर्ता के जीसीएल के साथ दो दिशाओं के सिंक्रनाइज़ पर भरोसा करते हैं, इसलिए एपीआई को सरल, विस्तार योग्य और विश्वसनीय होना चाहिए. If they mess up, they break an army of other apps downstream. डेटा सुरक्षा: कैलेंडर डेटा बेहद संवेदनशील है. वे यह सुनिश्चित करने के लिए बड़े पैमाने पर दायरे-आधारित भूमिकाओं पर भरोसा करते हैं कि केवल आपके द्वारा अधिकृत लोग / ऐप्स आपके डेटा तक पहुंच सकते हैं। निगरानी सेवाएं: स्वास्थ्य जाँच, लॉगिंग, और सिंक्रनाइज़िंग लगातार मंचों के पीछे हो रही हैं। स्केल की मांगों को देखते हुए, आप अपने लिए जीवन को आसान बना सकते हैं . not doing things चीजों को नहीं करना आपको ट्रेंडिंग स्टैक का उपयोग करने की आवश्यकता नहीं है। कल्पना करें कि उन्होंने अंगूठी में अपने ऐप को फिर से लिखने के लिए सब कुछ छोड़ दिया है. फिर प्रतिक्रिया करें. फिर स्विलेट करें. फिर NextJS. फिर HTMX. उन सभी के बाद Google कैलेंडर शिप किया गया था. जीसीएल ने जेएस को चुना, सही लाइन पर खींचा, और दशकों से 64MPH पर समुद्र तट पर रहा है. कोई भी परवाह नहीं करता है। आपको हर प्लेटफ़ॉर्म पर प्रकाशन करने की आवश्यकता नहीं है. अब Google कैलेंडर डेस्कटॉप ऐप को खींचें. मैं इंतजार करूंगा. आपको स्टाइलिंग रुझानों के साथ अनुसरण करने की आवश्यकता नहीं है. Bootstrap. Bulma. स्टाइलिंग घटकों. Tailwind. CSS वर्गों के नाम। आपको सर्वश्रेष्ठ यूएक्स की आवश्यकता नहीं है. अंधेरा मोड. फॉर्म जो स्थान को बचाते हैं. #FFFFFF लाइट मोड. पूर्ण पृष्ठ फॉर्म। आपको सर्वश्रेष्ठ प्रदर्शन करने की ज़रूरत नहीं है. उनके प्रदर्शन पर स्कोर 31/100 है। जीवन में की तरह, यह उत्पाद शिपिंग करते समय अपने आप को जानने के लिए भुगतान करता है। Google कैलेंडर आधुनिक ऐप होने की कोशिश नहीं कर रहा है जिसे कार्यकारी सहायक एक दिन में 40 मीटिंग्स की योजना बनाने के लिए उपयोग करते हैं (यह वही है जो Vimcal के लिए है)। Google कैलेंडर का उद्देश्य एक सरल ऐप होना है कि इसके 2 अरब उपयोगकर्ताओं में से कोई भी हाथ पकड़ने के बिना संचालित कर सकता है. यह पहुंच पर 88/100 स्कोर करता है. यूआई नहीं बदलता है. यह नीचे नहीं जाता है, और इसमें ऑफ़लाइन समर्थन है यदि ऐसा है। यह सिर्फ काम करता है। यह काफी है। इन गहरे डूबे को अपने इनबॉक्स में प्राप्त करने के लिए, मेरे समाचार पत्र पर साइन अप करें, . पूर्ण इंजीनियर
