Fluid: Prime impressioni

Oggi ho fatto il primo test Fluid e mi piacerebbe sentire anche le vostre impressioni a caldo.

Non vuole essere assolutamente un giudizio anche perchè stiamo parlando ancora di qualcosa ‘on progress’: è interessante conoscere cosa avete scoperto e se qualcosa vi ha sconvolto positivamente/negativamente.

Inizio io con quello che mi ha sconvolto negativamente: creare un progetto applicando il tema Bootstrap e trovarmi una esecuzione Ionic con un semplice bootstrap.css caricato.

Ispezionando l’HTML è molto più pulito dell’RD3 ma trovo solo ion-input / ion-row / ion-col (riferimenti ionic)

Se penso a tutte le personalizzazioni bootstrap presenti in un mio progetto (che non funzioneranno più) mi viene un po’ male; il costo di un porting sarebbe veramente elevato.

Forse ho sbagliato qualcosa io, oppure è presto per il tema bootstrap su Fluid.

E voi cosa avete scoperto ?

1 Mi Piace

Ciao Pietro, ho provato ad eseguire un progetto boostrap in Fluid, una videata non si apre nemmeno, un’ altra oltre a non rispondere su qualche click si vede tutta male…

1 Mi Piace

Ciao, io vorrei segnalare una problematica ( @paolo.giannelli è questa la modalità corretta?) su un progetto siattle una dropwown funziona bene se, dopo aver aperto la tendina, uso lo scroll del mouse per scorrere gli elementi. Se invece clicco per trascinare la barra e la tendina sparisce e non posso selezionare un elemento che sta, ad esempio, in fondo ad una lista molto lunga.
Un primo veloce test sembra che renda l’app più veloce a parità di funzionalità

@martino.vedana per segnalare anomalie di FLUID potete inserire ticket di malfunzionamento con il nuovo ambito Fluid che verranno processati il più velocemente possibile.
In caso che replicare il malfunzionamento sia troppo complesso guarderemo in assistenza il problema senza addebito sul monte ore.

1 Mi Piace

@dr_whiteriver Inserisci un malfunzionamento con ambito Fluid anche del tuto problema e se non riesci a fare il progetto di esempio mettila come assistenza impostando il flag pre valutazione.

@eurekapv dammi un po’ di tempo e ti rispondo sul perché non ti ritrovi gli oggetti Bootstrap, oggi ho una giornata un po’ piena .

certo grazie @paolo.giannelli

ho integrato le note di rilascio di FLUID per specificare meglio come funziona il nuovo motore grafico, leggetevi l’articolo al link qui sotto ed eventualmente fate osservazioni poi qui di seguito.

Nuovo motore grafico FLUID

Riporto qui l’essenziale dell’articolo:

Il motore grafico FLUID utilizza il framework Ionic (la versione di Instant Developer Cloud di Ionic ) per costruire gli oggetti a video nel browser.

Questa struttura basata su Ionic è unica per tutti i temi grafici. Quindi, a differenza di quanto avviene nel motore grafico RD3, dove per ogni tema c’è del codice javascript specifico per gestirlo (fino ad arrivare a casi come il tema Bootstrap che ha un motore grafico tutto suo diverso da quello ad esempio di Seattle ), in FLUID tutti i temi condividono la stessa struttura e la differenziazione tra di loro avviene attraverso il css, con un file css specifico per ogni tema.

Per fare un esempio, se usiamo il tema Bootstrap nel dom non ci saranno gli oggetti specifici di Bootstrap (ad esempio bs-input, bs-dropdown, ecc.), ma ci saranno sempre oggetti Ionic il cui stile e comportamento sarà reso equivalente a quello dei rispettivi oggetti Bootstrap attraverso il css.

La struttura unica per tutti i temi e l’utilizzo spinto al massimo del css presentano dei grossi vantaggi in termini di efficienza, velocità dell’applicazione e semplicità di personalizzazione e consentono di essere pronti ad accogliere possibilità future ora inimmaginabili.

Il motore grafico non è ancora completo al 100%, la maggior parte delle cose che ancora mancano anche in termini di comportamento del tema (ad esempio la responsività alla Bootstrap ) arriveranno prossimamente con i nuovi rilasci.

2 Mi Piace

