रीयल-टाइम वेक्टर ग्राफिक्स के लिए Rive Renderer ओपन सोर्स हुआ

• Rive ने अपने इन-हाउस बनाए गए Rive Renderer को ओपन सोर्स के रूप में जारी किया है, जिससे Rive content, animations और runtime के लिए तैयार किया गया एक ही rendering foundation सभी platforms पर इस्तेमाल किया जा सके
• Renderer का लक्ष्य बहुत सारे vector graphics और शार्प text render करते हुए भी 120fps animation और high antialiasing quality बनाए रखना है
• पहले Skia और HTML Canvas API जैसे कई renderers पर निर्भरता थी, इसलिए किसी एक backend में मौजूद न होने वाले features को सभी platforms पर रिलीज़ करना मुश्किल था
• एक single renderer की वजह से blur, drop shadow, glow, tapered stroke जैसे effects को कई runtimes में ज्यादा consistent तरीके से जोड़ा जा सकता है
• Implementation antialiased vector paths को triangle patches में reduce करता है और GPU की parallel triangle rasterization pipeline का लाभ लेता है; इसे iOS, Android और Web पर enable किया जा सकता है, और Unity व Unreal runtimes में यह पहले से integrated है

---

Rive Renderer का सार्वजनिक होना और इसे बनाने की पृष्ठभूमि

• Rive Renderer Rive content, animations और runtime के लिए इन-हाउस बनाया गया renderer है
• स्क्रीन पर बहुत सारे vector graphics और text draw करने की स्थितियों में भी इसका लक्ष्य 120fps animation और साफ antialiasing quality है
• इसे internally बनाने में 2 साल लगे, और इससे Rive Editor में designer द्वारा बनाने के समय से लेकर runtime में user द्वारा देखने और interact करने तक, पूरे experience पर अधिक direct control संभव हुआ
• Runtime में तेज़ चलने वाले content को ही जानबूझकर generate करने के लिए optimize किया गया है, ताकि designers performance implementation के तरीकों की कम चिंता करके creation पर focus कर सकें

कई renderer वाली संरचना की सीमाएं और single renderer का असर

• शुरुआती Rive ने Skia और HTML Canvas API जैसे मौजूदा open source rendering solutions का इस्तेमाल किया
• users को अपनी पसंद का renderer आसानी से जोड़ने देने वाली bring-your-own-renderer संरचना को support करना जारी रहेगा
• लेकिन consistent और optimized in-house renderer न होने पर product roadmap और नए features का development platform-specific limitations में बंध जाता था
• कई renderers इस्तेमाल करने वाली संरचना में, जब कोई feature किसी एक renderer में नहीं होता था, तो वह Rive चलने वाले सभी backends पर काम नहीं करता था, जिससे उस feature को release करना मुश्किल हो जाता था
• Single renderer से जिन effects को जोड़ना आसान होता है, उनमें blurs, drop shadows, glows, tapered strokes शामिल हैं

Implementation का तरीका और platform support

• Rive Renderer antialiased vector paths को अपने खास triangle patches में reduce करने वाले geometric approach पर आधारित है
  • यह desktop और mobile GPU में built-in बड़े पैमाने की parallel triangle rasterization pipeline का लाभ लेता है
  • एक खास triangulation method से 3D hardware का इस्तेमाल कर Bézier curves draw करता है
• Third-party renderer का उपयोग जारी रखा जा सकता है, लेकिन Rive-specific features और overall experience के लिए Rive Renderer इस्तेमाल करने की सिफारिश की जाती है
• iOS, Android और Web पर official guide के अनुसार Rive Renderer enable किया जा सकता है
• Code GitHub पर सार्वजनिक है, Unity और Unreal runtimes में integrated है, और आगे और integrations planned हैं

[GN⁺]

Hacker News की राय

