Yjs का उपयोग करके इंटरैक्टिव लर्निंग

 (learn.yjs.dev)
1 पॉइंट द्वारा GN⁺ 2025-01-18 | 1 टिप्पणियां | WhatsApp पर शेयर करें

  • परिचय

    • Learn Yjs, Yjs CRDT लाइब्रेरी का उपयोग करके रियल-टाइम सहयोगी एप्लिकेशन बनाना सीखने के लिए एक इंटरैक्टिव ट्यूटोरियल सीरीज़ है.
    • यह पेज स्वयं रियल-टाइम सहयोगी एप्लिकेशन का एक उदाहरण है, जिसमें अन्य उपयोगकर्ताओं के कर्सर रियल टाइम में दिखाई देते हैं.
    • पौधों पर क्लिक करने पर बदलाव अन्य उपयोगकर्ताओं तक भी दिखाई देते हैं.

  • Yjs की बुनियाद

    • Yjs की मूल अवधारणाओं से शुरुआत करते हुए, यह वितरित एप्लिकेशन में स्टेट को संभालने की तकनीकों पर चर्चा करता है.
    • यह बताता है कि CRDT क्या है और इसका उपयोग क्यों किया जाता है.
    • यह सहयोगी एप्लिकेशन में आने वाली संभावित समस्याओं और उनसे बचने के तरीकों को प्रस्तुत करता है.
    • खोजे जा सकने वाले डेमो और कोड अभ्यासों के ज़रिए आप Yjs के काम करने के तरीके का अनुभव कर सकते हैं.

  • डेमो उदाहरण

    • प्रत्येक बॉक्स एक अलग कंप्यूटर (क्लाइंट) को दर्शाता है जो Yjs का उपयोग करने वाला एप्लिकेशन चला रहा है.
    • एक क्लाइंट पर इंटरैक्ट करने से दूसरे क्लाइंट पर भी अपने-आप सिंक हो जाता है.
    • ऊपर बाईं ओर के स्लाइडर से नेटवर्क लेटेंसी समायोजित करके क्लाइंट्स के बीच इंटरैक्शन देखा जा सकता है.

  • साइट परिचय

    • Learn Yjs, रियल-टाइम ऐप्स बनाने वाले प्लेटफ़ॉर्म Jamsocket का एक प्रोजेक्ट है.
    • इस पेज के रियल-टाइम कर्सर और मल्टीप्लेयर गार्डन, ओपन सोर्स Yjs सर्वर Y-Sweet पर चलते हैं.
    • वेबसाइट Astro से बनाई गई है, और इंटरैक्टिव डेमो व अभ्यास React और Yjs से तैयार किए गए हैं.

संबंधित पढ़ाई

1 टिप्पणियां

 
GN⁺ 2025-01-18
Hacker News राय

  • Jamsocket डेवलपर ने Yjs का उपयोग करके collaborative और local-first ऐप्स बनाने में मदद करने वाला एक interactive tutorial बनाया है। Yjs एक CRDT लाइब्रेरी है, इसलिए distributed state के काम से परिचित न होने वाले लोगों के लिए इसमें learning curve मौजूद है। यह tutorial सहज है और explorable demo तथा coding exercises के जरिए बुनियाद से समझ बनाने के लिए डिज़ाइन किया गया है

  • Yjs की generalized capabilities जटिल हो सकती हैं, खासकर जब कई objects एक-दूसरे से जुड़े हों। सब कुछ एक ही document में रखने वाला सरल मॉडल पूरे database को ट्रांसफर करने की समस्या पैदा करता है। इसलिए items को अलग-अलग objects में बाँटकर उन्हें सीधे persist करने का तरीका चाहिए

    • Subdocuments का उपयोग करके इस समस्या को हल किया जा सकता है, लेकिन कुछ Providers इसे support नहीं करते। Yjs का core protocol documented नहीं है, और उससे जुड़ा code बिखरा हुआ है

  • Yjs का एक फ़ायदा यह है कि इससे P2P परिणाम आसानी से मिल सकते हैं। लेकिन backend persistence, conflict resolution, history rewind जैसी चीज़ें कठिन engineering चुनौतियाँ हैं। Platejs जैसे block editor के साथ अच्छा अनुभव चाहिए था, और Liveblocks जैसे solutions developer experience को सरल बनाने की कोशिश कर रहे हैं

  • Yjs का उपयोग करके एक ऐसा ऐप विकसित किया जा रहा है जिसे offline में भी काम करना चाहिए। यह real-time collaborative app नहीं है, लेकिन अगर server को एक collaborator माना जाए तो कई तरह के use cases की कल्पना की जा सकती है

  • Yjs को एक छोटे प्रोजेक्ट में इस्तेमाल किया गया था, और client side सीखना व इस्तेमाल करना आसान था। Server side पर Node के अलावा दूसरी languages में examples लगभग नहीं थे, इसलिए LevelDB-आधारित persistence का उपयोग करते हुए Node के y-websocket को थोड़ा modify करके इस्तेमाल किया गया

  • fractional indexing नाम की तकनीक में index को integer की जगह fraction के रूप में उपयोग किया जाता है। सवाल यह है कि इसे कितनी बार इस्तेमाल किया जा सकता है

  • interactive demo का latency slider network latency की बजाय debounce buffer की तरह काम करता हुआ लगता है। ऐसा क्यों है, यह समझना मुश्किल है

  • interactive demo बहुत सुंदर है। जिज्ञासा है कि इसे बनाने के लिए कोई library इस्तेमाल हुई थी या नहीं

  • four-leaf clover मिल गया, लेकिन किसी ने उसे बिगाड़ दिया। निर्माता की तारीफ़ करनी चाहिए। यह मज़ेदार है

  • banner image वाला गेम बचकाना है, लेकिन मज़ेदार है