Mezzo secolo fa avevo fatto una modifica al frontend del mio FreshRSS per renderlo più piacevole per i microblog… e poi però ho smesso di usarlo per quello, perché era comunque abbastanza scomodo, molto clunky e legnoso, la UI tutta rotta. Altri client per FreshRSS che ci sono, e ce ne sono tanti, purtroppo non li ho mai visti affatto ottimizzati per post senza titolo, corti, che sono tanti di fila, ecc… quindi, comunque la mia soluzione aveva un motivo di fondo per esistere, ma il problema è che, appunto, non è buona, ahimé. 🥴️

C’è però un piccolissimo problema che avevo dimenticato, non avendo toccato il codice di quel coso per mesi: è talmente spaghetti che non credo di poter fare un buon lavoro, se ora lo usassi come base per aggiungere anche quest’ennesimo caso d’uso. Purtroppo l’ho totalmente riciclato dalla webapp di anteprima di t.me, espandendolo costruendoci da sopra e non dentro, quindi era inevitabile che finisse così, ma, non so perché, ci spero ogni volta… e invece puntualmente deve dimostrarsi solo poco più di un proof-of-concept. Vabbè, ci si goda il pochissimo nuovo che ora fa in più di prima. 😪️

Mi sa che piuttosto, non volendo fare una nuova cosa da zero (perché mi sembra molto superfluo), conviene un’altra cosa che avevo in programma ma poi non ho mai fatto, cioè aggiungere funzioni di visualizzazione, oltre che di scrittura, ad un altro programma che non tocco da mesi, WuppìMini, che invece non è spagoot. Sicuramente, parte della logica di gestione dei dati la posso riciclare da MBViewer comunque, quindi non sono totalmente rovinata… 😾️ (E, essendo quella una app ibrida solo-server e solo-client, sarebbe anche più versatile, è anche per questo che l’avevo fatta così.)

https://octospacc.altervista.org/2024/07/02/mbviewer-a-casissimo/

#MBViewer #MicroBlog #RSS #UX