• मैं अभी-अभी GDC बूथ पर था, और यह UI/UX designers को games में ज़्यादा काम खुद करने देने वाले program के तौर पर सच में अच्छा लग रहा था
  आम तौर पर designer Figma में कई दिन काम करता है, फिर programmer को hand over करता है, और programmer किसी-न-किसी वजह से कहता है कि इसे implement नहीं किया जा सकता—फिर यही आना-जाना चलता रहता है
  Unreal Engine में AAA games के लिए अच्छा UI framework कम है, इसलिए दिक्कत और बढ़ जाती है। इस tool का workflow अब तक देखे गए workflows में सबसे अच्छा है और यह Unreal Engine और Blueprints के साथ स्वाभाविक रूप से जुड़ता लगता है
  व्यक्तिगत रूप से मैं काफी उत्साहित हूं, क्योंकि लगता है UI/UX designers programmer की मदद के बिना काम कर पाएंगे। Game programmers आम तौर पर UI काम पसंद भी नहीं करते

  • अगर मैं UI/UX designer होता तो शायद game sector में काम करना चाहता। Productivity software में पहले से गहराई तक जमे हुए paradigms और abstractions बहुत हैं, इसलिए उन्हें बदलने की कोशिश करो तो users शिकायत करते हैं, लेकिन games में नए UI/UX decisions को अक्सर झुंझलाहट से ज़्यादा जिज्ञासा के साथ लिया जाता है
    शायद इसे इस फर्क से समझाया जा सकता है कि आप काम करने बैठते समय और game खेलने बैठते समय किस mindset में होते हैं
  • मैं मानता हूं कि design और programming के बीच handoff उबाऊ होता है, लेकिन जानना चाहूंगा कि आपको UMG कहां कमज़ोर लगता है। इसकी आदत पड़ने के बाद UI implement करना मुझे काफी मज़ेदार लगा
  • अफसोस है कि आजकल Unreal Engine का UI/UX इतना खराब हो गया है। कुछ समय पहले मैंने दोस्तों के साथ UT99 खेला था, और फिर से हैरान हुआ कि in-game UI से लेकर settings और server browser menus तक सब कितना powerful, intuitive और flexible था
    यह उन पहले पलों में से था जब मुझे लगा कि मैं कोई बूढ़ा आदमी हूं जो चिल्ला रहा है कि modern version कितना घटिया है

• GPU tessellation से 2D vector graphics render करने पर काफी research हो रही है, और Raph Levien के काम जैसी धारा वाली technology को असली product के रूप में लाना काफी शानदार है
  मैंने Rive इस्तेमाल नहीं किया है, इसलिए सोच रहा हूं कि यह सिर्फ शानदार animations बनाने के लिए है या इससे वैसी dynamic UI भी बनाई जा सकती है जैसी immediate-mode GUI library से बनाई जाती है

  • ऐसे customers हैं जो Rive से पूरा UI ship कर रहे हैं। Games में भी इसे अपनाया जा रहा है, कुछ शानदार AAA titles पहले से underway हैं, और product UI में भी इसका use हो रहा है
    https://rive.app/game-ui
    https://rive.app/blog/how-age-of-learning-uses-rive-to-a-b-t...
  • Dynamic UI components के लिए Rive अच्छा होने की एक वजह editor में गहराई से supported शानदार state machine है: https://help.rive.app/editor/state-machine
    मैंने Rive से काफी complex UI बनाई है, लेकिन external events के आधार पर elements को programmatically जोड़ने या UI text बदलने वाले हिस्से को अभी explore नहीं किया है

• लगता है यह experiment पहले ही Flash के साथ किया जा चुका है। Macromedia/Adobe ने player को free किया और tools के लिए charge किया; Rive भी player को open source कर editor के लिए charge करना चाहता दिखता है
  Rive थोड़ा अलग है, क्योंकि यह Unity या Unreal जैसे दूसरे platforms इस्तेमाल करने वाले game developers—मसलन cinematic जैसी चीज़ embed करने वालों—को target करता दिखता है
  फिर भी open source player का होना यह संकेत देता है कि Rive पूरे experience पर control चाहता है, इसलिए Flash याद आता है

  • Flash शानदार था। बेहतर Flash बनाने की ज़रूरत लंबे समय से थी, और Rive नए Flash की तरफ एक अच्छा प्रयास लगता है
  • तुलना अच्छी है, और यह भी महत्वपूर्ण है कि यह सिर्फ renderer है। MIT license के तहत release होना खुशी की बात है, लेकिन सोचता हूं कि compatible content बनाने के लिए कितने open source tools होंगे, और existing tools के दूसरे formats से export बनाना कितना आसान होगा
  • सोचने पर मजबूर करता है कि अगर player और file format खुले होते और third-party tools को reverse engineering न करनी पड़ती, तो Flash कितना बेहतर हो सकता था
  • पहले Scaleform था, और लगता है वह Flash के साथ ही बंद हो गया: https://en.wikipedia.org/wiki/Scaleform_GFx

