Bene e benvenuti su GIT BAR, un'altra settimana e un altro episodio e oggi sono qua a bere una birra con Leo.Ciao Leo, come va? Ciao Mauro, tutto bene, tutto regolare, zona gialla ma fisso in casa come sempre.Noi siamo in zona arancione, devo dire che Leo la trasmette dal suo studio super confortevole.ho tirato su uno studio di fortuna qua in Sardegna perché finalmente sono riuscito a tornare con un viaggio degno di Noè perché è stata una fatica enorme però finalmente eccoci qua e nonostante tutto anche questa settimana siamo riusciti a registrare.Oggi abbiamo con noi un amico di di lunga data di Leo, no? Sì, lunghissima data non ricordo nemmeno il momento in cui l'ho conosciuto probabilmente all'università, però poi abbiamo passato tanti Io sono sicuro che l'hai conosciuto davanti a una birra, ma prima di svelarvi la sua identità cosa dobbiamo fare? Dobbiamo ricordare i nostri contatti Leo, vuoi farlo tu? Allora, sono un po' impreparato, io so una cosa sola che abbiamo un canale Telegram che si trova cercando su telegram e poi mi sembra che ti possono contattare @brainrepo su twitter e @infokiochelagitbar.it forse per l'email per chi la usa ancora.Ho detto bene? Perfetto! Vedi, ti stava per fregare la sindrome dell'impostore, anzi ti ha fregato la sindrome dell'impostore perché eri super preparato.Erano da qualche parte queste informazioni, le ho trovate al volo ma sono le uniche informazioni che so oggi perché oggi sono proprio uno spettatore non pagante guarda allora siamo in due quindi direi che è arrivato il momento di introdurre il nostro ospite benvenuti su Gitbar il podcast dedicato al mondo dei full stack developer i mezzo artigiani, mezzo artisti che ogni giorno infilano le mani nel fango per creare nel modo più efficiente possibile quei prodotti digitali che quotidianamente usiamo.Abbiamo con noi Andrea Gerardi.Io non voglio preparare una presentazione perché vorrei che lo presentasse Leo.Oddio, mi metti in grossissimo imbarazzo appunto perché io e Andre siamo molto amici.Comunque Andrea è ufficialmente il CTO di Mirror Production.Poi ci dirà Andre che cosa fa Mirror Production.Per come lo conosco io è la persona che appena ho un problema sul front-end contatto, perché lui non è che sa tutto, però prova tutto.Quindi qualsiasi cosa io che seguo solamente tutorial perché il back-end è diventato troppo difficile per me, chiamo Andre e dico "Come si fa sta cosa perché mi dà questo errore e lo risolvo così.Ciao Andre, dici cosa fate a Mirror perché fate delle cose fighissime.Ciao a tutti, grazie per avermi invitato.Cosa facciamo a Mirror? Facciamo un sacco di roba figa.Noi ci definiamo una Digital Interactive Agency, siamo a Firenze.Facciamo progetti custom di sviluppo web principalmente, anche realtà virtuale, realtà aumentata.Usiamo un sacco WebGL, che è l'argomento di cui parlerò oggi.- Spoiler! - Niente, facciamo siti, applicazioni, web, su tutti i settori possibili, su svariati di vari sfaccettature.Ogni tanto ho collaborato con loro per la parte magari DevOps o per alcune cose back-end, quindi frequento ogni tanto anche i loro uffici.Dentro c'è di tutto, da produzioni video a visori.È veramente figo essere lì.Il paradiso dei nerd.Infatti lui ci va spessissimo, nonostante la famiglia è sempre fisso in ufficio.Quindi giustifichi così il tuo tempo davanti ai giocattoli.No, ad Andrea voglio chiedere questa cosa.Intanto ancora prima di parlare di tecnologia, mi interessa sapere come è arrivato a WebGL, qual è il percorso che l'ha portato in questo mondo di interaction nel web? Bella domanda.Allora io sono partito alla fine con Flash, come molti di noi.Sì, l'ho sentito parlare spesso anche qui nel podcast.Già ai tempi di Flash esistevano motori di grafica 3D e 2D, però avevi ovviamente bisogno del plugin di Flash, Flash Player.A me è sempre piaciuto questo mondo, anche quello del game development, anche se poi non sono mai riuscito a sviluppare veramente un gioco.Ma quando WebGL è diventato standard e poi è stato implementato dai vari browser mi ci sono buttato testa bassa.A quanti anni fa risale l'introduzione di WebGL? Spannometricamente o comunque quando ti ci sei avvicinato? Perché è una cosa comunque abbastanza "recente" no? È abbastanza recente, sto andando anche a controllare perché io penso che sia intorno negli ultimi dieci anni che si è diventato standard, poi l'esplosione vera e propria stato intorno al 2015 secondo me.Quindi quasi una decina d'anni.Sì, una roba del genere.Ma la mia domanda è questa.Che cos'è WebGL e quali superpoteri porta nel web di oggi? Allora, se ne potrebbe parlare per anni quindi cerco di essere breve.Allora WebGL alla fine è un standard, quindi un web standard, per creare grafiche 3D a basso livello.Nel concreto è una serie di API implementate dai browser che sono basate su OpenGL e vengono esposte a JavaScript tramite il canvas HTML.È cross-platform, ovviamente, è royalty free.Che superpoteri dà? In realtà ti permette di manipolare il singolo pixel del canvas come preferisci, quindi vai a bassissimo livello sulla scheda video e quindi puoi fare quello che vuoi.mentre nelle pagine web solitamente possiamo manipolare le immagini usando CSS, possiamo usare i filtri svg, però se sei limitato, sei parecchio limitato a certe operazioni non puoi andare troppo a fondo.Con WebGL fai quello che ti pare, distorci, cambi colori, anime e la roba come preferisci insomma.Te faccio una domanda, noi abbiamo sempre visto, io ho lavorato per lungo tempo sul front end e ti dico la verità, ho sempre visto il front end come un posto dove il colo di bottiglia è la performance del browser.Ti faccio l'esempio, esempio quando noi andiamo a realizzare delle app ibride, quindi che girano dentro un frame all'interno di un'app nativa dentro un webkit della situazione che renderizza HTML, ho sempre visto la prestazione e la reattività comunque diversa.Quando andavo a fare troppe trasformazioni la gava, insomma un un po' di problemi.Come si affronta il problema delle performance? Cioè noi con WebGL stiamo lavorando in 3D che per antonomasia è una roba che ha bisogno di motore sotto il coffano ecco.Immaginare che giri nel browser può suonare strano a chi ha avuto esperienza problemi di performance anche solo con del javascript che muoveva o distorceva un pulsante di qui e di lì.Quindi questa discrepanza.Oppure basta scrollare facebook per un po' per qualche minuto e comincia a diventare sempre molto molto molto più lento.La cosa bella di WebGL è che quando tu vai a mettere un canvas nella tua pagina HTML per lavorare con WebGL puoi richiedere al tuo canvas un context che storicamente...c'era il context 2D che ti dava delle primitive per disegnare linee, punti, cerchi, ma sempre in 2D.Da quando è entrato WebGL puoi chiedere il context WebGL che di fatto è un context 3D.Grazie a questo, poi vediamo magari dopo parliamo anche di shader, ma insomma tu scrivi questi programmini in questo linguaggio che si chiama GLSL che vanno ad essere eseguiti direttamente sulla scheda video in parallelo e questo ti fornisce delle performance che sono un altro livello completamente rispetto a quelle classiche del javascript del DOM insomma.Ma scusa, questo context o meglio questo l'accesso alla scheda video se gira su una macchina dove non c'è una scheda video o una scheda video dedicata questo context è comunque presente e puoi accedere alle stesse funzioni o meglio anzi provo a rifare una domanda in maniera migliore cosa succede se non ho sulla macchina la potenza di calcolo necessaria per fare quell'animazione che voglio fare c'è modo immagino come quando facevo i videogiochi, uno poteva scegliere alcune opzioni tipo di qualità video perché vedeva che se lo metteva alla massima qualità tutto scattava, allora abbassava un po' la qualità video.Queste cose si possono fare o come ci si rende conto? C'è modo di rendersi conto dal lato di programmazione che non abbiamo abbastanza potenza sulla macchina? Allora questo è un argomento ostico perché non c'è proprio un modo di chiedere, non c'è un API per chiedere al browser ok su che macchina sto girando, che scheda video ho, che potenza ho a disposizione e magari puoi regolare il lavoro che fai per ottenere le performance migliori.Ci sono un po' di input che ti dà WebGL, tipo la dimensione massima delle texture è questa, se vai oltre non funziona, oppure una serie di input che puoi ricevere ma devi brancoli abbastanza nel buio purtroppo.Quindi quella dell'ottimizzazione delle performance è il lavoro più importante che devi fare quando lavori con WebGL perché sono bravi tutti a fare le cose con il computerone, con la scheda video RTX ultima generazione.E riconsiderate che vai a girare anche su cellulari che non hanno tutta quella potenza di calcolo.Puoi regolare una serie di parametri, per esempio l'anti-alias.L'anti-alias è quello che evita di avere delle scalettature sulle linee curve o insomma diagonali, attivando l'anti-alias ovviamente vai a consumare molto più, a lavorare molto più, insomma a impattare molto di più sulle performance mentre se lo disattivi vai più liscio.Io per esempio ho dovuto fare una sorta di rendering in cloud tramite Puppeteer, che è questa libreria per Node per far girare un browser headless, e sono andato quindi a cercare di renderizzare un canvas WebGL su una macchina virtuale, su DigitalOcean, che non aveva la scheda video.Quindi per rispondere alla domanda che facevi prima e in realtà funzionava lo stesso quindi le API sono comunque messe a disposizione ma il lavoro lo fa la CPU non la GPU e quindi per renderizzare un frame ci voleva tipo 10 minuti o contro la frazione di secondo che ci mette la scheda video.Ho una domanda, allora mettiamo che io voglia iniziare a lavorare con WebGL o comunque voglia iniziare a creare un'esperienza tridimensionale per il mio sito o per il sito di Gitbar, non lo so voglio renderizzare una birra che gira col codice dentro.Quali sono gli strumenti a livello di codice quindi i linguaggi o i framework che ho a disposizione per fare questo? Allora per di base basterebbe il javascript e il linguaggio che si usa è questo glsl che viene da OpenGL che è quello che dicevo prima che poi va a girare sulla scheda video direttamente ma siccome l'hello world di WebGL che è disegnare un triangolo semplicissimo sono più di 100 righe di codice, negli anni si sono sviluppate una serie di librerie di framework il più famoso è FreeJS che ormai ha sbaragliato la concorrenza, c'è Pixijs, c'è Babylon, c'è i frames ce ne sono diversi queste sono le più famose e tutte queste sostanzialmente ti astraggono tanti dei concetti più difficili ti permettono di scrivere meno boilerplate di fatto si semplificano la vita perché appunto se per un triangolo ci vogliono 100 righe immaginati per renderizzare un modello di una birra che gira.Ma quando tu scrivi il tuo file GL SL come lo integri poi all'interno della tua applicazione? Questa è una cosa che mi chiedo sempre.Allora ci sono delle API di WebGL quando tu inizializzi il canvas nella tua pagina poi gli vai a chiedere il context web.gl e questo ti restituisce il tuo contesto di rendering.Quando ce l'hai a disposizione gli puoi passare i suoi shader che poi spieghiamo cosa sono e lui li combina all'interno di quello che si chiama program e li va a caricare sulla gpu e li fa andare.Cosa sono gli shader? Adesso mi mi hai incuriosito ma ci sono un sacco di termini nuovi per me.Sì, infatti è un argomento complesso.Io mi ricordo quando seguivo tutta la roba hardware, cioè le schede video, allora questa ha lo shader per questo.Vabbè, figo, probabilmente i videogiochi sembrano più belli e l'avevo risolta così, però vorrei capire esattamente cosa cosa fanno, soprattutto perché tutta questa roba in un contesto web che per me il web è i form, le richieste post, il JSON, tutta questa roba.Come fa a funzionare? Quindi sono super curioso.Nella forma più semplice uno shader è un programmino che gira sullo GPU.Ce ne sono di due tipi, un vertex shader e il fragment shader.devono lavorare con forza in coppia, non esiste uno senza l'altro e il compito del vertex shader è calcolare posizioni di vertici nello spazio 3D quindi gli dai degli input e lui ti tira fuori un vettore, un array diciamo, che ha dentro x, y e z.Questa è proprio la definizione di base.Su queste posizioni che il vertex shader ritorna, WebGL va a disegnare sul canvas delle primitive che possono essere punti, linee o triangoli.Quando le ha rasterizzate sul canvas, poi va a prendere il fragment shader il cui compito è calcolare il colore di ogni pixel che forma la nostra primitiva.Quindi se io ho disegnato un triangolo sul canvas grazie al vertex shader e ho detto dove stanno i vertici di questo triangolo, poi per riempirlo, per colorarlo, utilizzo il fragment shader.Il fragment shader viene eseguito in parallelo dalla scheda video per ogni pixel che compone il mio triangolo.e restituisce anche lui un array che contiene i canali RGB e alfa quindi se mi ritorna 1 0 0 1 vuol dire che il pixel è rosso pieno alfa piena e quindi mi verrà un triangolo rosso ok questo ricordo del CSS, ci sono! per rasterizzare si intende che la scena che è ovviamente in 3D nel codice deve essere poi disegnata su un ambiente che è 2D, cioè che è lo schermo, che ha solamente due dimensioni, quindi si intende come quando fai un'autostrada che sembra che si unisca in fondo, in realtà il disegno sembra un triangolo però rappresenta una strada, quindi rasterizzare vuol dire quello, giusto? Sì, come quando hai una grafica vettoriale che quindi non è espressa tramite pixel ma tramite funzioni matematiche, poi va a disegnarla e deve diventare pallini sullo schermo.Banalmente una mappa di pixel.Sì, esatto, il processo di trasformarle in una mappa di pixel.E anche ora, anche questa è una cosa che mi ricordo da quando ero un videogiocatore, si tratta sempre di appunto linee, punti o triangoli, cioè tutte le forme, anche quelle più arrotondate possibili, in realtà sono sottivise in triangoli, giusto? Esatto, le schede video parlano in triangolo.Quindi se io ho una scena complessa da fare, questi sono gli elementi e come dici tu con gli shader dovrei farli a manina no? Eh sì, sono scritte in questo linguaggio che è molto simile al C, Strongly Typed, e ti dà una serie di funzioni che sono iper ottimizzate per lavorare nella scheda video con performance quindi sostenibili perché alla fine se consideri che i nostri schermi sono formati da diverse migliaia di pixel e tu vai a eseguire questo programmino in parallelo per ogni pixel 60 volte al secondo, quello è più o meno il tuo target.Insomma capisci bene che questo linguaggio deve essere parecchio efficiente diciamo.Però vedo una distanza enorme tra questi triangoli, questi punti, queste linee e quello che noi vediamo in tre dimensioni, che ne so, un modello fatto con blender per dirne una.Quindi qual è il percorso che porta un modello 3d a essere trasformato in questi programmi nero? Io sono gnoubissimo quindi non saprei neanche come come descriverli? Allora diciamo che alla fine un modello 3d non è altro che quello che si definisce una mesh nel mondo 3d quindi il solido parliamo di un cubo per esempio la base un modello 3d di un cubo non è altro che un insieme di triangoli come si diceva messi in una certa maniera da comporre un cubo per cui se io lavoro in blender come facciamo anche noi, esporto il modello 3d, torniamo all'esempio di o il cubo o il boccale di birra che gira, io esporto un file di testo che contiene principalmente delle posizioni di vertici nello spazio 3d, questi sono i vertici dei triangoli che vanno a comporre il mio modello e quando uso per esempio 3js gli dico caricami questo modello e buttamelo nella scena poi ci pensa ci pensa lui in realtà a fare il lavoro sporco perché appunto se per renderizzare un triangolo ci vogliono 100 righe come si diceva prima per renderizzare un modello ce ne vorranno migliaia.Quindi per fare cose avanzate devi utilizzare dei tool come 3js che ti semplificano la vita ma è fattibile utilizzando...tu hai parlato dei programmini GLSL no? Sì.O sono cose diverse perché sono un po' confuso ti dico la verità.Non è facile, ti devo spiegare.Sotto il cofano 3js scrive per te questi shader, questi programmini in glsl.Ti evita di fare il lavoro sporco a basso livello e tu scrivi in javascript e poi viene tradotto in questi shader.Quindi il loader del modello che io ho utilizzato perché qualcosa ho giocato un po' con 3g e se non fa altro che far fare che sotto il cofano andare a scrivere questi questi programmini che vanno a ricomporre praticamente i triangoli del modello che sto caricando.Esattamente, sì.Con magari gestendomi la complessità che il modello magari deve essere caricato asincronamente, no? Asincronamente? In modo asincrono.Sì, perché...Sì, alla fine lì vai a combinare le API classiche del browser, quindi anche le promise, e poi il basso livello del webGL per fare queste cose.Wow, c'è un bel livello di complessità.In realtà tu hai parlato di 3JS e che molta di questa complessità la ha.Io ci ho giocato con 3JS e ho visto che tutto sommato, caricare un modello, farlo ruotare, gestire la camera, è abbastanza semplice se non banale almeno a livello hello world come ci ho provato io.Però oggi il panorama web è ricco di un sacco di framework che ci aiutano a sviluppare front-end, penso a Vue.js, penso ad Angular, ma penso soprattutto al mio carissimo React.Che non è un framework è una library.Ti aspettavo alla sbarra! Si, ma ci bisticciamo sempre su questo.Io semplicemente utilizzo un buon livello di leggerezza per passeggiare sopra questo argomento, invece le ho.E sono d'accordo.Puntuale, preciso.Diciamo che potremmo fare anche un Geatfighter sull'argomento, che ne dici? Si, aggiungiamo quello, il grammar nazi, tutte queste cose precise che poi a livello di Vincenz non contano niente.Si ma giustificano ore e ore di discussioni su Slack, no? Esatto.No, quello che volevo chiedere è come si fa a sposare questi tool che utilizziamo tutti i giorni con delle altre librerie che sono iper specializzate come per esempio 3JS o Canon JS mi sa che si chiamava.Canon è un motore fisico.Ah no, il motore fisico, hai ragione.Comunque, hai mai avuto modo di integrare un progetto 3js dentro React? Se sì, come l'hai fatto prima del TreeFiber, quindi dell'introduzione del nuovo sistema di React o dopo? Allora mi è successo in passato di farlo sia prima che dopo, quindi come ho fatto? Ho dovuto un po' farlo entrare a martellate 3ds dentro React perché non è che fosse proprio un cittadino di prima classe, nel senso che diciamo che ho il mio componente React dove voglio inserire la mia scena 3d all'interno del life cycle del component bitmount ho dovuto fare tutto praticamente prendere un'applicazione vaniglia JS con 3js dentro e copia e incollarlo dentro il component.it mount, bene o male.Poi per reagire agli input dell'utente sono stato in ascolto sugli eventi onclick di React, andando magari a cambiare lo state del mio componente e passando poi questo state come input alla scena 3D ho fatto funzionare le cose.Non è che fosse proprio il massimo, ti ritrovi anche da gestire situazioni un po' difficili, magari file che diventano giganteschi, si parla di diverse centinaia, anche migliaia di righe di codice in un file solo, perché poi è difficile essendo...cioè 3ds lo scrivi in maniera imperativa dentro un contesto dichiarativo come React non è che vadano proprio d'accordo.Ed è per questo che poi alla fine è stato creato React 3 Fiber, che è una meraviglia perché ti permette di scrivere con componenti React tutto quello che è una scena 3D, dividendola in tutte le varie componenti quindi la camera, le luci, i modelli 3d, con dentro i materiali, animare le cose, alla React.Volevo fare una domanda che è un po' un attimo un dubbio.Allora io ho in mente due scenari e volevo capire come funzionava WebGL, insomma come funzionava sul browser questa roba.Uno ho un'applicazione interattiva che potrebbe essere un videogioco.Io ho il mio personaggio che è fermo, poi se pigio la freccia avanti comincia a camminare e si muove.Quindi in questo caso tutto viene renderizzato sul momento perché lui non sa quando è che io mi muoverò.Ma se io invece ho una scena predefinita, per esempio dello stesso videogioco, un trailer, un video, io lo posso prerenderizzare perché tanto so già quello che succede, quindi il personaggio cammina da qui a lì e parla con una persona.O in entrambi i casi viene renderizzato tutto in real time.Allora WebGL funziona in real time.Ah, ok.Quindi nasce per fare le cose che reagiscono agli input in diretta.Però ci sono i modi di fare una pre-renderizzazione.Anche lo stesso Mr.Doob, si chiama, che è il creatore di 3js, un grande, ha creato uno strumento per generare video in mp4, quindi proprio video veri e propri, fai il video a partire da una scena 3ds, oppure che ne so, andando su framework come Unity o Unreal Engine che alla fine fanno anche loro rendering in real time, vengono usati anche per registrare video con una qualità un po' più alta rispetto al WebGL, ma di fatto metti una camera, le fai fare dei movimenti dentro la scena, fai animare delle cose e registri un video.Cioè praticamente esporti in mp4 e poi sul browser avrai un tag video con il source quell'mp4 e a livello di cpu risparmi molto perché non devi renderizzare nessun momento, giusto? Esatto, esatto.Quindi puoi metterci anche un qualcosa in più per indirezzare ogni singolo frame e quindi ottieni magari una qualità più alta perché puoi fare più lavoro sul calcolo delle luci, eccetera.E come...questa domanda non so se ha senso...ma come si testa questa roba? Cioè esiste un modo...perché immagino...non immagino nemmeno il test che puoi fare, però diciamo hai il boccale di birra e sai che gira in un secondo quindi vuoi vedere se dopo mezzo secondo hai il manico dalla parte opposta.Faccio per dire un test.Questa è una cosa che si può fare, cioè si può controllare cosa c'è o, per come la vedo io, è talmente complesso perché andare a vedere cosa c'è nella scena in un determinato momento e capire cosa sono, è troppo difficile.Non lo so, qual è la situazione? È un bel casino, effettivamente non è una cosa testabile nella maniera classica, più una cosa che testi magari a mano, oppure per esempio con React 3 Fibers si sbloccano una serie di strumenti per andare effettivamente a controllare che determinato componente sia renderizzato, oppure no, però non è una cosa che abbia mai fatto in maniera automatizzata, cioè sempre fatto test a mano perché essendo completamente grafica la cosa è difficile.Beh immagino che nel caso non ci siano interazioni o valori che cambiano a seconda di variabili particolari che ne so da azione o reagiscono alla pressione dei tasti, cosa ne so, possa essere facile utilizzare delle sorte di snapshot del renderizzato no? in quel caso è possibile? se la scena è statica puoi fare una comparazione fra frame, sì certo puoi fare una sorta di visual regression testing fra le scene renderizzate da due magari due deploy diversi e vedere se è cambiato qualcosa, sì in questo modo sì, però scene statiche magari è raro in contesto WebGL che si vada a creare scene che sono proprio ferme immobili.Comunque si può fare.Parliamo per un attimo di reazione all'input.Perché quando provai 3JS mi resi conto che non era poi così banale reagire all'input perché ti aspetti di inserire un cubo nella scena e di mettere un on click e tutto funziona.Invece in questo caso, essendo del contenuto renderizzato dentro un canvas, quindi praticamente disegnato, come funziona? Allora, l'on click che hai citato in realtà con Reactrifyber lo puoi usare, è una del meraviglia di quella liberina, ma nel mondo classico diciamo che di base imposti un event listener sull'evento click alla maniera classica vaniglia javascript e nell'event handler che ti scrivi vai a modificare qualche variabile di stato che poi dici a 3ds di utilizzare per, che ne so, ruotare la camera o, che ne so, cambiare il colore di qualcosa.Noi per esempio abbiamo sviluppato, mirror, diversi configuratori di, che ne so, motoscafo, la macchina, di poi cambiare il colore della vernice, i materiali degli interni queste cose sono sostanzialmente reagire al click sul colore rosso e andiamo a dire a 3js di cambiare il materiale di un determinato modello 3d in rosso diciamo ma ma quindi è 3js che tiene il riferimento tra l'elemento e l'insieme di punti che renderizzati rappresentano quell'elemento nel canvas? non so se mi sono spiegato.allora il canvas di per sé è una roba piatta dove non ci sono elementi, no? è un insieme di punti in javascript.invece quello che tu fai, cliccare sulla la ruota per esempio tu stai cliccando su un punto x del canvas ma il canvas è 1 quindi l'associazione tra la ruota e il modello della ruota per dirne una è quel click viene fatta da 3js ed è completamente trasparente a noi non ha della complessità giusto? Un pochino diciamo che il canvas è 2D e utilizza delle coordinate diverse da quelle del mondo 3D che va a renderizzare per cui poi c'è un processo di traduzione delle coordinate però di fatto che succede quando vai a cliccare sul canvas immaginati di sparare un raggio si chiama ray casting quindi un re che parte dal centro del tuo occhio, diciamo, della camera in questo caso, e va nella direzione del tuo click.Lui questo raggio incontrerà, passerà attraverso a qualcosa nella scena e ti restituisce tutti gli oggetti ai quali è passato attraverso in ordine, quindi tu puoi dire "ok, ho cliccato qui, il mio raggio è passato attraverso la ruota della macchina e allora il raycaster te lo dice e qui reagisci di conseguenza.Però la ruota è un elemento che tu da qualche parte puoi fare riferimento col codice? Lui ti darà la posizione x e y del canvas e ti dice "guarda qui c'è la ruota, questo pezzo, questo pezzo, la ruota dietro che però te non vedi perché c'è tutta la scocca della macchina e te magari agisci su...cioè sai che comunque è cliccato una ruota? Sì perché diciamo che un modello 3D è diviso in tanti in tanti mesh, in tanti pezzi, che tu puoi dargli anche un nome direttamente nel tuo programma tipo Blender e te li ritrovi poi questi nomi dentro 3JS.Quindi praticamente vai a sparare il tuo raggio e lui ti dice "hai toccato la mesh che si chiama ruota per dire e allora poi la modifichi come vuoi.Veramente veramente interessante io in realtà e la mia domanda era un po finta perché con con 3js ho fatto un esercizio con con il duomo di milano dove andavo a caricare un modello del duomo di milano e cliccando sulle parti andavo a nascondere che ne so il tetto queste cose semplicemente come dici tu andando a lavorare sul modello che ha un ID per ogni parte e quindi puoi anche entrare a quel livello di dettaglio giusto? Sì sì è datto.Su questa cosa del raycasting in realtà mi è venuta in mente un'analogia di quello che succede sui browser sugli eventi javascript che quando clicchi un bottone.Te puoi mettere un listener sul bottone oppure su tutti i parent e l'evento può passare diciamo sotto fino al document root e quindi anche lì lui sa, il browser sa quali sono gli elementi che stai attraversando, però è molto più semplice perché sei solamente su due dimensioni e che non quindi non vai a spostare la camera però ecco credo sia una cosa simile.Un vecchio bubbling.Esatto, il bubbling è la propagation.Tu hai detto che questo tipo di lavoro si può fare anche con dei game engine come Unity.dal tuo punto di vista che differenza c'è tra scrivere il codice a manina anche a livello di che ne so di velocità o di elasticità e usare un game engine? Allora chiaramente il game engine è nato per fare quelle cose lì con un'interfaccia grafica che ti semplifica la vita quindi a a livello di velocity non c'è paragone, anche se esiste qualche editor, anche ultimamente ne stanno venendo fuori tanti per 3js che provano un po' a colmare questo dislivello con i game engine storici, che poi sono Unity e Unreal Engine.Però, qual è il discorso? Prima di tutto, creare un mondo 3D con questi game engine e poi andarlo a esportare per girare sul browser tramite WebGL non è una cosa facile, nel senso che spesso questi game engine hanno delle funzionalità che andarle poi a tradurre in un contesto WebGL si rompe qualcosa spesso.Primo fra tutti il problema di WebGL2, che è il più recente ed è implementato da tutti i browser, a parte Safari, caro ecchio Safari.Quindi se noi abbiamo fatto le prove, vai a esportare da Unity per WebGL, gira tutto bene su tutti i browser, poi vai su Safari e è tutto rotto.Un'altra differenza sostanziale è che se tu con Unity vai a creare la tua scena 3D, il tuo mondo 3D, puoi utilizzare quelle che si chiamano rendering pipelines, quindi diversi modi di renderizzare.C'è una rendering pipeline in Unity che si chiama High Definition.questa va a utilizzare una cosa che si chiama ray tracing, che ora spiego anche meglio volendo, però è una cosa che richiede una potenza di calcolo enorme, quindi una scheda video di un certo tipo, e che magari non ce l'hai a disposizione su tutte le macchine, andare a fare una cosa creata con un game engine e farla girare su WebGL non è il massimo, non lo fanno in molti.Io ho cercato diverse reference ma c'è pochissimo e non è che funzioni benissimo.Ricordo che qualche tempo fa abbiamo fatto un episodio con Marco, lui si occupava di sviluppare videogame su Unity e ci diceva che l'esportazione web diciamo che non è poi così magica dentro Unity.Però con la semplicità d'uso di Three.js tutto sommato colma molta di questa complessità.E adesso io mi chiedo, siccome hai parlato di Safari e siccome io vengo dal mondo web dove la compatibilità cross browser è stata soprattutto uno dei grandi crucci degli sviluppatori front-end, io ricordo gozziliardi di polyfill dappertutto, chiedo in ambito 3D e in ambito WebGL come ci si comporta? Allora ci si comporta in questo modo si testa su tutti i browser e funziona tutto poi si va su Safari non funziona niente.Un pochino riassume l'esperienza cioè per far funzionare una roba WebGL su tutte le piattaforme allora la cosa buona è che sotto il cofano c'è OpenGL, quindi uno standard, una libreria che esiste da '92 la prima versione, quindi si parla di praticamente 30 anni, quindi diciamo che l'implementazione nei vari browser è parecchio coerente, diciamo, più o meno tutto allo stesso livello e questo ti semplifica la vita perché davvero non è come quando andavi a usare, una funzione CSS in Internet Explorer 7 che non era ancora implementata, ci sono tutte le cose a disposizione.Quello con cui ti scontri quando vai a fare i test sui vari browser è, sono più che altro i limiti, che ne so, Safari su iOS, quindi su mobile, ha un limite alla memoria che puoi usare che è molto più basso di tutti gli altri browser, per cui una cosa che gira benissimo sul telefonino Android, vai su iPhone e ti crasha e lui proprio non ti dice niente, ti refresha la pagina, un incubo perché le prime volte che ti scontri con questa cosa non sai assolutamente che fare, quindi ci sono una serie di cose da fare per ottimizzare principalmente per Safari, tra cui appunto, l'avevo accennato prima, a seconda del dispositivo della scheda video c'è una dimensione massima che le tue textures possono avere, quindi che ne so, di solito sono potenze di 2, 2048x2048 è il massimo che puoi usare se vai a usare una texture più grande ti scoppia l'applicazione.Poi c'è un'altra cosa importante sulla memoria cioè noi si pensa sempre nel contesto web che comprimere un'immagine quindi ottimizzare una JPEG per ridurne il peso è un processo Allora, una texture, che poi è un modo per chiamare un'immagine nel mondo 3D, è composta da tanti pixel.Ogni pixel è composto dai canali R, G, B e Alfa, e per ogni canale utilizzi, mi sembra, 8 bit.Se moltiplichi questi 8 bit per i 4 canali, per tutti i pixel di cui è composta la tua immagine, vengono fuori mega e mega di memoria, Questo è il limite più grande col quale ti scontri, cioè devi ridurre principalmente le dimensioni in pixel delle tue immagini.Questa è una cosa importantissima perché non è spiegata bene da nessuna parte.Il limite grosso appunto di Safari è questo, la memoria a disposizione della scheda video è molto bassa, per cui dovrai fare la tua versione per iOS, controllare se sei su iOS o Safari e servire una versione dell'applicazione che abbia le texture ridotte quindi tu hai accesso tramite l'API a quello su cui stai girando cioè una specie user agent, che sai che quel context WebGL sta girando su un dispositivo iOS con safari x.y o è anche informazioni proprio sull'hardware? no, no, vedi, lo dico proprio dallo user agent.ok si, si, no, ma utilizzi javascript, quindi fondamentalmente usi veramente lo user agent per ottenere queste informazioni.e quando dici...scusami, quando dici delle texture, devi ridurre i pixel, perché la tua scena, i pixel saranno sempre gli stessi.Te dici per esempio che una texture di una parete che te la fai da un gradiente dal bianco al grigio in realtà se questa cosa è troppo complessa la fostolo bianca, cioè la texture è un quadrato bianco replicato.Cioè questo intendevi? Sì, è una roba del genere.Diciamo che io metto il mio cugo nella mia scena 3D e sopra ci metto...non so...faccio sembrare come fatto di mattoni, quindi utilizzo una JPEG con i miei mattoncini disegnati sopra e le vado ad applicare sulle sei facce.Mi ricordo un po' i tempi del Commodore quando le texture, c'era una quantità limitata di memoria e le texture venivano flippate e quindi la forma dello schema di gioco veniva disegnata in funzione di come venivano flippate le texture per non colmare cioè era la stessa immagine però la trasformavi per non dire c'è due immagini? sì la trasformavi con un flip orizzontale o verticale per ottimizzare lo spazio però occhio prima sei passato a parlare di jpeg e tu hai detto adesso stai dicendo io il mio problema è la memoria, ok? Quindi perché ho dei limiti fisici proprio di caricamento di queste texture e la compressione dell'immagine non è uno strumento che puoi utilizzare? Oppure la decodifica dell'immagine in quel caso ti va a sovraccaricare la CPU e quindi ti crea altri problemi? Purtroppo la compressione delle immagini ne riduce il peso ma le lascia lo stesso numero di pixel, è quello il problema.Anch'io all'inizio pensavo che comprimendo le immagini andassi a caricare meno la memoria della gpu, in realtà è proprio il numero di pixel base base che è quello che conta.ecco vedi completamente un altro modo di ragionare perché la texture viene applicata tipo cioè viene comunque replicata immagino una macchia di lopardo chiaramente se sono molto definite quindi hai un pezzo di pelle molto grosso è più difficile da gestire piuttosto che avere un piccolo pezzo di pelle che lo puoi replicare.Si ovviamente si vanno a usare queste tecniche laddove possibile si va a ripetere lungo e largo una texture piccola per risparmiare della sua memoria.Mi ricordo ai tempi del...questo per me è proprio un tuffo quando facevo il videogiocatore, che quelli bravi a Quake 3 levavano tutti per avere i 120 frame al secondo, perché alcuni salti li potevi fare solo se avevi quei 120 frame al secondo, giocavano con una specie di ray tracing, Cioè quelle pareti erano tutte nere, oppure bianche, oppure grigie, tutto senza texture per andare più veloce.Vedete questo qui? Ho letto anche il libro "Masters of Doom" dove Carmack si è fatto un mazzo tanto per ottimizzare, ha creato dei sistemi per ottimizzare al massimo e creare queste grafiche incredibili all'epoca e poi la gente ci giocava levando tutto perché era più performante quando giocavano in un deathmatch online.Guarda, io l'altro giorno ho visto un video su come si faceva ai tempi del NES, il primissimo Nintendo, per fare entrare un gioco in una cassetta che erano, quant'aveva, 40 KB mi sembra di memoria massima utilizzabile e facevano dei lavori che io sono rimasto a bocca aperta per il livello di ottimizzazione a cui arrivavano proprio al singolo bit, ma una cosa incredibile.È perché probabilmente sapevi di essere in questa gabbia più stretta di quello che ti serviva, allora dovevi fare in modo di ottimizzare, mentre ora forse questa cosa è un po' meno percepita perché probabilmente la potenza di calcolo o la memoria a disposizione è talmente tanta che non è nemmeno più un problema.Vedi Chrome, per esempio, che è la cosa che mi sta mangiando più CPU in questo momento.E sto guardando anche le tab, perché chiaramente mentre voi parlate io sto guardando tutte le demo di 3js, di canon js.Non sono quelle le tab che stanno succhiando più memoria.E Facebook.Ma anche lo stesso Google Meet dove siamo.Ma certo, no, però quello che vi dicevo prima del riutilizzo delle texture era una di quelle tecniche.Adesso non ricordo come si chiamasse il documentario, ma c'è un documentario sul game design molto bello su Netflix e io ho visto la, non so se vi ricordate Prince of Persia, il vecchio gioco, che i livelli, cioè le texture dei livelli erano sempre quelle, le forme dei livelli erano sempre quelle ma flippate e andare via a costruire girando queste cose dei nuovi livelli molto molto figo io ragazzi vi devo chiedere un momento perché dobbiamo ringraziare i donatori di questa settimana e i donatori sono due! Hangtime23 che ci ha offerto tre birre e lo ringraziamo e poi Luciano Mammino che ci ha offerto 5 birre scrivendo "podcast splendido, format rilassato, ottimi temi e ospiti di eccezione" continuate così senza esagerare con l'alcol Diciamo che i consigli li prendiamo come i consigli dei nostri genitori, quando ci dicevano "uscite ma non bevete" qualcosa del genere.E ne approfitto per dire che in realtà Luciano sarà il nostro ospite in una delle prossime puntate dove ritorneremo a parlare di Nod ed è la nuova versione del motore v8 versione 9 che un po' genera confusione ma ce la faremo spiegare meglio da lui.Ritorniamo per un attimo ad Andrea e a questo magico mondo a tre dimensioni per persone come me e come Leo che viviamo in un mondo a due dimensioni no? La mia domanda è...è Andrea.Scusa, ero mutato.Stavi ridendo un scemo.Sì, esatto, sembravamo molto cringe.Sì, un po' di imbarazzo, ma non ti preoccupare.La domanda è "use case".Allora, questa è una domanda che volevo fare io, nel senso che...ecco, volevo un attimo contestualizzarla.La domanda è, abbiamo parlato di videogiochi, scene 3D, ci siamo avvicinati un po' ai configuratori e volevo capire, al di là del settore entertainment, se ci sono altre applicazioni...perché uno se cerca le demo di 3js e vede tutte cose molto orientate all'interno.Cioè uno guarda queste scene e ci gioca un po', però non so se ci sono altri target, altri casi d'uso dove possono essere utilizzati, non lo so, per data visualization o qualcos'altro a livello a un livello aziendale, a livello di business, esiste qualcosa? Si sta lavorando su qualcosa? Mi viene in mente un caso d'uso a livello di business che ci ha riguardato in prima persona a me e alla mia azienda con la pandemia che c'è stata.Siamo andati a creare uno strumento di di lavoro, uno strumento B2B che permettesse di rimpiazzare gli incontri di persona, che le fiere o gli showroom delle aziende, quindi rimpiazzarle con un'esperienza virtuale, remota nel web.Questo grazie a WebGL.Noi, per esempio, abbiamo creato showroom virtuali.L'ultimo che abbiamo fatto è per Ferrari, per far vedere nuovi modelli di auto prodotti da Ferrari tramite uno strumento che permettesse ai venditori di sostituire l'esperienza in showroom, nel concessionario e quindi abbiamo fatto una web app che aveva la videochiamata come su Meet, su Zoom, eccetera ma di fondo, di sfondo della chiamata c'era la macchina in 3D che il concessionario, insomma il venditore, usando il mouse faceva girare, apriva dettagli, contenuti di approfondimento eccetera.Il cliente, diciamo, dall'altra parte vedeva questi contenuti e un po' replicava l'esperienza fisica dell'Option Room.Altre applicazioni...l'education, di sicuro.Io ho visto la matematica spiegata con WebGL, con la terza dimensione, che è una cosa bellissima, più facile da assorbire rispetto a dei numeri scritti su un foglio.Ho visto strumenti per addestrare magari lavoratori che devono andare a operare su macchinari complessi, utilizzare la realtà virtuale, comunque anche il WebGL, per addestrarsi a usare questi macchinari.E poi ultimamente, per...hanno usato spesso il 3D o comunque il WebGL come supporto allo storytelling di un'azienda per raccontare magari un suo prodotto.C'è un esempio che mi viene in mente che è Vanmoof che fanno biciclette elettriche, molto belle, che hanno fatto per il lancio del loro modello ultimo una landing page dedicata in cui la bicicletta in 3D, scrollando col mouse, viene raccontata, girata e mostrata in tutti i suoi particolari all'utente e in questo modo, appunto, aiuta a raccontare il prodotto, questa esperienza 3D aiuta a raccontare il prodotto.di casi d'uso ce ne sono diversi qualche tempo fa lavoravo per un grande editore italiano dove per esempio stavamo utilizzando 3js per fare data visualization su modelli 3d di territori un altro esempio che sto usando adesso per un mio side project sono le nuove librerie di Mapbox, non so se avete avuto modo di vederle, utilizzano le web cgl per estrudere il terreno creando su web qualcosa tipo Google Art, ma fatto meglio con una qualità migliore ed molto figo perché in realtà funziona molto bene.Ed è tutto grazie a questa tecnologia.Sì, altri esempi che mi vengono in mente sono per esempio i musei che sempre per via della pandemia si sono magari trasformati in esperienze 3D sul web con WebGL.Oppure, per esempio un festival famoso di musica elettronica, il Tomorrowland, è stato ricreato tutto in 3D nel web da un'agenzia americana, si chiama Dog Studio, molto famosa, e hanno fatto un lavoro eccezionale per far rivivere l'esperienza del festival, che vabbè, ovviamente è tutta un'altra cosa sul web, però insomma i casi d'uso si sono più disparati.E uno io lo porterò poi nel paese dei balocchi, uno molto bello fatto da New York Times.Domanda, il mondo del 3D si incrocia con il mondo del virtual reality e dell'augmented reality? Assolutamente sì.Io se voglio posso raccontare di un progetto a cui ho lavorato di recente, che è proprio nel mondo dell'augmented reality.Praticamente allora abbiamo dovuto creare per Golden Goose, che è un brand di scarpe, di abitamento, un'esperienza in realtà aumentata che funzionava così.hanno stampato un libro e tramite un'applicazione fatta da noi, inquadrando questo libro, un'applicazione web, quindi si parla di realtà aumentata nel browser, inquadrando le pagine del libro, li facevi prendere forma, inquadrandole col cellulare, li prendevano vita nell'applicazione sul telefono quindi magari partiva un video o un contenuto 3d tramite 3js in questo caso ma ogni tanto tutto qui.Si ma mi chiedo con l'aumented reality tu avrai dovuto usare immagino le web api per l'accesso alla fotocamera giusto analizzarti la scena della fotocamera e andare poi a posizionare all'interno di questa gli elementi 3D, no? C'è qualcosa che semplifica questo tipo di percorso o te lo devi andare a fare a manina? No, esistono dei prodotti commerciali sul mercato.Il leader mondiale adesso si chiama 8Wall, è un'azienda californiana che fa un motore che ti fa questo lavoro qui senza doverlo fare a mano perché comunque è di una complessità piuttosto elevata nel senso che c'è di mezzo anche la computer vision nel senso che il tuo telefono muovendosi nello spazio nelle sei direzioni poi devi andare a renderizzare i tuoi modelli 3d nella scena e farli stare al loro posto e non è proprio facile.Esistono questi prodotti, noi abbiamo utilizzato Hitwall.Di open source non c'è niente? Che io sappia ancora no, però non mi aspetto che insomma breve vengano fuori queste cose, perché in realtà ci sarebbe uno standard che però è ancora in fase di stesura, non è ancora stato ultimato, che è la WebFXR, quindi in realtà è un mista su web, però non è ancora stato finalizzato e da quando verrà finalizzato, quando poi i browser lo diventeranno, e sto guardando te le Safari, ci sarà un lasso di tempo.Nel senso Chrome non è che è in pari.Diciamo che i membri dei sviluppatori di Chrome sono anche membri del comitato che ridige questo standard, quindi sono proprio sul pezzo, mentre si sa che quelli di Apple sono sempre un passo indietro.Quindi Chrome è il browser di riferimento per quando vengono supportate queste cose? Cioè quello che le implementa per prima? sì sì già ne implementa una parte via via che vengono definite le cose le implementa per primo e firefox invece come si comporta? firefox in realtà aveva tutto un riparto dedicato a questo mondo.c'è un licenziato di tutto.è quello avevano un bel team un bel po di elementi validissimi che sono stati mandati a caldo purtroppo.E lei lo seguirà? Sì.Bene, Andrea.Io credo di averti fatto tutte le domande che volevo farti.In realtà mi sarebbe piaciuto vederti giocare un po' con questi magici giocatori.Magari ne mettiamo qualcuno tra i link.Leo, tu hai qualcos'altro? Qualche dubbio? No, cioè sì, ma è stato un po'...tipo anche prima ha detto "è nel telefono nelle sei direzioni" "Come sei? Non sarà detto tre?" Poi ho capito che c'è anche l'avanti e l'indietro...è veramente molto complesso far entrare all'interno di uno che ha sviluppato sempre per il web cioè siamo quasi off topic per quello di cui si occupa Gitbar oggi è stato super interessante perché poi quando vedi questo tipo di esperienza all'interno del browser e ti dici "ma come fa a funzionare tutta questa roba?" e l'ho visto perché poi quando sono stato lì in ufficio da Andre le vedo come si passa da renderizzare una cosa, da vedere solo linee, a metterci le texture, cioè è un lavorone che è molto simile a quello dell'animazione 3d che è è sempre stata una cosa che per me sembra talmente lontana, talmente complessa.Invece ci vuole veramente un sacco di passione, perché poi è un ambito che ha poi tutto uno sviluppo nemmeno parallelo rispetto allo sviluppo web.È proprio una cosa diversa, cioè portare un'esperienza diversa all'interno di un contesto a cui si accede tramite HTTP, che è quasi l'unica cosa che hanno in comune.Quindi sono super soddisfatto di tutte queste informazioni.Sì, certo, vedere i modellatori e gli sviluppatori web insieme, per noi è veramente l'apoteosi del contesto cross funzionale.Sì, sì, sono d'accordo.Bello, assolutamente bello.Purtroppo è anche un argomento difficile da rendere in parole in un podcast, essendo altamente visuale, grafico, come cosa.Però spero di aver reso abbastanza bene.Ci sei riuscito benissimo.Questa è un po' la sfida di Gitbar, provare a raccontare ciò che non si può raccontare con le parole.Noi abbiamo un momento tipico e topico del nostro podcast che è il Paese dei Balocchi, cioè il momento in cui i nostri ospiti, quindi gli amici che ci vengono a trovare per bere una birra con noi, ci portano qualcosa che è stato importante nella propria carriera o comunque li hanno influenzato, hanno influenzato ciò che fanno tutti i giorni.Tu hai qualcosa da raccontarci, da portarci? Riconducono il paese dei balocchi.Ah, il paese dei balocchi.Allora, mi viene in mente un libro che ho letto tanti anni fa, che sto rileggendo proprio in questo periodo e mi ce l'offresco in testa.si chiama "Lo zen e l'arte della manutenzione della motocicletta".- Ah, che bello! - Hai letto? - Sì, un po' di anni fa, è bellissimo! Mi piace un sacco, sostanzialmente è un filosofo che si interroga su il concetto di qualità e per me la qualità è molto importante, quello che mi è il mio faro, quello che mi rende...mi ispira di più nella vita e nel lavoro e quindi vi raccomando a tutti, un bel libro.Leo tu hai qualcosa? Lo so che non ti aspettavi questa domanda.No, infatti sono molto impreparato.In realtà ce l'ho.Io qualche mese fa sono passato dal mouse al trackball, perché avendo tre monitor cominciavo a fare male il polso, a spostare di molto la freccia da una parte all'altra.Allora ho provato una trackball e devo dire che è stato amore a prima vista perché ha avuto un impatto...cioè si impara subito, sembra incredibile come passi da muovere la mano a muovere solo il pollice e ti torna tutto, non è che sbagli.Non ho più dolori al polso, è comodo per chi ha questi deathtop molto grandi perché alla fine spostarsi da una parte dall'altra è solo un movimento di pollice.Poi se avrò un problema al pollice tra un po' di mesi magari faremo una reference a questa puntata.Però la trackball in oggetto è la Logitech MX Ergo, con cui troverete il link.Comodissima, solida, ha due posizioni a seconda che vogliate avere la mano un po' più verticale, un po' più orizzontale.Si pulisce in 5 secondi, ha diversi tasti anche per scorciatoie.Comodissima, la suggerisco a tutti chi comincia a sentire un po' di questi problemi perché poi dopo arrivare al tunnel carpale è un attimo.Sì io ho immaginato a te che vado al fisioterapista per la riabilitazione del pollice.Esatto, ti farò sapere.No, io invece voglio riportarmi un attimino al mondo del 3d sul web.Ripeto, ho avuto modo di avvicinarmi a questo mondo e una cosa che mi ha impressionato è un un mini sito fatto dal New York Times.Per quanto riguarda data visualization e news experience, quindi diciamo costruzione di esperienze su fatti di cronaca in generale, il New York Times è sempre diciamo in prima fila.Immaginate solo che Svelte nasce proprio da questo tipo di esigenze in seno al New York Times, in realtà da uno sviluppatore delle New York Times.La cosa che voglio portarvi è un'esperienza interattiva sulla cattedrale di Notre Dame che qualche tempo fa ha subito un incendio anche abbastanza invasivo e diciamo che il New York Times ha creato questa pagina a scorrimento anche col modello 3D che si muove ed evidenzia le aree distrutte integrato col video della cattedrale che è veramente impressionante.Quindi io vi includerò il link a questa pagina e vi consiglio di buttare sempre un occhio al New York Times che in queste cose diciamo che è pioniere.Questa è un altro caso di uso del 3d cioè il 3d usato come una sorta di documentario come una specie di memoria storica per poter...sì simile a quella dei musei.Comunque sia impressionante anche il fatto che il New York Times non ha come core business quello di sviluppare tecnologia però ha sempre degli esempi molto...sempre in prima linea nel sviluppare queste cose e metterle all'interno del mondo dell'editoria che è particolare.Mi punzecchi la mia parte da giornalista perché su questo potrei farci non uno ma dieci episodi.Diciamo che il New York Times ha capito dove si deve andare quando si vuole fare informazione e soprattutto approfondimento.Cioè la news della vecchietta sotto casa che guarda lo scippatore va bene, ma se tu la racconti creando esperienza e dando del valore aggiunto oltre a quelle quattro righe, beh, hai creato degli spazi che prima non c'erano.Sì, sono d'accordo.Andrea, ti abbiamo spaventato.No, no, me l'ho messo in muto a ascoltare.Spero di non avermi spaventato io con tutti i miei discorsi sull'Easter Shade.No, però magari a fine episodio se ci condividi qualche link anche per approfondire, per scoprire un po' di più questo magico mondo a metà, tra il mondo di chi sviluppa videogiochi e il mondo di chi fa pagine web.Quindi sei un po' questa figura a metà, bivalente.Detto questo io ti ringrazio a nome mio Leo.Io ci vediamo, spero presto, per una birra visto che noi riusciamo ogni tanto a vedersi e credo che dopo questa puntata, visto che Andrea è presente nel nostro gruppo Telegram che abbiamo cercato @gitbar all'interno di Telegram, contattate Andrea, è lì, è disponibile per tutte le vostre richieste per fare live coding, fare tutto, progetti gratis.Elli mi ha chiesto proprio espressamente, ha detto "guarda, però dillo che io sono sul gruppo Telegram e ho bisogno di fare vedere queste cose".Per i progetti naturalmente pagati in visibilità.Sì, sì, sì.Con birre.Io ti ringrazio anche a nome di tutti gli ascoltatori di Gitbar.E nulla, noi ci sentiamo liberi di riromperti le scatole prossimamente o comunque quando hai qualcosa di nuovo da raccontarci.Quando volete, penso, è un piacere.Grazie Andrea.Grazie a voi ragazzi.Grazie, ciao a tutti.Ciao, a presto.Anche oggi siamo arrivati alla fine.Spero che questo episodio vi sia piaciuto.grazie al grandissimo Leo che mi ha dato supporto in un argomento che davvero, a parte qualche piccola passeggiata, non ho mai approfondito, ma che attira tantissimo la mia curiosità.Mi sono sentito un studente con il maestro a chiedere sempre cose.Ah sì, veramente, sembravamo...Mi piace perché si è creata quella situazione da bar dove ci sono i due junior che chiedono Al signore ma questo ma questo ma questo ma questo spesso anche andando a saltare qualunque tipo di filone insomma di struttura Argomentativa no infatti se l'episodio un po confuso abbiate pazienza eravamo troppo curiosi Vero vedissimo beh detto questo io vi ricordo al volo I nostri contatti info chioccio la github www.gitbar.it via email o @brainrepo su Twitter, poi Leo.Gruppo Telegram, Gitbar, non so se è @gitbar, ma ci siamo solo noi se cercate Gitbar dentro Telegram.Siamo lì, vi aspettiamo, abbiamo rotto il numero dei 300, adesso ci siamo ai 400, insomma a quanti siete? Siamo davvero tantissimi e tra l'altro io sto preparando il regalo al trecentesimo con questo trasferimento ci sto dando un po' lungo abbiate pazienza anche se è entrato un po con l'inganno abbiamo scoperto delle magagne però insomma se si è impegnato così tanto se l'è anche meritato assolutamente lo riconosciamo con con piacere detto questo io vi ricordo solo un'altra piccola cosa se l'episodio vi è piaciuto e avete un device apple in questo caso non utilizzate safari per vedere gli esperimenti web gl ma aprite l'applicazione podcast da lì potrete lasciare una recensione con il numero di stellette che più vi aggrada e magari anche due righe detto questo io credo di aver detto tutto non so se leo vuole aggiungere qualcosa? hai detto tutto non aggiungo altro.e allora noi vi diamo appuntamento alla prossima settimana con un nuovo episodio un nuovo ospite e anche un po di sorprese ciao Ciao! GitBar, il circolo dei fullstack developer.Una volta a settimana ci troviamo davanti a due birre e con BrainRepo parliamo di linguaggi e tecniche di sviluppo web, di metodologie e di strumenti immancabili nella cassetta degli attrezzi dei Full Stack Dead.