ThorVG 1.0

Am 31. Januar, nach anderthalb Jahren kontinuierlicher Entwicklung, wurde die Version 1.0 der leichten und tragbaren plattformübergreifenden Vektorgraphik-Bibliothek veröffentlicht ThorVG, die zur Visualisierung von Vektorszene und Animationen gedacht ist. Es wird die Unterstützung zum Laden von Dateien in den Formaten Lottie und SVG Tiny 1.2 (eine Liste der umgesetzten SVG Tiny-Funktionen im Wiki des Projekts).

Die Bibliothek bietet benutzerfreundliche APIs für den Import, die Erstellung und Anzeige von Vektorgrafik sowie für deren Export in verschiedene Grafikformate, was sie universell für den Einsatz in unterschiedlichen Softwareplattformen und Anwendungen zur Visualisierung von grafischen Inhalten macht. Es werden auch die Konsolen-Utilities lottie2gif und svg2png bereitgestellt.

ThorVG wird zur Darstellung von Vektorgrafik in Projekten wie Tizen OS, Godot Engine, LVGL und Playern dotLottie.

Das Projekt ist in C++ (Standard C++14) geschrieben und wird unter der MIT-Lizenz verbreitet.

Dies ist nicht einfach ein Update – es ist die neu gestaltete Grundlage für hochleistungsfähige, skalierbare und portable 2D-Vektorgrafik auf allen Plattformen und Geräten. Während der Entwicklung hat sich ThorVG zu einem ausgereiften, produktionsbereiten Grafik-Engine entwickelt, die bewährte Qualität und Leistung in realen Anwendungen demonstriert hat.

ThorVG hat schnell an Beliebtheit gewonnen und ein wachsendes Interesse in der Community hervorgerufen, was seinen Übergang von einem frühen Projekt zu einer weithin anerkannten und praktisch eingesetzten Vektorgrafik-Engine zeigt, die für echtes plattformübergreifendes Nutzen bereit ist.

Änderungsprotokoll:

• Erweiterte Text-Rendering-Möglichkeiten, reichhaltige visuelle Effekte und Unterstützung für präzises Overlapping zur Verbesserung graphischer Ausdrucksformen.
  • Unterstützung für horizontale und vertikale Ausrichtung, die eine präzise Steuerung der Platzierung von Text in verschiedenen Benutzeroberflächenkontexten ermöglicht.
  • Automatische Zeilenumbruchfunktionen mit Auswahlmöglichkeiten für den Modus: nach Zeichen, nach Wörtern, intelligenter Umbruch und Ellipsenverkürzung zur Behandlung von Überläufen.
  • Unterstützung für manuelle Zeilenumbrüche, wodurch Entwickler die Kontrolle über Zeilenumbrüche mit Hilfe von Zeilenanfangssymbolen wie \n haben. Dies ermöglicht eine präzise Formatierung mehrzeiliger Textblöcke, insbesondere in dynamischen Layouts oder Textanimationen.
  • Unterstützung für anpassbare Abstände zwischen Schriftzeichen, die präzise Anpassungen zur Verbesserung der Lesbarkeit oder zur Erreichung bestimmter typografischer Stile ermöglichen.
  • Unterstützung für Textumrandungen, die stilistische Effekte erzeugen und den Kontrast auf verschiedenen Hintergründen verbessern (Screenshot 1).
  • Ein umfassenderes und konsistenteres System von Überblendmodi wurde eingeführt, das das Verhalten der Überblendmodi erheblich verbessert und die Formeln und Logik der Komposition an Industriestandards wie Lottie, SVG und die W3C-Spezifikation „Compositing and Blending“ anpasst. Diese Verbesserungen gewährleisten eine höhere visuelle Konsistenz und plattformübergreifende Kompatibilität, insbesondere in Web- und Animations-Workflows.
  • Die folgenden Überblendmodi werden implementiert und unterstützt: „Farbton“, „Sättigung“, „Farbe“ und „Helligkeit“ unter Verwendung der HSL-Farbraumkomposition. Diese Modi verbessern die Kompatibilität mit Lottie-Schichteffekten und künftiger Unterstützung für SVG-Mischung (Screenshot 2).
  • Bedeutende Verbesserungen und Erweiterungen bei den visuellen Effekten auf Szenenebene machen Vektorgrafiken ausdrucksvoller und visuell ansprechender:
    • Schatteneffekt mit Gaußschem Weichzeichner (Video-Demonstration).
    • Farbersatzmethoden, die das Erscheinungsbild von Grafiken durch Anpassung der Art und Weise, wie Farben angewendet, gemischt oder zugeordnet werden, basierend auf dem Farbton ändern (Video-Demonstration).
  • Neue Hilfsfunktionen wurden hinzugefügt, um die interaktiven Möglichkeiten zu erweitern. Dazu gehört die Unterstützung von Abfragen räumlicher Informationen (In Chrome 76 bleibt zudem ein weiteres Problem unbehandelt.) und die Erkennung von Treffern auf dargestellte Objekte (Video-Demonstration).