Purtroppo era quello che già avevo intuito … e sinceramente mi sembra una strada molto criticabile

  1. Perchè cosi facendo non si ha ne Ionic ne Bootstrap ma un qualcosa che simula
    (Ionic di Cloud non è il vero Ionic Framework 6.0 ma un foglio di stile “ionico”)

  2. Si è scelto una stilizzazione basata su fogli di stile non presenti nella vecchia versione (con Foundation non c’era il tema Ionic sul web)

  3. L’aggiornamento dei progetti customizzati in essere (e sono tanti) richiede una mole di lavoro abnorme

I più facilitati saranno sicuramente coloro che hanno progetti con Seattle o Zen che si sono limitati ad utilizzare gli aspetti grafici Inde Standard.

Giusto per far capire: aggiornare a Fluid una videata come questa molto “customizzata” bootstrap non sarà una passeggiata.

Aggiungiamoci anche tutto il codice JS modificato e che cambiando il motore grafico sarà da cambiare.

Per ora concludo con … mah !!!

2 Mi Piace

Il mio esempio allegato sopra è di una videata fatta con il sistema di @eurekapv mettendo Html Boostrap dentro le colonne di un pannello in lista. Probabilmente è per quello che viene così male se sto provando ad usare un tema Boostrap che non è più fatto come il vero Boostrap ma è una specie di Ionic…

l’aggiornamento pubblicato oggi di INDE ha risolto i problemi sull’interfaccia e adesso funziona anche senza debug mentre prima si bloccava all’avvio.
Inoltre non ho dovuto modificare il tema che era Seattle.
Ho solo ricompilato. Wow!
Domanda: quindi si utilizza Ionic e non bootstrap? E quindi si può usare fluid anche per il mobile?

@eurekapv comprendo quello che dici, ma penso che possa essere interessante anche vedere i vantaggi.

La predominanza di fogli di stile e il motore “unico” fa sì che sia possibile avere lo stesso stile sia su desktop sia su mobile. I tanti che avrebbero voluto lanciare un’applicazione zen su ipad (senza avere grossi problemi) con Fluid possono farlo molto facilmente.

Il motore grafico non è ionic né bootstrap “base” ma un motore che utilizza le librerie di entrambi per rendere disponibili oggetti complessi. Questo significa che chi conosce ionic o bootstrap può usare la sua esperienza per stilizzare l’applicazione. Chi conosce Instant Developer può cambiare da stile Ionic a stile Bootstrap a stile Zen. Con bootstrap e ionic “base” sarebbe impossibile avere questa libertà.

La personalizzazione strutturale fatta con fluid per un tema vale anche per gli altri. E anche questo è un bel risultato.

Certo, le personalizzazioni devono essere rifatte. Il tentativo era di comunicarlo all’evento del 6 ottobre e mi spiace che non si sia capito fino in fondo. Ad ogni modo rimango fiducioso.

Non c’è fretta, RD3 rimarrà supportato per un sacco di tempo e lo stesso vale per i temi che supporta. È successa la stessa cosa per il passaggio RD2 - RD3 e il risultato finale è stato di gran lunga a vantaggio delle scelte fatte.

Infine potrebbe essere presto per trarre conclusioni. Se vi va, guardiamo insieme le vostre personalizzazioni e sono certo che si troverà il modo di rifarle, forse anche più semplicemente di prima.

4 Mi Piace

Premesso che ancora non ho avuto modo di provare Fluid, né su progetti nuovi né su progetti da aggiornare, mi sento di stare (una volta tanto) dalla parte di Pro Gamma.
Un nuovo motore grafico era necessario. Da tempo.
I primi giorni/mesi sicuramente avrà delle cose che non vanno. E’ normale. Non aggiornerò certo i miei progetti in produzione domani.

Per le personalizzazioni, quelle è ovvio che vadano riscritte o quantomeno riviste. E’ sempre così anche per i passaggi di versione (anche se con impatto minore).

Quello che è importante è che non si debba riscrivere l’intero progetto, come era necessario in un eventuale passaggio IDF → IDC.

Mel medio-lungo periodo, credo che questa fosse non solo la scelta giusta, ma quella necessaria.
E come al solito, non si è obbligati ad aggiornare se i problemi sono troppi e ci si accontenta di quello che si ha.

Se avessi dovuto realizzare un nuovo progetto da zero, ci avrei pensato due volte prima di farlo con IDF, e il problema era proprio il motore grafico. Adesso, se e quando funzionerà tutto come si deve, la scelta potrebbe essere molto più facile. :wink:

