ThorVG 1.0

No dia 31 de janeiro, após um ano e meio de desenvolvimento contínuo, foi lançado o ThorVG 1.0, uma biblioteca leve e portátil de gráficos vetoriais multiplataforma. ThorVG, destinada à visualização de cenas e animações vetoriais. Suporta o carregamento de arquivos nos formatos Lottie e SVG Tiny 1.2 (lista de recursos implementados do SVG Tiny na Wiki do projeto).

A biblioteca oferece APIs convenientes para importação, criação e exibição de gráficos vetoriais, bem como para sua exportação para vários formatos gráficos, tornando-a versátil para uso em diversas plataformas de software e aplicativos para visualização de conteúdo gráfico. Também são fornecidas ferramentas de console lottie2gif e svg2png.

O ThorVG é utilizado para renderizar gráficos vetoriais em projetos como Tizen OS, Godot Engine, LVGL e players dotLottie.

O projeto é escrito em C++ (padrão C++14) e é distribuído sob a licença MIT.

Não se trata apenas de uma atualização — é uma base reestruturada para gráficos vetoriais 2D de alto desempenho, escaláveis e portáveis em todas as plataformas e dispositivos. Durante seu desenvolvimento, o ThorVG se transformou em um mecanismo gráfico maduro, pronto para produção, demonstrando qualidade e desempenho comprovados em aplicativos reais.

O ThorVG rapidamente ganhou popularidade e despertou crescente interesse da comunidade, refletindo sua evolução de um projeto em estágio inicial para um motor gráfico vetorial amplamente reconhecido e praticamente utilizado, pronto para uso real multiplataforma.

Lista de mudanças:

• Recursos avançados de renderização de texto, efeitos visuais ricos e suporte a sobreposições precisas para uma melhor expressão gráfica.
  • Suporte a alinhamento horizontal e vertical, permitindo controle preciso sobre a posição do texto em diferentes contextos de interface do usuário.
  • Quebra de linha automática com seleção de modo: por caracteres, por palavras, quebra inteligente e truncamento com reticências para lidar com estouros.
  • Suporte para quebra de linha manual, permitindo que os desenvolvedores controlem explicitamente as quebras de linha usando caracteres de nova linha, como \n. Isso permite formatar precisamente blocos de texto de múltiplas linhas, especialmente em layouts dinâmicos ou animações de texto.
  • Suporte para espaçamento de caracteres personalizável, permitindo ajustes precisos para melhorar a legibilidade ou alcançar determinados estilos tipográficos.
  • Suporte para contorno de texto, permitindo a criação de efeitos estilísticos e melhorando o contraste em diferentes fundos (captura de tela 1).
  • Foi apresentada uma sistema de modos de sobreposição mais abrangente e consistente, melhorando significativamente o comportamento dos modos de sobreposição e alinhando fórmulas e lógica de composição com padrões do setor, como Lottie, SVG e a especificação W3C 'Compositing and Blending'. Essas melhorias oferecem maior consistência visual e compatibilidade cross-platform, especialmente em fluxos de trabalho web e de animação.
  • Os seguintes modos de sobreposição foram implementados e são suportados: 'Matiz', 'Saturação', 'Cor' e 'Brilho', utilizando a composição do espaço de cores HSL. Esses modos melhoram a compatibilidade com efeitos de camadas Lottie e a futura suporte a mistura SVG (captura de tela 2).
  • Melhorias significativas e expansões em efeitos visuais a nível de cena, tornando a gráficos vetoriais mais expressivos e visualmente ricos:
    • Efeito de sombra com filtro de desfoque gaussiano (demonstração em vídeo).
    • Métodos de substituição de cores que alteram a aparência dos gráficos redefinindo a forma como as cores são aplicadas, misturadas ou correspondidas com base em matiz (demonstração em vídeo).
  • Novas funções auxiliares adicionadas para expandir as capacidades interativas. Inclui suporte para consultas de informações espaciais (demonstração) e detecção de impactos em objetos exibidos (demonstração em vídeo).