• Erweiterte Lottie-Animationsmöglichkeiten für plattformübergreifende Wiedergabe, einschließlich modularer, leistungsoptimierter Web Player-Voreinstellungen für Rendering-Modi (CPU/GPU)
  • Signifikante Verbesserungen bei der Unterstützung von Lottie-Animationen mit verbesserter Kompatibilität, Flexibilität und Interaktivität auf allen Plattformen. Das Spektrum der unterstützten Lottie-Funktionen und -Ausdrücke wurde erweitert, und Entwicklertools wurden bereitgestellt, mit denen das Verhalten von Animationen zur Laufzeit dynamisch gesteuert werden kann. Dies macht ThorVG zu einer der leistungsstärksten Lottie-Wiedergabebibliotheken auf dem Markt. Liste der implementierten Funktionen im Projekt-Wiki.
  • Bis heute ist die Dateierweiterung .lot der neue offizielle Standard der IANA für Lottie-Dateien. ThorVG unterstützt jetzt offiziell .lot als Standardformat für Lottie-Dateien zusätzlich zur traditionellen Erweiterung .json.
  • Twining
    • Unterstützung für die Interpolation zwischen nicht-linear benachbarten Schlüsselbildern wurde hinzugefügt, was weichere Übergänge und genauere Zeitkontrolle ermöglicht. Diese Verbesserung ist besonders effizient bei der Verwendung mit zustandsbasiertem Animation Playback (auch bekannt als Marker-basiertes Playback) in Lottie. In vielen Fällen sind Animationen dafür ausgelegt, zwischen komplexen, nicht-linearen Zuständen zu wechseln. Die traditionelle Lottie mit ihrer strengen sequentiellen Zeitstruktur hat Schwierigkeiten in solchen Szenarien, was oft zu abrupten Rücksetzungen oder ungeschickten Sprüngen beim Wechsel zwischen inkonsistenten Schlüsselbildern führt: Videoschließlich 1, Videoschließlich 2.
    • Dank Tweening können Entwickler nun die Interpolation direkt zwischen zwei separaten Schlüsselbildern durchführen, selbst wenn diese auf der Zeitachse nicht linear benachbart sind. Dies ermöglicht natürlicher wirkende und weichere visuelle Effekte bei Übergängen zwischen Zuständen, was die Flexibilität und Realitätsnähe interaktiver Animationen erheblich steigert: Videoschließlich 1, Videoschließlich 2.
  • Jetzt wird (als experimentelle Funktion) die Neuschreibung von Variablenwerten zur Laufzeit unterstützt, was es ermöglicht, die Logik von Skripten dynamisch basierend auf Benutzereingaben auszuführen. Dies macht es zu einem besonders leistungsstarken Werkzeug zur Erstellung interaktiver Animationen mit Lottie-Ressourcen und ermöglicht die Erstellung individueller Variationen, die über das ursprüngliche Design hinausgehen.Video-Demonstration).
  • Ein anpassbarer Asset Resolver wurde hinzugefügt, der mehr Flexibilität beim Laden externer Ressourcen (z. B. Bilder), auf die in den Lottie-Animationen verwiesen wird, bietet.
  • Erweiterte Unterstützung der Lottie LayerEffect-Funktion, die es ermöglicht, direkte visuelle Verbesserungen auf den Animationsschichten mit den oben beschriebenen Effekten zu implementieren.
  • Da einige Effekte ressourcenintensiv sein können, wurde eine Option zur Anpassung von Qualität und Leistung für die Renderung dieser Effekte angeboten, die ideal ist, um auf Plattformen mit begrenzten CPU-Ressourcen zu optimieren. Dies ermöglicht Entwicklern, die Rendering-Genauigkeit zu steuern und die Leistung an die Zielplattform anzupassen.
  • Die Unterstützung für Ausdrücke wurde durch die Hinzufügung folgender Schlüsselmerkmale und Eigenschaften erweitert:
    • wiggle, temporalWiggle: Anwendung zufälliger, zeitabhängiger Bewegungen.
    • pointOnPath: Berechnung der Position entlang eines Pfades.
    • propertyIndex, groupIndex: Referenz auf den Index einer Eigenschaft oder Gruppe.
    • value, property, effect: Zugriff auf Werte von Eigenschaften und externen Effekten.
  • Genauere Übereinstimmung mit den Spezifikationen:
    • TextFollowPath – eine neue Spezifikation, die es Text ermöglicht, beliebigen Vektorpäthnen zu folgen (Video-Demonstration).
    • Textausrichtungsoptionen – genauere Darstellung von Textschichten basierend auf den Einstellungen ihrer horizontalen und vertikalen Ausrichtung (Video-Demonstration).
    • Maskenerweiterung – eine neue Funktion, die eine genauere Kontrolle über den Einfluss der Maskenform auf die visuelle Zusammensetzung ermöglicht (Video-Demonstration).