3 Mi Piace

Infatti il mio post è iniziato con: ‘Non vuole essere assolutamente un giudizio’
pero’ alcune considerazioni ovviamente è giusto farle per capire veramente cosa c’e’ sotto il cofano.

In primis se come dici ‘un motore che utilizza le librerie di entrambi ’ mi aspetterei di vedere caricato Ionic (versione Javascript) che pero’ non trovo.
In Ionic la struttura è formata da WebComponents (ShadowRoot e compagnia cantante) che qui non ho trovato

Giusto per capire dunque la strada scelta è quella di ‘ispirarsi’ ad Ionic, usando i suoi tag e ricreando da zero i componenti (nascosti nei file js dentro a fluid/ionic) e quindi di fatto staccandosi dallo standard.

Capisco le richieste di usare l’applicazione con IPAD che dicevi … ma sinceramente grazie a Bootstrap questo era più che possibile ed è da questo che avrei capito più come scelta (soprattutto perchè gia presente in Foundation) uno spostamento verso Bootstrap per tutti i temi.

Le PWA Ionic sono disponibili nel framework ma ‘stridono’ sempre un pò con applicazioni gestionali proprio perchè Ionic è privo di alcuni controlli Web oriented; pensiamo al Date Time Picker che è rimasto in versione ‘Rullo’ sino alla versione 5 di Ionic e solo da poco è disponibile in finestra separata.

Non da meno ricordo che Ionic è in versione 6 dallo scorso anno e tra poco in 7 e noi partiamo in 4 con il freno a mano tirato.

Concludo dicendo che un sistema ‘all-in-one’ è sicuramente più comodo da manutenere per Progamma … ma sicuri che lo sia anche per chi dovrà fare porting manuali e per adeguamenti futuri dei framework di base ?

Ricordo anche che all’Evolution Day si era detto… è il punto di partenza e lo costruiamo insieme: spero che sia così.

1 Mi Piace

Io credo che fluid debba essere utilizzato almeno al momento allo stato dell’arte solo per migliorare l’interfaccia delle applicazioni mobile ionic.

per chi come me usa zen questa è una grande cosa: finora ho sempre dovuto fare una altra applicazione mobile per i tablet oltre al backoffice zen

1 Mi Piace

diciamo che Foundation Bootstrap … se ben configurato … andava di lusso sui tablet; per ora siccome Fluid non è ancora responsive non si possono fare considerazioni

1 Mi Piace

Buonasera a tutti,
personalmente anch’io avendo sviluppato tutti i progetti con il Tema Bootstrap dai primi test fatti sto trovando enormi differenze dal risultato ottenuto con Boostrap a quello ottenuto passando a Fluid che vanno molto aldilà del semplice aspetto grafico o personalizzazioni fatte sulla custom.css o sulla custom3.js. Semplicemente prendendo un progetto realizzato in Bootstrap senza nessuna personalizzazione nella custom e facendo il porting a Fluid non mi ritrovo più funzionalità che avevo prima in Bootstrap come ad esempio la visualizzazione sulle colonne di un pannello degli ordinamenti e tanto altro.
Sinceramente dunque mi aspettavo molto di più avendo capito che la strada del passaggio a Fluid era percorribile fin da ora anche per chi utilizzava Boostrap ma da quello che vedo la strada è ancora lunga ed al momento non percorribile.

Un po’ alla volta stiamo incrementando la documentazione di FLUID e è online l’articolo
Introduzione ai componenti javascript FLUID
che spiega come si integrano i componenti javascript nel nuovo motore grafico.

1 Mi Piace

Ottimo. Appena ci sarà il pieno supporto Bootstrap con le proprie classi CSS potró testarlo

Tutti i miei componenti sono Bootstrap oriented cosi come le applicazioni …

1 Mi Piace

@eurekapv il mese di dicembre servirà proprio a fare gli aggiustamenti necessari a portare tutte le cose mancanti in FLUID.

Le prove che fate e i ticket di malfunzionamento inseriti da tutti voi serviranno proprio ad ottenere questo risultato.
L’ambito FLUD nei ticket è proprio per gestire in modo semplificato queste segnalazioni dove se non si riesce a riprodurre il caso in un progetto di esempio bastano anche degli screen shot della videata incriminata e poi eventualmente vi verrà richiesta una call per vedere direttamente sul vostro progetto il problema (senza addebito).