[⤴️ https://octospacc.altervista.org/2024/02/01/emmebi-telegrammico/]

L’ultimissimo miglioramento che ho in ogni caso poi fatto ad #MBViewer è stato l’aggiunta di una funzione per importare codice #CSS e #JavaScript, per modificare come i post possono essere visualizzati. Entrambi funzionano allo stesso modo, con i relativi parametri URL che accettano sia #URL esterni che data URI. Niente di particolare per gli stili, semplicemente importo nella pagina la qualunque cosa venga data lì, ma per gli #userscripts è stato leggermente più #complicato. 😕️

Il punto sta nel voler evitare che #script essenzialmente non affidabili siano iniettati nel contesto della pagina semplicemente da URL, perché potrebbero fare tante cosine cattive; prima fra tutte, rubare #dati dall’archiviazione del #browser del mio dominio, cosa che è un #problema, perché gli utenti inesperti che aprono la app da #link non andranno a cercare di investigare cosa accade dietro le quinte (e, molto probabilmente, non lo farei realisticamente nemmeno io, seguendo la logica del “i miei siti sono miei e li conosco, sui siti altrui ho le protezioni del browser attive“). E quindi inizio a scendere in un rabbithole… ☠️

• #Iframe? Hmm… non so, non è il caso, sarebbero insicuri, ci sono alcuni modi in cui una pagina in frame può fare robe fastidiose. Non può essere assolutamente un’idea, proprio mai (foreshadowing). 🪟️
• Trovo un bel po’ di #librerie vecchie che ricompilano codice #JS per rimuovere pericoli, o lo analizzano preventivamente per la presenza di operazioni dannose così che possa non essere mai eseguito… praticamente tutte abbandonate, qualcuna esplicitamente dichiarata insicura e non patchata, e per qualcun’altra lo possiamo dare per scontato. 🐛️
• Forse questa libreria più recente, jailed, che sfrutta un iframe assieme ad un Web Worker per creare una sandbox forte e bloccare tutte le #API eccetto alcune che si decidono… No, l’ho provata e non va bene, non si riescono a passare alla sandbox oggetti complessi, tra cui i costruttori, è impossibile far funzionare API tipo quella del DOM. 🚧️
  • Sarebbe stata un’idea usare qualche reimplementazione del #DOM per NodeJS tramite browserify, tipo Cheerio, ma farla anche solo girare lì dentro è un altro casino allucinante. 🥴️
• WASM tecnicamente è una #sandbox a sua volta, e non accede alle API del browser se non con codice colla, quindi magari… teoricamente ok, ma nella pratica non ho trovato nessuna soluzione già bella e pronta che potessi usare per questo specifico scopo. 🕳️
• La #pazzia: PyScript… sarebbe quasi già pronto, ma avrei dovuto comunque modificarlo per bloccare tutte le API insicure (rimuovere #codice), e poi richiede 15+ MB di dipendenze di runtime… non ideale. 🗿️

Alla fine ci ho pensato meglio, e sono arrivata alla conclusione che è abbastanza sicuro far girare gli script in un iframe con proprietà src="data:[...]" e sandbox="allow-scripts" (che significa, “blocca tutte le proprietà sensibili eccetto gli script”)… voglio dire, nel visualizzare il contenuto dei siti, già permetto eventuali iframe provenienti dai post, e quelli teoricamente possono già fare quello che vogliono eccetto accedere ai dati della finestra root. Nella pratica, i programmini degli utenti quindi hanno accesso a (quasi) l’intera API JavaScript senza poter fare cose bruttissime. 🎉️

Finisco con dati ancora più tecnici, per chi non ha una vita: con questo #design, ogni #userscript deve provvedere ad esporre una funzione che, tramite la Channel Messaging API, viene richiamata dalla #app per ogni messaggio appena questo viene aggiunto al documento visibile; questa funzione riceve dati utili (per ora, solo l’HTML del contenuto; oltre a dati come l’id del messaggio nel flusso, che non sono granché utili all’utente ma devono essere restituiti alla app) e può rimandare nuovi dati indietro richiamando una funzione che è invece l’applicazione ad esporre allo script. Tutto questo ambaradan permetterebbe agli script di effettuare anche operazioni asincrone, comunque, non per forza di dover agire immediatamente alla chiamata. 🤓️

https://octospacc.altervista.org/2024/02/01/emmebi-javascriptico/

#API #app #browser #codice #complicato #CSS #dati #design #DOM #JavaScript #JS #librerie #link #MBViewer #messaggi #pazzia #problema #sandbox #script #stile #URL #userscript #userscripts

Tra i giorni passati fino a ieri, ho fatto delle robine #sperimentali su #MBViewer, era questo che dovevo #scrivere… La prima è stata, più che altro perché mi serviva effettivamente da tempo una piccola #app in grado di fare questa cosa, implementare la lettura del formato di esportazione chat in #JSON di #Telegram. Infatti, le #conversazioni da lì possono essere esportate anche in JSON per usi di manipolazione dati futuri, oltre che HTML per consultazione immediata; però, appunto non c’è ufficialmente un modo per leggere una #chat esportata in quel #formato macchina, e la conversione in HTML statico dopo sarebbe facile ma bruttina: avere un lettore con un’interfaccia a bolle classica so già che può tornarmi utile, perché ho qualche dump non-HTML da parte. 📦️

A parte la #scocciatura per interpretare la struttura #dati del testo di Telegram e trasporla in #HTML corretto, non è stato complesso… eccetto che c’è un #problema. Il sistema funziona, ma il #programma tende a soffocare male con dump di troppi #messaggi. Dopo poche migliaia, già subentrano #rogne, con l’uso di RAM della scheda del #browser che arriva a più di 1 GB, e il caricamento, se riesce a finire senza che tutto crashi, è veramente lentissimo. Potrei in teoria risolvere la cosa, ma è veramente una #pazzia, dovrei portare ancora di più la codebase all’assurdo per fargli caricare elementi DOM a mano a mano da una struttura che di base è comunque un singolo file tutto in memoria, perché così è il formato… per ora lascio tutto così, purtroppo nessuno mi paga, quindi nessuno godrà al 100%. 😈️

Giusto se volete provare, ho caricato una versione ridimensionata dell’esportazione del canale, con appena un mese e mezzo di messaggi: https://hub.octt.eu.org/MBViewer/#/dataUrl=https://hlb0.octt.eu.org/Misc/ChatExport_2023-12-10_OctoVoLTE_UwjPwbToBapltoHa/result_2311.json|platform=telegram.export. Se avete un vostro dump su un vostro server CORS-enabled, o alternativamente ospitate una copia della mia app sullo stesso (anche localhost), potete ovviamente usarlo… ma quello che dovrei fare è aggiungere un bottone per caricare un file dall’archiviazione del computer. 🔘️

https://octospacc.altervista.org/2024/02/01/emmebi-telegrammico/

#app #browser #canale #chat #conversazioni #dati #formato #HTML #JSON #MBViewer #messaggi #pazzia #problema #programma #rogne #scocciatura #scrivere #spacc #sperimentali #Telegram #video

[⤴️ https://octospacc.altervista.org/2024/01/16/spaghetti-a-breve-termine/]

Non sono passati nemmeno 10 giorni da quando avevo detto “aaa è improbabile che aggiornerò ancora #MBViewer, dovrei provare a far iniziare a funzionare il progetto definitivo #alternativo migliore…” 🥴️

Però poi mi sono resa conto che: magari del #progetto alternativo non è semplice progettare tutta l’interfaccia e il suo funzionamento (cosa che va fatta, essendo una cosa da #costruire da zero), ma certamente non si posso comunque granché se prima non preparo dei #componenti logici che so già che mi dovranno servire… e allora, tanto vale iniziare a lavorare per quelli, integrandoli nella #app che (per quanto #spaghetti) è già esistente e funzionante, e acchiappare un bel 2 in 1 (espandere quel #programmino, e nel mentre accumulare codice che mi servirà per quel molto altro più tardi). 📦️

La prima cosa un po’ intricata che serve è il supporto all’ingestione di dati da #piattaforme diverse, con #schemi diversi. L’idea è di avere un solo #schema di dati che la app usa per lavorare internamente, per evitare di avere spaghetti, ma questo vuol dire che bisogna fare qualche tipo di conversione. Ci sarebbero diversi approcci: 🔪️

• Il più classico sarebbe quello di scrivere (come degli schiavi indiani) delle #procedure di codice per tradurre ogni tipo di entità #API dai #formati esterni a quello interno, e viceversa… il che non solo è una pazzia, e richiede un botto di #lavoro (va scritto un numero di #funzioni complesse pari alle piattaforme da supportare, moltiplicato per 2), ma finisce per dare #rogne: appena decidiamo che lo schema di API interno va modificato o allargato, ecco che bisogna modificare in ognuna di quelle parti, ed ecco che magari escono nuovi errori e problemi. Ehhh, no, non ci sto dentro. 😩️

• La mia idea, invece, è di usare un #documento di #trasformazione, almeno per quando le task sono semplicemente selezione e riassegnazione di chiavi di #dati (per operazioni più complesse, il codice è più appropriato del #markup). Era questo che avevo già provato a fare mesi fa (e funzionava eh!), ma, riguardandolo ora, mi stavo rendendo conto che lo strano #formato JSON da me inventato ha dei #limiti abbastanza forti, tra cui penso sia un casino tremendo usare 1 solo documento di #traduzione per fare sia avanti che indietro. Quindi, ho iniziato a ripensarlo da capo, ma ho pensato abbastanza in fretta che, beh… #JSON non va bene per sta roba, lo si vede anche dal come devo mettermi a scrivere chiavi tipo “__robo__“; JSON abuse, doing I am. Però l’idea credo sia bona… 😋️

E allora, fortunatamente sono tornata sana giusto in tempo, prima di #impazzire ancora una volta dopo mesi con Jason; almeno, abbastanza sana per capire che è meglio impazzire con #XML, se proprio proprio, in questo caso. E, boh, ci ho perso 1 giornata e qualcosa (soprattutto l’altra sera in cui, mezza drogata di sonno, mezza cringiata per colpa della situazione, ho iniziato ad andare un pochino mentale), ma bene o male l’ho fatto funzionare un minimo. C’è stato di tutto in mezzo ovviamente; tra cui, il #godere per aver sistemato un #bug, eccetto scoprire poco dopo che, no, nulla era sistemato… e averci dovuto perdere un’altra mezza giornata. 📆️

Questa è una di quelle cose capaci di stupirmi anche se fatte da me: la sola #idea di poter raggiungere il 90% di quello scopo intricato semplicemente #componendo un documento XML in maniera adeguata, e avere vita facile per ogni #modifica, la trovo #pazza in concetto. Comunque, ho dovuto (iniziare a) scrivere una mega-funzione totalmente #originale per questa cosa perché, come già avevo constatato mesi fa, ma riconfermato appunto ieri, tutte le #librerie in giro per fare trasformazioni di dati così sono troppo generiche, a quel punto usare quelle sarebbe anche peggio che fare tutto in #codice. E credo di aver cercato fin troppo in giro. E, ahimè, prima o poi soffrirò di nuovo, perché dovrò scrivere pure la #funzione di traduzione inversa! 😵‍💫️

Che centra con la #applicazione mezza kangata? In pratica, avendo integrato questo #sistema già da ora, MBViewer può visualizzare (alcuni) #feed #RSS, e (con qualche problema, per ora) #profili #Mastodon, il che non è male. È male, invece, il mio aver scoperto solo ora che su Firefox avviene un problema con il parsing dei feed RSS, che dovrò sistemare… ma su #Chromium funziona tutto. Oh well. Ohhh, it’s so well. I #glitch non finiscono mai, la tortura della #programmazione è eterna!!! 😭️

https://octospacc.altervista.org/2024/01/25/mbviewer-per-distrarci/

#alternativo #API #app #applicazione #bug #Chromium #codice #componendo #componenti #costruire #dati #documento #feed #formati #formato #funzione #funzioni #glitch #godere #idea #impazzire #JSON #lavoro #librerie #limiti #markup #Mastodon #MBViewer #modifica #originale #pazza #piattaforme #procedure #profili #progetto #programmazione #programmino #rogne #RSS #schema #schemi #screenshot #sistema #spaghetti #traduzione #trasformazione #XML

[⤴️ https://octospacc.altervista.org/2024/01/13/wordpress-che-non-e/]

Dunque, quel bellissimo #MBViewer, che ho iniziato a realizzare appena 3 giorni fa… è già #SpaghettiCode. Ehh, si, quel codice di #Telegram lì non è proprio fatto per gestire un caricamento di dati troppo avanzato e tutto #ClientSide: nel suo normale caso d’uso riceve #HTML già preparato dal server, ed usa #JavaScript non #moderno, quindi tentare il #retrofitting che ho fatto io è chiaro porti a difficoltà. Si può fare, perché nella #programmazione si può fare tutto, ma è un #casino. …E un po’ me lo aspettavo, e lo sapevo da quando ho iniziato. 😁️

Considerate, questa #idea mi era venuta per un motivo molto #semplice: era da un po’ che volevo implementare una vista più #minimale e con #comodità moderne (come lo scorrimento infinito, o la vista in contesto) per il #MicroBlog nuovo, ma tenendo comunque io il controllo dei miei #dati. Farlo dentro #WordPress non mi va, dato che alla fine comunque dovrei usare #script #JS, e a questo punto ho ritenuto #intrigante l’idea di fare proprio una cosa a parte, che potesse potenzialmente essere facilmente adattata per prendere i #contenuti anche da altre fonti (e lo fa, legge #JSON da ovunque, se opportunamente assemblato), qualora il #sito Altervista dovesse avere dei problemi. 🧭️

Però, questa non è la mia #soluzione a lungo termine. Per quello, in realtà, ho in mente un #progetto semi-segreto che iniziai mesi fa, ma che poi, presa da altre cose, non continuai. Doveva essere una #webapp per il Fediverso e, potenzialmente qualunque altro #protocollo #social grazie ad un layer di astrazione di #API interno. È Il #software che vorrei far funzionare con una doppia #interfaccia, a #messaggi o a “piazza” (stile Miiverse), e quindi in secondo luogo anche come #client Matrix, e in terzo e quarto per #blog e #feed standard… problema è che, dovendo non solo #progettare tutto il #frontend, ma anche svecchiare una spaventosa porzione del #codice, non è affatto una cosa rapida arrivare ad uno stato di primissimo #MVP. 😳️

Insomma, è per questo che questa piccola #applicazione, tirata su alla bene e meglio e che esiste in buona parte per via di #lavoro non mio, l’ho chiamata “#distrazione”. Continuerò ad aggiornarla, anche dopo che ora ho aggiunto l’ultima funzione fondamentale, ossia l’apertura di #post specifici? Probabilmente no, sarebbe meglio pensare a sistemare quell’altro progetto e fare un robo fatto bene. Importa qualcosa? Naaaah… come si dice, “the first rule of gun safety is to have fun“? Vale la stessa cosa per il #coding, quando l’arma è la propria tastiera insomma. Basta sia stato #divertente. 😈️

https://octospacc.altervista.org/2024/01/16/spaghetti-a-breve-termine/

#API #applicazione #blog #casino #client #ClientSide #codice #coding #contenuti #dati #divertente #feed #frontend #HTML #idea #interfaccia #intrigante #JavaScript #JS #JSON #lavoro #MBViewer #messaggi #MicroBlog #minimale #moderno #MVP #post #progettare #progetto #programmazione #protocollo #retrofitting #script #semplice #sito #social #software #soluzione #SpaghettiCode #Telegram #webapp #WordPress

#Distrazione della giornata: ho preso in prestito il #codice #ClientSide che fa funzionare t.me, e l’ho riadattato per gestire #blog #WordPress in questa classica #visualizzazione “a #canale”, o più in generale “a bolle di #messaggio” (da cui uno dei significati del nome, #MBViewer)! 👁️‍🗨️

Potevo probabilmente sgraffignare codice #frontend di altro tipo per lo stesso scopo (anche se con una #UI un po’ diversa, ad esempio di vari #software del Fediverso), ma ho preferito questo di #Telegram perché non usa framework astrusi come React, solo #jQuery e quindi a farci #hacking si fa subito subito. ⚒️

https://octospacc.altervista.org/2024/01/13/wordpress-che-non-e/

#API #blog #canale #ClientSide #codice #distrazione #frontend #hacking #jQuery #MBViewer #messaggio #MicroBlog #REST #siti #software #Telegram #UI #visualizzazione #WordPress