>_ DevTrendsnl

Taal

Home

Talen

Secties

Frontend Backend Mobiel DevOps AI / ML GameDev Blockchain Embedded Beveiliging
Rust

HTML en CSS Renderen in Rust Zonder Log Chromium

Elke keer dat iemand een kleine desktop-app met Electron verpakt, huilt ergens een RAM-stick. Zelfs alternatieven zoals Tauri zijn nog steeds afhankelijk van de systeem-WebView, wat zijn eigen quirks heeft op verschillende besturingssystemen. De Dioxus-frameworkontwikkelaars besloten de moeilijke weg te bewandelen en hun eigen lichtgewicht renderingengine in Rust te schrijven. Ze noemden het project Blitz.

screenshot

Waarom Nog Een Engine Bouwen

Chromium of WebKit bevatten gigabytes aan code. Ze bevatten ondersteuning voor WebGL, WebSockets, WebRTC, Bluetooth, IndexedDB en honderden browser-API's. Maar als je alleen een gebruikersinterface wilt renderen op basis van HTML en CSS, wordt bijna al dat ballast overbodig.

Blitz stroopt alles onnodige weg. De engine richt zich op één enkele taak: HTML/CSS parsen, de paginalay-out berekenen en het resultaat naar het scherm of GPU-textuur uitvoeren. Er is standaard geen JavaScript-engine. De netwerkstack is minimaal en kan alleen resources laden via HTTP als je dat expliciet wilt. Systeeminteractie blijft in je Rust-code.

Modulaire Architectuur

De makers van Blitz zijn niet vanaf nul begonnen. Ze hebben bewezen componenten uit de open-source-community genomen en ze samengevoegd tot een uniform systeem:

  • CSS-parsing en style-berekening wordt afgehandeld door Stylo — de CSS-engine van Mozilla Firefox en Servo.
  • Flexbox- en CSS Grid-lay-outberekeningen worden afgehandeld door de Taffy-bibliotheek.
  • Tekstrendering wordt gedaan met Parley.
  • HTML-parsing wordt afgehandeld door html5ever.
  • Grafisch renderen gebeurt via de AnyRender-abstraction en Vello.

Deze structuur biedt flexibiliteit. Als je alleen HTML hoeft te parsen en elementafmetingen wilt bepalen zonder naar het scherm te renderen, heb je alleen crates blitz-dom en blitz-html nodig. Voor het bouwen van native Dioxus-applicaties integreer je dioxus-native.

Hoe Het Er Uitziet in Code

Het project is in vroege pre-alpha, dus je zult het vanaf de bron moeten bouwen. Je kunt de voorbeelden in een minuut uitproberen:

git clone https://github.com/DioxusLabs/blitz
cd blitz
cargo run --release --package browser

De repository bevat verschillende demo-scripts. Je kunt bijvoorbeeld een eenvoudige Markdown-viewer rechtstreeks vanuit de console uitvoeren:

cargo run --release --package readme ./README.md

Voor degenen die al in Dioxus schrijven en de WebView-afhankelijkheid willen elimineren, biedt de repository een native build. Voeg simpelweg een directe link naar de git-versie toe in Cargo.toml:

[dependencies]
dioxus-native = { git = "https://github.com/DioxusLabs/blitz", features = ["prelude"] }

Daarna verandert de standaard import use dioxus::prelude::* naar use dioxus_native::prelude::*, en wordt de UI weergegeven via Blitz.

Beperkingen en Huidige Status

Commerciële producten bouwen met Blitz is nog prematuur. De ontwikkelaars waarschuwen eerlijk over talrijke bugs en niet-geïmplementeerde functies. Basale CSS-selectors, Flexbox, eenvoudige formulieren en CSS-variabelen werken al. Complexe media queries of specifieke lay-outattributen kunnen zich echter onvoorspelbaar gedragen.

Het project heeft wel sterke punten. Integratie met de AccessKit-bibliotheek biedt out-of-the-box ondersteuning voor schermlezers en toegankelijkheidssystemen. En renderen via WGPU maakt het mogelijk om HTML-interfaces direct in te bedden in game-engines of 3D-scenes.

Is Het De Moeite Waard Om Te Proberen

Blitz is ontworpen als een tool voor degenen die gek zijn van zware browserwrappers in desktopontwikkeling. Het zal niet snel een volledige vervanger worden voor Electron.

Voor nu zal het project aanspreken bij Rust-systeemprogrammeurs, graphics-engine-onderzoekers en Dioxus-ecosysteem-enthousiastelingen. Het volgen van de ontwikkeling van de repository is de moeite waard, als alleen al om te zien hoe Stylo en Taffy evolueren naar een lichtgewicht alternatief voor CEF.

Gerelateerde projecten