• घोषणा के समय से ही इसका इंतज़ार कर रहा था। पहले यह Skia इस्तेमाल करता था, और पूरा app व rendering output Flutter से बना था। अब Flutter के पास नया rendering engine Impeller है, जो Skia की तुलना में Flutter-specific समस्याओं के लिए ज़्यादा optimized है
  पहले जब मैंने Impeller team से पूछा था कि वे Rive renderer को कैसे देखते हैं, तो उन्होंने कहा था कि यह vector graphics के लिए शानदार है, लेकिन Impeller को text सही तरह से दिखाने जैसी UI-related rendering समस्याएं भी संभालनी पड़ती हैं, इसलिए दोनों की one-to-one comparison नहीं की जा सकती
  अब जब यह renderer open source हो गया है, उम्मीद है दोनों teams एक-दूसरे से सीख पाएंगी

  • अगर मैं गलत हूं तो सुधारें। क्या fonts भी पहले से vector graphics के रूप में render नहीं होते? TTF और OTF vector formats ही हैं, है न?

• मुझे Rive product और company भी पसंद हैं और open source भी, लेकिन यह Rive runtime का हिस्सा rendering abstraction layer है, जिसे Rive Editor से content बनाना पड़ता है, और इसे MIT license के तहत publish किया गया है
  मैं open-sourcing के लक्ष्य और उसके आसपास वे कैसी बड़ी community बनाना चाहते हैं, इसे लेकर curious हूं
  यह भी सोच रहा हूं कि क्या कोई और project याद आता है जिसे सिर्फ renderer अपनाकर फायदा हो सकता है

  • लगता है proprietary editor से revenue जारी रखते हुए distribution और ecosystem बनाने के लिए वे open source renderer देना चाहते हैं। अगर वे दूसरों को इस renderer को target करने के लिए प्रेरित कर सकें, तो renderer जितना बेहतर होगा उतना ही फायदा होगा
    मेरी निजी रुचि भी है। फिलहाल मैं canvasAPI और pixi इस्तेमाल करता हूं, और 16ms frame budget के अंदर 2D drawing की limits से अक्सर टकराता हूं
  • GitHub के अनुसार, इस repository में renderer code के साथ सीधे interface करने का तरीका दिखाने वाले examples हैं
    [0] https://github.com/rive-app/rive-renderer
  • Vector graphics बनाने के लिए खास editor ज़रूरी नहीं है। Games से लेकर UI toolkits तक कई projects को vector graphics renderer चाहिए होता है, और इसी वजह से Skia, Cairo और अब Rive जैसी libraries मौजूद हैं
  • “Macromedia Flash न बनना” के लिए यह एक चतुर strategy लगती है

• किसी निजी hobby project में इस्तेमाल करके देखने जितना यह सचमुच शानदार दिखता है
  लगता है कि moveTo, lineTo जैसे कुछ हद तक standard Cairo/Skia/canvas/NanoVG API दिए गए हैं, इसलिए उम्मीद है कि इसे सीखने में बहुत मेहनत नहीं लगेगी
  कम-से-कम यहाँ lineTo दिखता है: https://github.com/rive-app/rive-renderer/blob/main/renderer...

• सोच रहा हूँ कि इस rendering performance की Skia या Pathfinder से तुलना कैसी होगी। Pathfinder में, अगर hardware support करे, तो path को triangles में बदलने वाला step GPU compute से भी process किया जा सकता है
  अधिक comprehensive compute-based 2D rendering approach के तौर पर Vello भी है

  • सावधानी से benchmarking करके देखना चाहूँगा। यह renderer काफी competitive लगता है, लेकिन meaningful results पाने के लिए benchmarking सचमुच मुश्किल है
    शुरुआती राय में performance hardware पर, खासकर pixel local storage support पर, काफी निर्भर लगती है। अब तक जो देखा है, उसमें Apple Silicon आदर्श sweet spot है। Hardware tile-level binning और sorting support करता है, और tile के अंदर fragment shader execution को serialize करने पर भी ठीक काम करता है
    दूसरे hardware पर ऐसे call serialization की cost कहीं ज़्यादा होने की उम्मीद है
    Vello की ओर से अभी तक गहरी benchmarking न करने की एक वजह यह है कि performance story अभी पूरी नहीं हुई है। अभी device atomic operations से bounding boxes इकट्ठा करने की समस्या है, और segment reduction के लिए monoid इस्तेमाल करने वाला prototype implementation[2] काफी बेहतर नतीजे दिखाता है
    इसके अलावा f16 operations करने की योजना है, जो खासकर mobile पर बड़ा फायदा दे सकते हैं। कई prefix-sum stages के लिए subgroups इस्तेमाल करने की योजना है, और subgroups WebGPU में शामिल किए जा रहे हैं[3]
    कुल मिलाकर खुशी है कि यह renderer open source के रूप में release हुआ है, और fast GPU vector graphics rendering में activity बढ़ना भी अच्छी बात है। कभी ऐसा भविष्य देखना चाहूँगा जहाँ CPU path rendering को पुराना माना जाए, और यह release उस दिशा में हमें और करीब लाता है
    [1]: https://dawn.googlesource.com/dawn/+/refs/heads/main/docs/da...
    [2]: https://github.com/linebender/vello/issues/259
    [3]: https://github.com/gpuweb/gpuweb/issues/4306
  • इस्तेमाल की गई GPU technologies और repository committers के नाम देखकर, मुझे काफी यकीन है कि कम-से-कम Skia और Pathfinder दोनों से मुकाबला कर सकता है। Vello के बारे में ठीक से नहीं जानता
    यह ऐसे लोगों द्वारा चुने गए ठोस technology choices लगते हैं जो जानते हैं कि वे क्या कर रहे हैं, और performance व quality को खुद परखने लायक हैं
    ये GPU-first renderers थोड़े-थोड़े अलग approaches अपनाते हैं, और संभव है कि quality, performance, hardware/driver support और integration difficulty के multi-dimensional space में हर एक का अपना best area हो। अगर इन चार में से कोई एक पसंद न आए, तो बाकी को भी देखना ठीक रहेगा
  • नई benchmarking करनी होगी। शुरुआती tests के बाद Rive Renderer और तेज़ हो गया है: https://twitter.com/guidorosso/status/1595187838454140928
  • जिन runtime implementations को देखा, उनमें कम-से-कम एक Skia के ऊपर implement किया गया था। लगता है कि यह कई संभावित backends support करता है