• Recursos avançados de animação Lottie para reprodução cross-platform, incluindo presets modulares do Web Player otimizados para tamanho, desempenho e modo de renderização (CPU/GPU)
  • Melhorias significativas no suporte a animações Lottie, aumentando a compatibilidade, flexibilidade e interatividade em todas as plataformas. Amplia-se não apenas a gama de recursos e expressões Lottie suportadas, mas também são fornecidas ferramentas para desenvolvedores que permitem controlar dinamicamente o comportamento da animação em tempo real, tornando o ThorVG uma das bibliotecas de reprodução Lottie mais poderosas disponíveis no mercado. Lista de recursos implementados no Wiki do projeto.
  • Atualmente, a extensão de arquivo .lot é o novo padrão oficial da IANA para arquivos Lottie. ThorVG agora suporta oficialmente .lot como o formato de arquivo padrão para Lottie, além da extensão tradicional .json.
  • Twining
    • Foi adicionada a suporte para interpolação entre quadros-chave não linearmente adjacentes, proporcionando transições mais suaves e um controle temporal mais preciso. Essa melhoria é especialmente eficaz quando utilizada com a reprodução de animações baseada em estados (também conhecida como reprodução baseada em marcadores) no Lottie. Em muitos casos, as animações são destinadas a transições entre estados de maneiras complexas e não lineares. O Lottie tradicional, com sua estrutura de tempo estritamente sequencial, tem dificuldade em lidar com tais cenários, frequentemente resultando em reinicializações bruscas ou saltos desajeitados ao alternar entre quadros-chave não sequenciais: demonstração em vídeo 1, demonstração em vídeo 2.
    • Com o twining, os desenvolvedores agora podem interpolar diretamente entre dois quadros-chave separados, mesmo que não sejam linearmente adjacentes na linha do tempo. Isso permite obter efeitos visuais mais naturais e suaves durante as transições entre estados, aumentando significativamente a flexibilidade e o realismo das animações interativas: demonstração em vídeo 1, demonstração em vídeo 2.
  • Agora (como recurso experimental) é suportada a reescrita de valores de expressões de variáveis em tempo de execução, permitindo que a lógica do script seja executada dinamicamente com base na entrada do usuário. Isso torna uma ferramenta especialmente poderosa para criar animações interativas usando recursos do Lottie, permitindo criar variações personalizadas que vão além do design original (demonstração em vídeo).
  • Foi adicionado um mecanismo de resolução de recursos personalizável, proporcionando maior flexibilidade ao carregar recursos externos (como imagens) referenciados por animações Lottie.
  • Suporte expandido para a função Lottie LayerEffect, permitindo melhorias visuais ricas diretamente nas camadas da animação com os efeitos descritos acima.
  • Como alguns efeitos podem ser intensivos em recursos, uma opção de ajuste de qualidade e desempenho para a renderização de efeitos foi proposta, ideal para otimização em plataformas com recursos limitados de CPU. Isso permite que os desenvolvedores controlem a precisão da renderização e otimizem o desempenho de acordo com a plataforma de destino.
  • O suporte a expressões foi expandido com a adição das seguintes funções e propriedades-chave:
    • wiggle, temporalWiggle: aplicação de movimento aleatório dependente do tempo.
    • pointOnPath: cálculo da posição ao longo de um caminho.
    • propertyIndex, groupIndex: referência ao índice da propriedade ou do grupo.
    • value, property, effect: acesso aos valores das propriedades e efeitos externos.
  • Maior conformidade com as especificações:
    • TextFollowPath – nova especificação que permite que o texto siga caminhos vetoriais arbitrários (demonstração em vídeo).
    • As opções de alinhamento de texto – representação mais precisa de camadas de texto com base nas configurações de alinhamento horizontal e vertical (demonstração em vídeo).
    • Expansão de máscara – nova função que permite controlar com mais precisão a influência da forma da máscara na composição visual (demonstração em vídeo).
• SVG
  • ThorVG agora permite o acesso a elementos SVG individuais e sua modificação com atributos id únicos definidos no arquivo SVG original. Essa funcionalidade permite que os desenvolvedores selecionem e manipulem diretamente formas vetoriais específicas na cena SVG importada, o que é ideal para cenários de uso interativos ou dinâmicos (por exemplo, temas, destaques).
  • Suporte efeito de desfoque gaussiano.
• renderização inteligente
  • O motor de software ThorVG agora suporta renderização parcial inteligente, proporcionando fluxos de trabalho de renderização mais eficientes ao atualizar apenas as partes da cena vetorial que mudaram. Graças ao rastreamento interno das áreas alteradas, ele minimiza redesenhos desnecessários e otimiza o desempenho geral. Este recurso traz benefícios significativos em cenários como renderização de interface do usuário, ferramentas de design ou aplicativos onde grande parte da cena permanece estática e pequenas partes são atualizadas entre os quadros. Em tais casos, evitar a renderização completa da cena pode reduzir significativamente a carga computacional e aumentar a eficiência energética, o que é especialmente valioso para sistemas móveis e embarcados.
  • Para alcançar esse objetivo, o ThorVG 1.0 aplica uma combinação de métodos algorítmicos projetados especificamente para renderização parcial. Abaixo estão as principais estratégias que fundamentam este sistema:
    • Algoritmo de passagem linear: as formas são classificadas com base nas coordenadas x e uma estratégia de passagem linear é aplicada para reduzir verificações desnecessárias de áreas 'sujas'. Isso reduz a complexidade de O(N × M) para O(N + M + K + N log N), onde N é o número de formas, M é o número de áreas 'sujas', e K é o número de sobreposições reais.
    • Divisão e fusão condicional: a divisão de subáreas de grão fino é equilibrada com uma fusão inteligente para evitar fragmentação. Nesse processo, a fusão horizontal é priorizada para uma melhor utilização do cache de memória.
    • Divisão espacial (por padrão, grade 4×4): a superfície de renderização é dividida em 16 áreas, permitindo verificar apenas as áreas 'sujas' relevantes das formas, reduzindo significativamente a sobrecarga em atualizações complexas da interface do usuário.
  • Trabalhando em conjunto, essas técnicas proporcionam uma renderização mais suave e rápida, especialmente em sistemas embarcados ou em tempo real, onde atualizações parciais ocorrem frequentemente. Informações mais detalhadas serão publicadas em um post separado. blogue.
  • Observe que em casos de conteúdo altamente dinâmico, como jogos dinâmicos ou animações em tela cheia, onde quase todos os objetos mudam em cada quadro, a renderização parcial oferece pouco ou nenhum benefício em termos de desempenho e pode até levar a uma leve sobrecarga. Nesses casos, normalmente é melhor optar pela renderização completa da cena. Por este motivo, ThorVG suporta tanto configurações de renderização parcial quanto completa, permitindo que você escolha a abordagem ideal para seu caso de uso. Você pode analisar o desempenho do seu produto e tomar uma decisão informada usando a opção Meson -Dpartial=[true/false] e a opção EngineOption::Smart da classe SwCanvas:

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