• SVG
  • ThorVG ermöglicht jetzt den Zugriff auf einzelne SVG-Elemente und deren Änderung mit einzigartigen id-Attributen, die in der ursprünglichen SVG-Datei definiert sind. Diese Funktion ermöglicht es Entwicklern, gezielt spezifische Vektorgrafiken in der importierten SVG-Szene auszuwählen und zu manipulieren, was sich ideal für interaktive oder dynamische Nutzungsszenarien eignet (z. B. Themenanpassung, Hervorhebung).
  • Support Gaußscher Unschärfeeffekt.
• Intelligentes Rendering
  • Die Software-Engine ThorVG unterstützt jetzt intelligentes partielles Rendering, das effizientere Rendering-Workflows ermöglicht, indem nur die Teile der Vektorszene aktualisiert werden, die sich geändert haben. Durch internes Tracking der geänderten Bereiche werden unnötige Neuzeichnungen minimiert und die Gesamtleistung optimiert. Diese Funktion bietet erhebliche Vorteile in Szenarien wie der Benutzeroberflächen-Rendering, Design-Tools oder Anwendungen, in denen der Großteil der Szene statisch bleibt und zwischen den Frames nur kleine Elemente aktualisiert werden. In solchen Fällen kann der Verzicht auf ein vollständiges Rendering der Szene die Rechenlast erheblich reduzieren und die Energieeffizienz steigern, was besonders wertvoll für mobile und eingebettete Systeme ist.
  • Um dieses Ziel zu erreichen, verwendet ThorVG 1.0 eine Kombination von algorithmischen Methoden, die speziell für partielles Rendering entwickelt wurden. Nachfolgend sind die grundlegenden Strategien aufgeführt, die diesem System zugrunde liegen:
    • Algorithmus des linearen Durchlaufs: Figuren werden nach ihren x-Koordinaten sortiert, und eine lineare Durchlaufstrategie wird angewandt, um unnötige Überprüfungen von „schmutzigen“ Bereichen zu reduzieren. Dies senkt die Komplexität von O(N × M) auf O(N + M + K + N log N), wobei N die Anzahl der Figuren, M die Anzahl der „schmutzigen“ Bereiche und K die Anzahl der tatsächlichen Überlappungen ist.
    • Teilung und bedingte Fusion: Die feinkörnige Teilung von Unterbereichen wird durch intelligente Fusion ausgeglichen, um Fragmentierung zu vermeiden. Dabei wird die horizontale Fusion priorisiert, um den Speichercache effizienter zu nutzen.
    • Räumliche Teilung (standardmäßig 4×4 Raster): Die Rendering-Oberfläche wird in 16 Bereiche unterteilt, wodurch nur die entsprechenden „schmutzigen“ Bereiche der Figuren überprüft werden, was die Kosten bei komplexen Benutzeroberflächen-Updates erheblich senkt.
  • Diese Techniken arbeiten zusammen, um ein reibungsloseres und schnelleres Rendering zu gewährleisten, insbesondere in Embedded-Systemen oder Echtzeitsystemen, in denen häufig partielle Updates stattfinden. Weitere Informationen werden in einem separaten Beitrag veröffentlicht. dem Blog.
  • Bitte beachten Sie, dass bei hochdynamischen Inhalten, wie z. B. dynamischen Spielen oder Vollbildanimationen, bei denen sich fast alle Objekte in jedem Frame ändern, das partielle Rendering wenig oder gar keinen Leistungsgewinn bietet und sogar zu geringfügigen Overheads führen kann. In solchen Fällen ist es in der Regel besser, eine vollständige Szenenwiedergabe zu wählen. Aus diesem Grund unterstützt ThorVG sowohl partielle als auch vollständige Rendering-Konfigurationen, sodass Sie die optimale Vorgehensweise für Ihren Anwendungsfall auswählen können. Sie können die Leistung Ihres Produkts analysieren und eine fundierte Entscheidung treffen, indem Sie die Option Meson -Dpartial=[true/false] und die EngineOption::Smart der Klasse SwCanvas verwenden.

  auto canvas = SwCanvas::gen(EngineOption::Smart);

