Lançamento do Flitter 1.0.0: Biblioteca svg para substituir o D3

Introdução à biblioteca Flitter

Contexto do nascimento do Flitter

No ambiente de desenvolvimento web moderno, a visualização de dados tornou-se um elemento essencial. Converter conjuntos de dados complexos em formatos fáceis de entender é um desafio constante para os desenvolvedores. O Flitter nasceu para enfrentar esse desafio. Apesar da existência de diversas bibliotecas de visualização de dados, os desenvolvedores frequentemente sentiam dificuldade em encontrar funcionalidades que atendessem completamente às suas necessidades entre as opções disponíveis. Muitas vezes, a implementação de gráficos ou diagramas simples exigia um grande esforço de aprendizado e tempo.

Problemas que o Flitter resolve

O objetivo principal do Flitter é permitir que os desenvolvedores implementem visualizações de dados, como gráficos e diagramas, de forma fácil e rápida. Para isso, o Flitter oferece duas funcionalidades principais.

1. Escrita de código declarativo usando widgets: O Flitter adota um modelo de programação declarativo, permitindo que os desenvolvedores expressem os elementos visuais desejados de forma simples e intuitiva. Essa abordagem aplica à visualização de dados o paradigma amplamente aceito em frameworks web modernos como React.
2. Cálculo de layout avançado: Na visualização de dados, o cálculo preciso do layout e da posição é um fator crucial. O Flitter automatiza cálculos complexos de layout, como inferência da largura do texto, permitindo que os desenvolvedores se concentrem em tarefas mais importantes.

Quando o Flitter é necessário

O Flitter é ideal, especialmente para projetos com requisitos desafiadores de visualização de dados ou quando é preciso implementar gráficos ou diagramas simples de forma rápida. Além disso, ele fornece uma sintaxe e estrutura familiar aos desenvolvedores com experiência em Flutter, maximizando a sinergia entre plataformas web e móveis.

Principais atualizações e melhorias

Novas funcionalidades

• Suporte aprimorado para SSRNa versão 1.0.0, o suporte para SSR (Server-Side Rendering) foi significativamente aprimorado. Em versões anteriores, havia dependência de dependências específicas do Node.js, mas agora todas essas dependências foram removidas, permitindo a operação estável em diversos ambientes, como Vercel e Cloudflare. Isso facilita a integração do Flitter em projetos sem restrições de framework.
• Funcionalidade GuestureDetector aprimoradaO Flitter agora oferece um efeito de propagação de eventos correspondente à árvore de widgets. Isso permite um controle mais preciso das interações do usuário e oferece maior flexibilidade aos desenvolvedores na implementação de interações complexas.
• Adição do widget ZIndexAté então, o SVG não suportava diretamente o atributo z-index. O Flitter 1.0.0 contorna essa limitação por meio do widget ZIndex, permitindo que os desenvolvedores controlem explicitamente a prioridade de camadas verticais dos elementos.

Melhorias de desempenho

• O Flitter aumentou consideravelmente a velocidade de renderização inicial e o desempenho interativo dos diagramas. O foco foi na otimização de desempenho, reduzindo a velocidade de renderização de diagramas complexos de 140ms para 30ms, por exemplo.
• Quando as alterações de estado ocorrem em uma única pilha de chamadas, o processamento em lote é usado para reduzir o número de renderizações.

Correções de bugs principais

• Corrigido um problema em que a chamada de setState dentro de um manipulador de eventos registrado com addPostFrameCallback() não causava a renderização.
• Corrigido um problema em que a altura era definida incorretamente em relação à altura do elemento pai quando a altura era definida como 100% na implementação responsiva do navegador.

Exemplos de uso e documentação

React

Para usar no React, instale os dois pacotes abaixo.

Importando o Widget de flitter-react, você pode usar o flitter facilmente no ambiente React.

Você pode encontrar documentação detalhada e exemplos de uso para começar com o Flitter no site oficial de documentação. Ele fornece uma variedade de informações, desde os conceitos básicos até recursos avançados do Flitter.

Comunidade e como contribuir

A comunidade Flitter se comunica ativamente por meio do GitHub e do Discord. Os desenvolvedores podem sugerir recursos ou relatar bugs diretamente no GitHub, e o canal Discord é um ótimo lugar para compartilhar ideias e experiências sobre Flitter. Todas as contribuições desempenham um papel vital no crescimento do projeto Flitter.

Planos futuros e visão

A curto prazo, o Flitter se concentrará na correção de bugs e melhorias de desempenho, enquanto a longo prazo, o objetivo é desenvolver uma melhor experiência SSR e recursos adicionais para visualização de dados. A visão final do Flitter é revolucionar a acessibilidade da visualização de dados no ecossistema de desenvolvimento web, fornecendo uma solução abrangente e escalável.