• व्यक्तिगत रूप से यह सचमुच खुशी की बात है
  पिछले करीब 6 महीनों से native mobile apps वाली healthcare company से लेकर गहरी game companies और products तक, कई clients के लिए Lottie और पुराने solutions की जगह Rive adoption push करता रहा हूँ। अब लगता है कि यह आखिरकार गति पकड़ चुका है और “adoption-ready” स्थिति में है
  उन discussions में आखिरी संभावित चिंता यही बची थी कि latest renderer closed था और अभी final form में नहीं था
  इस decision और Rive team के overall काम की वजह से उम्मीद है कि यह problem area लगातार बेहतर होता रहेगा। Shadows, blur जैसी features भी release हों तो बहुत दिलचस्प होगा

  • शायद basic सवाल हो, लेकिन Rive क्यों?
    Lottie file format के रूप में काफी स्थापित होता जा रहा है, workflow भी अच्छी तरह set है, और यह अपेक्षाकृत simple है
    जानना चाहूँगा कि Rive ऐसा क्या बहुत बेहतर करता है कि इसे push करना जरूरी लगे

• Repository: https://github.com/rive-app/rive-renderer

  • https://github.com/rive-app/rive-renderer#install-premake5
    संबंधित: https://news.ycombinator.com/item?id=39754770 (Build System Schism: The Curse of Meta Build Systems)

• यह समस्या किसी निश्चित समाधान के बिना, इसे हल करने वाले software लगातार पैदा करती दिखती है
  यह थोड़ा अजीब इसलिए है, क्योंकि अगर pixel sampling function और color-space metric दिए हों, तो किसी भी vector graphics scene के लिए वस्तुनिष्ठ रूप से सही एक rendering होती है। हर output pixel value उस function और scene के convolution के सबसे करीब representable color होनी चाहिए, और scene को R^2 से R तक जाने वाले function के रूप में, तथा color को linear color system में व्यक्त किया जा सकता है
  GPU compute और curve tessellation, या curves के सटीक symbolic integration को numerically calculate करते समय error bounds को अच्छी तरह संभाला जाए, तो यह achievable लगता है
  साथ ही ऐसा समाधान तेज rendering के लिए approximation level को adjust करना भी आसान बना सकता है

  • मुझे लगता है यह बात सही है। 2D rendering काफी अच्छी तरह defined है। समस्या GPU ecosystem की जबरदस्त complexity है
    अगर बस एक ठीक-ठाक parallel computer होता, तो यह इतना मुश्किल नहीं होता; लेकिन असल में rendering logic को GPU infrastructure द्वारा supported hacks के किसी खास combination के मुताबिक adapt करना पड़ता है, और हर एक की अपनी बेहद खास constraints और trade-offs होते हैं
    आपको जल्द आने वाला GPU-friendly stroke expansion paper पसंद आएगा। उसका core यही है कि curves के एक खास curvature metric के लिए exact symbolic integration को error bounds वाली numerical method से handle किया जाए
    उत्सुक हों तो अभी भी Vello main के shader/flatten.wgsl code में देख सकते हैं
  • तो शायद आपको खुद ही vector graphics library लिखनी पड़ेगी