• Eine neue Ära der Integration von Webtechnologien mit WebGL, WebGPU und leichtem WebCanvas für nahtloses Rendering im Browser.
  • Die WebGL- und WebGPU-Backends sind jetzt offiziell bereit für die Produktion. Diese GPU-basierten Renderer bieten nun vollständige funktionale Kompatibilität mit dem traditionellen CPU-Backend und unterstützen alle Funktionen des ThorVG Canvas mit derselben Bildqualität und Stabilität. Im Vergleich zur Version 0.15 hat die GPU-Rendering-Leistung um mehr als 150 % zugenommen, was eine signifikante Verbesserung des Echtzeit-Renderings von Web-Vektorgrafiken gewährleistet.
• Signifikanter Leistungszuwachs in Umgebungen mit Einschränkungen für CPU/GPU-Leistung und eingebetteten Umgebungen.
  • ThorVG 1.0 bietet im Vergleich zur Version 0.15 eine verbesserte Leistung mit spürbaren Zuwächsen sowohl bei CPU als auch bei GPU.
  • Wesentliche Optimierungen:
    • Verbesserte Effizienz des Rendering-Pipelines.
    • Reduzierte Overheads bei der Zuweisung von Frame-Puffern.
    • Optimierte Analyse von Lottie-Kompositionen.
    • Verbesserte Batch-Rendering und GPU-Caching.
  • ThorVG ist für die Rasterisierung auf CPU-Basis optimiert und legt den Fokus auf vektorbasierte Visualisierung in Umgebungen, in denen GPU-Ressourcen begrenzt, nicht verfügbar oder absichtlich nicht verwendet werden. In typischen CPU-Tests zeigt ThorVG im Durchschnitt eine um 1,8-mal höhere Leistung im Vergleich zur weit verbreiteten Vektorgrafik-Engine Skia bei der Ausführung typischer Aufgaben der Vektorvisualisierung. Der Vorteil ist besonders offensichtlich in Szenarien mit intensiver Geometrienutzung, wie der Visualisierung von Rechtecken, Strichen, Rotationen und Kreisen (Screenshot 3).
• ThorVG Janitor
  • Eine echte Leistungsdemonstration des Renderings von ThorVG kann im Projekt gesehen werden. ThorVG Janitor – ein interaktives Spiel, das entwickelt wurde, um die Leistung von Prozessoren unter hoher grafischer Belastung zu demonstrieren. Die Szene enthält Hunderte von Gegnern, die mit partikelbasierter Grafik erstellt wurden, mehrschichtige Hintergründe des Sternenhimmels mit vollformatigen Rasterbildern, Echtzeiteffekte wie DropShadow und Blur sowie bis zu 25.000 Objekte, die gleichzeitig gerendert werden. Selbst unter Höchstlast bei einer 2K-Auflösung (2048×1152) zeigt das Projekt eine stabile Leistung von über 120 FPS, was die Effizienz und Eignung von ThorVG für komplexe Umgebungen mit vielen Effekten unterstreicht.Video-Demonstration, Screenshot).
• Weitere wesentliche Änderungen
  • Beispiel für die Integration von ThorVG in GodotIn dieser Video-Demonstration ThorVG wird mit Godot in einer Webumgebung integriert, um Hunderte von Lottie-Animationsobjekten mit über 120 Bildern pro Sekunde zu rendern. Diese Demonstration zeigt das Potenzial von ThorVG in einer Webumgebung für flüssige und qualitativ hochwertige Animationen in Echtzeit.
  • Hinzugefügt Lernbeispiel Verwendung von ThorVG WebCanvas.
  • Interaktives hinzugefügt ThorVG Playground.
  • Ein ThorVG-Wrapper für die Programmiersprache Swift hinzugefügt: https://github.com/thorvg/thorvg.swift.
  • Beispiele für die Verwendung von ThorVG wurden in ein separates Repository verschoben https://github.com/thorvg/thorvg.example.
  • Erweiterung veröffentlicht thorvg.vscode für VSCode zur Erstellung, Bearbeitung und Vorschau von ThorVG-Ressourcen direkt in der Umgebung von Visual Studio Code.
  • In Version 1.0 fand eine wesentliche Umstrukturierung der API statt, die auf die Verbesserung der Leistung, Benutzerfreundlichkeit, Konsistenz und Kompatibilität mit C abzielt.
  • Die Unterstützung des TVG Picture (TVG)-Formats wurde entfernt. Diese Entscheidung wurde getroffen, um ein neues ThorVG Picture-Format vorzubereiten, das mit dem Fokus auf Animation als Hauptkonzept entwickelt wurde.
  • Zahlreiche Fehlerbehebungen und Stabilitätsverbesserungen für den Produktionsbetrieb.

Quelle: linux.org.ru