• Uma nova era de integração de tecnologias web com WebGL, WebGPU e WebCanvas leve para renderização sem emendas no navegador
  • Os backends WebGL e WebGPU estão agora oficialmente prontos para uso em produção. Esses renderizadores baseados em GPU agora oferecem total compatibilidade funcional com o backend tradicional baseado em CPU, suportando todos os recursos do ThorVG Canvas com a mesma qualidade e estabilidade de imagem. Em comparação com a versão 0.15, o desempenho da renderização por GPU aumentou em mais de 150%, proporcionando uma melhoria significativa na renderização de gráficos vetoriais web em tempo real.
• Aumento significativo do desempenho em ambientes com limitações de potência de CPU/GPU e ambientes incorporados
  • ThorVG 1.0 oferece melhor desempenho em comparação à versão 0.15, com um aumento notável tanto em CPU quanto em GPU.
  • Principais otimizações:
    • Maior eficiência do pipeline de renderização.
    • Reduzidos custos de alocação de buffer de quadro.
    • Análise otimizada de composições Lottie.
    • Renderização em lote melhorada e cachê de GPU.
  • ThorVG é otimizado para rasterização baseada em CPU, com foco na visualização vetorial em ambientes onde os recursos de GPU são limitados, indisponíveis ou intencionalmente não utilizados. Em testes típicos de CPU, o ThorVG demonstra um desempenho médio 1,8 vezes superior ao amplamente utilizado mecanismo de gráficos vetoriais Skia durante a execução de tarefas típicas de visualização vetorial. A vantagem é especialmente evidente em cenários com intenso uso de geometria, como a visualização de retângulos, traços, rotações e círculos (captura de tela 3).
• ThorVG Janitor
  • Uma demonstração real do desempenho de renderização do ThorVG pode ser vista no projeto ThorVG Janitor – um jogo interativo, desenvolvido para demonstrar o desempenho da CPU sob alta carga gráfica. A cena inclui centenas de inimigos, criados com gráficos baseados em partículas, fundos em camadas de céu estrelado com imagens rasterizadas em tamanho real, efeitos visuais em tempo real, como DropShadow e Blur, além de até 25.000 objetos sendo renderizados simultaneamente. Mesmo sob carga máxima com resolução 2K (2048×1152), o projeto demonstra um desempenho estável acima de 120 FPS, destacando a eficiência e viabilidade do ThorVG em ambientes complexos com muitos efeitos (demonstração em vídeo, captura de tela).
• Outras mudanças significativas
  • Exemplo de integração do ThorVG no Godot. No nesta demonstração em vídeo O ThorVG é integrado ao Godot em um ambiente da web para renderizar centenas de objetos de animação Lottie a uma taxa superior a 120 quadros por segundo. Esta demonstração mostra o potencial do ThorVG em ambientes da web para animação suave e de alta qualidade em tempo real.
  • Adicionado exemplo tutorial de uso do ThorVG WebCanvas.
  • Adicionada interativa ThorVG Playground.
  • Adicionado um wrapper ThorVG para a linguagem Swift: https://github.com/thorvg/thorvg.swift.
  • Exemplos de uso do ThorVG foram movidos para um repositório separado https://github.com/thorvg/thorvg.example.
  • Publicado extensão thorvg.vscode para o VSCode para criar, editar e pré-visualizar recursos ThorVG diretamente no ambiente do Visual Studio Code.
  • Na versão 1.0, uma reestruturação significativa da API foi feita visando aumentar o desempenho, a facilidade de uso, a consistência e a compatibilidade com C.
  • O suporte para o formato TVG Picture (TVG) foi removido. Esta decisão foi tomada para preparar o novo formato ThorVG Picture, desenvolvido com foco na animação como conceito principal.
  • Múltiplas correções de bugs e melhorias de estabilidade para uso em produção.

Fonte: linux.org.ru