Ieri sera, una roba che davvero mi ha fatto perdere la pazienza e ogni speranza, maledetto web development, avevo iniziato a scrivere questo post ma ho poi deciso di a mimire… in pratica, il Canvas HTML5 è inconsistente, tra diverse funzioni, diversi browser, e a tratti è proprio buggato mi sa. In breve: non si può tracciare linee o contorni puliti lì dentro, viene tutto sfocato, mannaggia!!! 😶🌫️️
Beh, non è la prima volta che scopriamo che la roba nei browser gira a furia di hack, quindi non so perché proprio questa volta sono così spiazzata, però questo è. Ho scoperto questa magagna dopo aver notato che, i bordi di rettangoli nel programma che sto facendo, che sono puliti su Firefox, appaiono tutti blurrati in Chromium. Ho fatto qualche test al volo, e notato che cambiare lo spessore dei tratti sistemava il problema su un browser e lo faceva apparire sull’altro. “Sarà colpa di p5.js“, ho pensato, “ti pare che nei due browser web più grandi al mondo ci sono gli spacc?“… e quindi ho cercato. Big oopsie, perché una issue l’ho trovata, ma da lì ho scoperto che p5.js in realtà non centra. E… ecco, facendo dei test con la API Canvas liscia, senza la libreria esterna di mezzo, persiste il problema. 👹️
https://octospacc.altervista.org/wp-content/uploads/2024/06/image-2.pngHo fatto un piccolo file con vari test: jsbin.com/dadobugiye/ (caricato su JSBin, così potete verificare anche voi). In foto c’è a sinistra come ha renderizzato Firefox, e a destra Chromium (entrambi chiaramente sul mio desktop Linux). Tra le quattro linee spesse da 1 a 4 pixel, e i tre rettangoli con bordo da 1 a 3 pixel, notate come a spessore alternato si alternano anche la presenza e l’assenza di sfumatura. Quello che cambia tra la copia superiore e quella inferiore è che sulla seconda è applicato uno shift di 0.5 pixel sia per X che Y (la seconda soluzione più brutta tra le consigliate)… appunto, fare questa cagata pulisce ciò che prima era sporco e sporca ciò che era pulito. 🚬️La schifezza è dovuta al fatto che il browser fa anti-aliasing di ciò che disegna lui, e non c’è modo di disattivare la cosa; c’è una proprietà imageSmoothingEnabled che vale però solo per i dati immagine raw (forse è per questo che non ho mai notato problemi con, ad esempio, gli emulatori web di console). Quindi, in teoria si potrebbero implementare da zero funzioni per disegnare linee e roba varia, che scrivono direttamente i pixel sulla tela… ma non sembra qualcuno abbia voglia di implementarlo in librerie grafiche general-purpose e che non deviano troppo dalla API. (Io certamente no.) Shiftare ogni azione di disegno di 0.5 pixel in base al browser può sembrare una soluzione (dato che il problema è causato dall’allineamento subpixel, e ci sarebbe il metodo .translate(x,y) per farlo senza ogni volta sommare alle coordinate), ma non lo è affatto, perché lo vedete come le linee e i rettangoli appaiono tra loro diversi (e, curiosamente, le linee sono uguali tra i due browser)… 💱️
Computer potentissimi e piattaforme software di complessità estrema e potenzialità infinite, ma poi non riescono a fare delle fottutissime linee non sburrate, stiamo tornando indietro. E falliscono appunto in modo pure inconsistente!!! Non sembra proprio esserci soluzione, se non creare delle mie astrazioni sulle funzioni di disegno di linee e rettangoli (che fanno in autonomia gli shift necessari ogni volta). Veramente sto male, è possibile che se il mio numero arbitrario di spessore in pixel è pari o dispari, a seconda del gusto del browser e dell’allineamento .0 o .5 a subpixel, deve venire tutto: o grigino anziché nero, o spesso di 2 pixel anziché 1 (o la qualsiasi), o coi bordi sciolti in lava? Per ora continuo a usare p5.js e quindi il disegno a forme sul Canvas per questa applicazione, perché è comodo, ma per i prossimi progetti chissà che dovrei usare… nulla si avvicina neanche lontanamente all’efficienza di scrivere del JavaScript vanilla e averlo immediatamente prendere vita. 🤢️
https://octospacc.altervista.org/wp-content/uploads/2024/06/image-4.pngHo provato anche un’altra soluzione di tizi, un po’ brutta ma che avrei accettato se avesse funzionato: applicare un dato filtro SVG… che dire. Vero, non si vede più alcuna sbleurratura, ma gli angoli dei tratti sono più arrotondati (non chiesi), e lo spessore è comunque sbagliato. E una cosa stramba bonus: i lati delle linee superiori (ma non di quelle shiftate?!) sono tipo corrotti, hanno dei pixel che appaiono un po’ a sinistra come delle spine. Ma come cazzo è possibile?!?!?! 🌋️https://octospacc.altervista.org/2024/06/07/tela-spaccata/
Poche ore fa ho scoperto per caso una #stregoneria, una cosa che proprio non immaginavo qualcuno avesse potuto portare alla piattaforma #HTML5, e insomma, non credevo ai miei occhi… poi ho visto che ci sono anche i sorgenti e tutto, e allora ho dovuto crederci per forza. Hanno portato ben 4 versioni di #Minecraft#JavaEdition al #browser. Precisamente, ben 2 release, 1 beta, e 1 alpha, a quanto pare. 😭️
https://octospacc.altervista.org/wp-content/uploads/2024/04/image-5.pngEsatto, non sto parlando tipo delle eventuali ricreazioni sia ufficiali che non di versioni come la classic, ma proprio di quella #Java del #gioco ricompilata con una strana VM verso JS+WASM. Talmente epica come cosa che ho dovuto subito metterla sulla #SalaMuseoGames, avevo immaginato per tanto tempo l’idea di riuscire a far girare queste versioni del gioco come #webapp per alcuni casi d’uso ma zero idee su come anche solo iniziare. Merda è infuocata. https://gamingshitposting.github.io/SalaMuseoGames/2024/04/19/minecraft-java-edition/ ❤️🔥️In tutta onestà, non è che giri granché, se sul mio fisso oscilla tra poche decine di FPS nonostante i dettagli tutti al minimo… e neanche a dirlo, ma sul (mio) telefono è inutilizzabile per quanto è lento, tralasciando il fatto che non ha controlli touch. (Ma vabbè, c’è Pojav lì.) Ma probabilmente è la release 1.8.8 (quella caricata sul mio sito) che è particolarmente pesante, le altre tre non le ho ancora provate e dovrei. Però è spacciato come gioco per Chromebook, e io vorrei davvero sapere come può mai girare in modo soddisfacente lì, allora… 👄️ (però comunque, un minimo giocabile lo è)
An excellent indie #Roguelike ( Thanks @jake4480 ) that runs on current machines (Windows, Linux, MacOS, & HTML5). Frankly, very good! Good surprise! I would have liked it to be compatible with older machines, but no. Two quality PDF manuals. On my list of favorite Roguelikes! If you like this kind of game: recommended! :0)
Trying out GodoRogue tonight. It's great! You can use the keyboard commands or mouse directly to different locations, how you can see in the screenshot - the yellow line. And you can play this one in-browser. It was made in HTML5!
https://octospacc.altervista.org/wp-content/uploads/2024/03/image-19.pngPrima che scatti non solo un nuovo giorno ma addirittura il nuovo mese (!), mi sbrigo a scrivere prima che sia troppo tardi per postare il #memino (sarebbe una tragedia)… momento 🅱️uona #Pasqua quindi.Quindi, ora che ho la vostra attenzione: un po’ curioso che avvenga in questa giornata, ma mi era venuta una mezza voglia di far risorgere il sito della #SalaMuseoGames, che per cause di forze maggiori ormai era bello che stagnante. No, in realtà c’è un motivo… collegato alla mia nuovissima micro-fissazione di usare #webapp anche per i giochi su mobile, quando possibile, per tutto quel discorso di non sputtanarmi il telefono pure stavolta. In sostanza:
Sarebbe buona cosa impostare sulle pagine del sito, oltre ai #PWA manifest (relativi sia a tutto il #sito, che a singoli #videogiochi ospitati) che è un attimo implementare, anche il classico Service Worker di cache offline (ora che li ho compresi benissimo), così da rendere tutta l’operazione una roba ancora più godibile su #mobile. Possono essere anche fatti piccoli aggiustamenti, del tipo di: il gioco si apre già a tutto schermo quando installato come PWA (invece di far vedere tutte le cose solite della pagina web). 🤖️
Giravo un po’ su Appsco.pe per valutare giochini a casaccio, e mi sono accorta che si e no 1/5 di quelli che ho provato ad aprire erano link morti… ecco, per quanto il #web moderno come piattaforma di esecuzione software sia meraviglioso soprattutto per gli utenti, come #piattaformadi distribuzione è veramente fragilissima e, al contrario del classico giochino Windows o Android (o anche Flash…), che (di norma) sai che se ti scarichi il file ce l’hai per sempre, con gli applicativi #HTML5 è un attimo e questi possono sparire nel vuoto (la mia cache offline sul mio singolo telefonino relegata a soltanto il mio#browser ovviamente non conta come #backup). Per qualche motivo (abitudine…) sono finita a caricare solo ROM di vecchie console sul sitarello, anche se il mio intento sarebbe stato quello di mettere potenzialmente qualsiasi cosa, inclusi i #giochi in HTML5; tutto quello che ho messo finora si trova già in millemila romset strapreservati e ben organizzati, quindi con quelli il valore del mio lavoro è giusto il fornirli su una galleria “senza attrito”, ma nulla di estremamente utile, mentre invece con questi altri… 😤️
Vabbé, secondo voi riprenderò in mano la Sala Museo o ricadrà tutto nell'oblio? (Sondaggio anonimo, aprite il link originale al post per votare se leggete da altrove plz)- Riprenderò da ora ma lasciando un buco di quei 2 mesi inattivi
Riprenderò recuperando anche i 2 mesi di giochi arretrati
Sticky Thing Interactive #HTML5 experiment for desktop and mobiles. Click and drag, move and throw. Post-its are versatile and can be used in various settings for various purposes. They are commonly used in classrooms and workplaces but can also be found in art, media, and social media. Post-its have also been used as tools for public engagement and persuasion - http://statusl.ink/stickythinghttpswwwspielzeugzdeh-1040.htm
I tried adding video alt-text on my website [1], but apparently HTML5 <video> doesn't support the alt attribute. @mozilla docs [2] suggests adding text-tracks, so I added a VTT file for closed captioning, that feels hacky.
Is this really the best option or are there better ways? My video doesn't have a voice track, it's better described with alt-text.
Alla fine, ho sistemato quell’ #applicazione (e l’ho caricata), quindi ora sul vecchio #Android ho sempre #KDEConnect a fare da #touchpad, ma in più ho questo #WebView in primo piano: a tutti gli effetti un #browser#web totalmente funzionante eccetto per il non essere cliccabile, che mi riproduce qualsiasi cosa io voglia. 🤭️
Ecco i #tostapane volanti sul mio #Huawei tutto #spacc, sotto c’è il touchpad #virtuale attivo che funge.Tbh, ogni volta che in qualche modo riesco a rimettere in circolazione degli screensaver su un #dispositivo dei miei, penso che il #mondo è diventato proprio #noioso. Solo perché non sono stati più necessari, ecco che i #salvaschermo sono spariti. Spero che prima o poi torneranno #mainstream come lo erano un tempo, e che le generazioni correnti e future possano ricominciare ad apprezzarli. Ho visto questo #video (sotto) su #RokuCity, che mostra come #Roku ha dimostrato che al #pubblico generico gli screensaver piacciono… quindi potremmo bene farli tornare. Per favore. Voglio. Ormai su molti ambienti utente o sistemi operativi non sono nemmeno più supportati in modo adeguato, e questa cosa fa schifo perché metterli significa avere un’ #esperienza peggiore di cosa si aveva 20 #anni fa… 🙏️
I don't understand why some #WebDev "professionals" often use only ready-made #CSS libraries for website design. No, not everything is easy but, for example, creating #links so that users can see how they lead outside the #website is standard in my opinion.
I have illustrated it for clarification. You can of course change the #logo's to other UTF-8 characters or position according to the desired #design ;)
🧵 …I am always amazed at how some customers complain about the #design and #details of the behavior of their #website. However, more often than not, they have used purchased #CSS functions and have declared most #objects as <div> and not instructed #HTML5 clear. You can solve so much with #CSS3 and not necessarily with JavaScript - once with modern professionals 🙄
Hey #Flash game fans, turns out #Newgrounds supports playlists!
If you want to see me stream a Flash game or series of games, put together a quick playlist, let me know why I'd like it, and how long the game is (I stream 2 hours max usually)
Games can be classic, new, so-bad-they're-good, almost anything as long as they're themed well together and fun!
Best way to send me a playlist is through this form:
Google wants to make it harder to block ads. Thought experiment:
If, instead of ad blocking per se, we used browser extensions that blocked all tracking, prevented execution of arbitrary code, and made fingerprinting devices impossible, but also left all ad content visible, would Google (and the rest of their industry) still be opposed?
The answer tells you everything you need to know about why it is moral and ethical to use ad blockers.
We used to have this, when most ads used to be displayed as an <OBJECT> element, which was diligently eliminated by the WHATWG when they were drafting HTML 5. Before #HTML5 you could easily block any <OBJECT>.
It was easy to see then, as it is easy to see now, that HTML5 wasn't 100% driven by the lofty goals invoked at the time, even if upright individuals did great work as part of it, that was certainly not the primary goal of the companies that sponsored the work of the #WHATWG.
The W3C, founded in 1994 by web inventor Tim Berners-Lee, has quit X and declared the fediverse to be their primary social media channel. Follow them at: @w3c
@fluepke#W3C has pretty much become a rubberstamp for the #Google-led cartel that is the #WHATWG. An organization that doesn't give smaller browsers like #PaleMoon, #LadyBird, and #Lynx a voice in the writing of specs for web standards like #HTML5 and #CSS3 does not deserve support, and should not be seen as an ally of the #openweb.
@hexaheximal@esm@hexaheximal ...and even if we think local #WebApps are a legitimate way to handle sensitive comms - they ain't but let's just assume they are for the sake of argument - WHY would you do anything beyond a .desktop file that includes startup parameters for #Firefox (or even #Chrome if you're that kind of Cyber-Masochist!) that specify the browser, and the file to load.
Because any good #WebApp should be reduceable as #HTML5 + #JS6 + #CSS3 and measured in kB or maybe a few MB.
Google released #WebRTC in 2011 as a way of fixing a very specific problem:
> How do we build Google Meet?
Back then, the web was a very different place. Flash was the only way to do live media and it was a mess. #HTML5#video was primarily for pre-recorded content.
I now have a membership tier on my Ko-fi! Have you always wanted your own #HTML5 based #website? Access to exciting, moving, heart warming poems and short stories? What about 320Kbps #MP3 and #FLAC versions of my ring tones and UI notification sounds? Personal shoutouts and #software reviews? Well, for as little as just over a tenner a month, you'll get all these perks and more when you become a fireseeder!
By becoming a fireseeder, you're not only getting access to awesome benefits like those listed above, but you're helping to support a funny, loving, kind hearted #blind#neurodivergent who loves nothing more than being a technology geek and helping others in any way he can, be it through content creation, tech support, or the simple act of being there for someone in need. https://ko-fi.com/seedythreesixty
🆕 blog! “How to check something isn't an email address?”
In web-development circles, it is a well-known fact that trying to validate an email using a regular expression is… complex. The full set of modern email standards allows for such wonderful addresses as: chief.o'brien+ds9@spásárthach.भारत So determining whether or not your user has entered a valid …
~100 HTML elements, including 57 unique CSS class names across 83 attributes, 30 hidden DIVs, 3 iframes, 2 external script tags, 2 inline script tags, and 1 actual <img> tag.
the <img> is inside an iframe, nested 3 (!) levels of iframes deep.