Rilascio di Flitter 1.0.0: la libreria svg che sostituisce D3

Introduzione alla libreria Flitter

Contesto di nascita di Flitter

Nell'ambiente di sviluppo web moderno, la visualizzazione dei dati è diventata un elemento essenziale. Trasformare set di dati complessi in formati facilmente comprensibili rappresenta una sfida continua per gli sviluppatori. Flitter nasce proprio per affrontare questa sfida. Nonostante l'esistenza di varie librerie di visualizzazione dati, gli sviluppatori spesso riscontrano difficoltà nel trovare funzionalità che soddisfino pienamente le proprie esigenze tra le opzioni disponibili. Spesso, anche la realizzazione di semplici grafici o diagrammi comporta un onere di apprendimento e un dispendio di tempo eccessivi.

Problemi risolti da Flitter

L'obiettivo principale di Flitter è consentire agli sviluppatori di implementare facilmente e rapidamente la visualizzazione dei dati, come grafici e diagrammi. A tal fine, Flitter offre due funzionalità chiave.

1. Scrittura di codice dichiarativo tramite widget: Flitter adotta un modello di programmazione dichiarativo che consente agli sviluppatori di esprimere gli elementi visivi desiderati in modo semplice e intuitivo. Questo approccio applica alla visualizzazione dei dati il paradigma ampiamente accettato nei moderni framework web come React.
2. Calcolo avanzato del layout: Nella visualizzazione dei dati, il calcolo preciso del layout e della posizione è un fattore cruciale. Flitter automatizza calcoli complessi del layout, come l'inferenza della larghezza del testo, consentendo agli sviluppatori di concentrarsi sullo sviluppo di logiche più importanti.

Quando è necessario Flitter

Flitter è ideale, in particolare, per progetti con requisiti di visualizzazione dati complessi o quando è necessario implementare rapidamente semplici grafici o diagrammi. Inoltre, offre una sintassi e una struttura molto familiari agli sviluppatori con esperienza in Flutter, massimizzando la sinergia tra piattaforme web e mobile.

Principali aggiornamenti e miglioramenti

Nuove funzionalità

• Supporto SSR rafforzatoLa versione 1.0.0 ha notevolmente rafforzato il supporto per SSR (Server-Side Rendering). Nelle versioni precedenti, si verificava una dipendenza da specifiche dipendenze di Node.js, ma ora tali dipendenze sono state completamente rimosse, garantendo un funzionamento stabile in vari ambienti come Vercel o Cloudflare. Ciò consente agli sviluppatori di integrare Flitter più facilmente nei propri progetti, senza vincoli legati al framework.
• Funzionalità GuestureDetector potenziataFlitter ora offre un effetto di bubbling degli eventi corrispondente all'albero dei widget. Ciò consente un controllo più preciso delle interazioni dell'utente e offre agli sviluppatori maggiore flessibilità nell'implementazione di interazioni complesse.
• Aggiunta del widget ZIndexFino ad ora, SVG non supportava direttamente l'attributo z-index. Flitter 1.0.0 aggira questa limitazione tramite il widget ZIndex, consentendo agli sviluppatori di controllare chiaramente la priorità di livello verticale degli elementi.

Miglioramenti delle prestazioni

• Flitter ha notevolmente migliorato la velocità di rendering iniziale e le prestazioni di interazione dei diagrammi. L'attenzione è stata posta sull'ottimizzazione delle prestazioni, riducendo la velocità di rendering di diagrammi complessi da 140 ms a 30 ms.
• In caso di modifiche di stato che si verificano in un singolo Call Stack, viene eseguita un'elaborazione batch per ridurre il numero di ri-rendering.

Principali correzioni di bug

• Risolto il problema per cui, quando si chiamava setState all'interno di un gestore eventi registrato con addPostFrameCallback(), non si verificava il ri-rendering.
• Risolto il problema per cui, nell'implementazione responsive del browser, l'impostazione dell'altezza al 100% causava un'altezza diversa da quella del padre.

Esempi di utilizzo e documentazione

React

Per l'utilizzo in React, installare i due pacchetti seguenti.

Importando Widget da flitter-react, è possibile utilizzare facilmente Flitter nell'ambiente React.

È possibile trovare una documentazione dettagliata e esempi di utilizzo per iniziare con Flitter sul sito ufficiale della documentazione. Qui sono disponibili informazioni su varie funzionalità, dalle basi all'utilizzo avanzato di Flitter.

Community e modalità di contributo

La community di Flitter comunica attivamente tramite GitHub e Discord. Gli sviluppatori possono suggerire funzionalità o segnalare bug direttamente su GitHub, mentre sul canale Discord è possibile condividere idee ed esperienze relative a Flitter. Tutti i contributori svolgono un ruolo fondamentale nella crescita del progetto Flitter.

Piani futuri e visione

Nel breve termine, Flitter si concentrerà sulla correzione di bug e sul miglioramento delle prestazioni, mentre a lungo termine punta allo sviluppo di funzionalità aggiuntive per un'esperienza SSR migliore e per la visualizzazione dei dati. La visione finale di Flitter è quella di offrire una soluzione integrata ed estensibile per la visualizzazione dei dati, rivoluzionando l'accessibilità alla visualizzazione dei dati nell'ecosistema di sviluppo web.