Blitz: हल्का, मॉड्यूलर और विस्तार योग्य वेब रेंडरर

 (github.com/DioxusLabs)
2 पॉइंट द्वारा GN⁺ 2024-08-13 | अभी कोई टिप्पणी नहीं है. | WhatsApp पर शेयर करें

Blitz: हल्का, मॉड्यूलर और विस्तार योग्य वेब रेंडरर

Blitz एक "native" HTML/CSS रेंडरर है, जिसे "Dioxus Native" प्रोजेक्ट को सपोर्ट करने के लिए विकसित किया गया है। यह JavaScript इंजन की जगह native Rust API का उपयोग करता है, जिससे Rust reactivity/state management लाइब्रेरीज़ के साथ सीधे इंटरफेस किया जा सकता है।

फ़िलहाल दो frontend का समर्थन
  • HTML/Markdown frontend: HTML string को render कर सकता है। HTML और Markdown फ़ाइल preview के लिए उपयोगी है, लेकिन interactivity सीमित है।
  • Dioxus frontend: Dioxus VirtualDom को render कर सकता है। Dioxus के event handling के जरिए पूरी interactivity का समर्थन करता है।
Blitz की आधार तकनीकें
  • Stylo: Firefox का parallel, browser-grade CSS engine
  • Vello + WGPU: rendering
  • Taffy: box-level layout
  • Parley: text/inline-level layout
  • AccessKit: accessibility
  • Winit: window और input handling

नोट: this repository में Stylo का उपयोग करने वाला Blitz का नया version शामिल है। पिछले version का source code अभी भी legacy branch में उपलब्ध है, लेकिन उस पर सक्रिय विकास नहीं हो रहा है।

स्क्रीनशॉट

  • Dioxus renderer
  • HTML renderer (google.com rendering)

आज़माकर देखें

  1. इस repository को clone करें
  2. उदाहरण चलाएँ:
    • cargo run --example google
    • cargo run --example url https://myurl.com
    • दूसरे उदाहरण भी उपलब्ध हैं
    • बेहतर runtime performance के लिए --release जोड़ें
  3. Ctrl/Cmd + + / Ctrl/Cmd + - से scale बदलें, और layout rectangles दिखाने के लिए F1 दबाएँ

लक्ष्य

Blitz को HTML और CSS render करने के लिए डिज़ाइन किया गया है। यह browser की सभी features को support नहीं करता, और ऐसी "extra" features को वैकल्पिक रूप से उपलब्ध कराने की योजना है। मूल HTML/CSS rendering के लिए browser को यह अनावश्यक रूप से जटिल मानता है।

समर्थन के लिए नियोजित features:

  • आधुनिक HTML layout (flexbox, grid, table, block, inline, absolute/fixed आदि)
  • उन्नत CSS (complex selectors, media queries, CSS variables)
  • HTML form controls
  • AccessKit के माध्यम से accessibility
  • custom widgets के जरिए extensibility

समर्थित नहीं की जाने वाली features:

  • webrtc, websockets, bluetooth, localstorage आदि

दूसरी भाषाओं (JavaScript, Python आदि) के for Blitz bindings अभी नहीं हैं, लेकिन contributions का स्वागत है।

आर्किटेक्चर

Blitz कई हिस्सों में बँटा हुआ है:

  • blitz-dom: core DOM abstraction, जिसमें style resolution और layout शामिल हैं, लेकिन drawing/painting शामिल नहीं है
  • blitz: blitz-dom में Vello/WGPU-आधारित renderer जोड़ता है
  • dioxus-blitz: Dioxus integration layer, जो Blitz का उपयोग करके Dioxus apps render करती है। अभी dioxus-blitz में HTML renderer भी शामिल है, लेकिन भविष्य में इसे अलग package में विभाजित किया जा सकता है।

स्थिति

Blitz अभी experimental है। इसे उपयोग योग्य स्थिति में लाने के लिए सक्रिय रूप से काम चल रहा है, लेकिन अभी इसके साथ app बनाना अनुशंसित नहीं है।

TODO

  • core DOM tree abstraction
  • html5ever का उपयोग करके style parsing
  • html5ever documents के लिए style calculation
  • Taffy का उपयोग करके layout calculation
  • WGPU का उपयोग करके rendering

Rendering

  • window में rendering
  • image में rendering
  • gradients
  • borders/outlines
  • raster images (png, jpeg आदि)
  • zoom
  • SVG
    • external SVG (basic support)
    • inline SVG
  • shadows
  • animations/transitions
  • standard form controls (checkbox/dropdown/slider आदि)
  • custom widgets
  • shadow elements

Layout

  • inline (आंशिक समर्थन - implementation अभी परिपक्व नहीं)
  • block
  • flexbox
  • grid
    • named grid lines
    • subgrid
  • table
  • z-index
  • अतिरिक्त CSS features
    • box-sizing: content-box
    • calc()
    • position: static
    • direction: rtl
    • transform

Text

  • font loading
    • system font loading
    • web font loading
  • text
    • shaping / Bidi
    • layout / line breaking
    • font size / line height
    • text color
    • bold / italic
    • underline / strikethrough
  • text selection

Input

  • scroll
    • root view
    • overflow: scroll elements
  • hover detection
  • click handling
  • text input

Performance

  • hot reloading
  • style और layout को दोबारा resolve किए बिना scroll
  • style caching
  • layout caching

अन्य

  • multi-window
  • accessibility tree
  • focus
  • dev tools
  • context menu के लिए hooks
  • arbitrary rendering surfaces में elements लाने के लिए use_wgpu_context()

लाइसेंस

यह प्रोजेक्ट Apache 2.0 और MIT लाइसेंस के तहत dual-licensed है। अलग से उल्लेख न होने पर, stylo-dioxus में शामिल करने के लिए उपयोगकर्ता द्वारा जानबूझकर सबमिट किए गए सभी contributions अतिरिक्त शर्तों के बिना MIT लाइसेंस के अंतर्गत लाइसेंस किए जाते हैं।

GN⁺ की संक्षिप्त प्रस्तुति

  • Blitz एक Rust-आधारित हल्का HTML/CSS रेंडरर है, जिसे Dioxus प्रोजेक्ट को सपोर्ट करने के लिए विकसित किया गया है।
  • यह browser की जटिल features को बाहर रखकर बुनियादी HTML/CSS rendering पर केंद्रित है।
  • यह experimental चरण में है और अभी app development के लिए अनुशंसित नहीं है।
  • समान प्रकार के प्रोजेक्ट्स में Servo, WebRender आदि शामिल हैं।

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

अभी कोई टिप्पणी नहीं है.

अभी कोई टिप्पणी नहीं है.