inautilo, to react
@inautilo@mastodon.social avatar

#Development #Explainers
HTML attributes vs. DOM properties · What fewer and fewer developers seem to know https://ilo.im/15ynz8


#Framework #React #Preact #Lit #VueJS #WebDev #Frontend #DOM #HTML #JavaScript

nhoizey, to javascript French
@nhoizey@mamot.fr avatar

🔗 “67 Weird Debugging Tricks Your Browser Doesn't Want You to Know” by @alannorbauer

⚓️ https://nicolas-hoizey.com/links/2024/04/02/67-weird-debugging-tricks-your-browser-doesn-t-want-you-to-know/

nhoizey, to javascript French
@nhoizey@mamot.fr avatar

🔗 “67 Weird Debugging Tricks Your Browser Doesn't Want You to Know” by @alannorbauer

⚓️ https://nicolas-hoizey.com/links/2024/04/02/67-weird-debugging-tricks-your-browser-doesn-t-want-you-to-know/

iamdtms, (edited ) to javascript
@iamdtms@mas.to avatar
Simply DOM Preloader for not having issues with data loading delays  

https://codepen.io/iamdtms/pen/NWmgdmm

#javascript #js #DOM #preloader

Sherifazuhur, to random
@Sherifazuhur@sfba.social avatar
Sherifazuhur,
@Sherifazuhur@sfba.social avatar

If you’ve done/are doing research on the , let me know as there’s a new network - and they’d like to know you. @lebanon @iraq @egypt @syria @palestine

look997, to pcmasterrace Polish
@look997@101010.pl avatar

Który fotel najlepszy?
1,2
3,4
I napisz w komentarzu dlaczego?

  1. trzy regulacje zagłówka, wysokość oparcia pleców, opór odcinka lędźwiowego, odchylenie oparcia pleców z blokadą, siedzisko przód-tył, podnóżek, pięć regulacji podłokietnika, w tym składanie go, składanie całego fotela na pół, żeby np. móc schować pod biurko.

  2. ma regulowany odcinek lędźwiowy, przód-tył siedziska, odchylenie, podłokietniki, sporo regulacji, gorsza regulacja zagłówka, brak podnóżka

  3. ma regulowany odcinek lędźwiowy, dobrze regulowany zagłówek, podłokietniki, przód-tył siedziska ale brak odchylenia oparcia, brak podnóżka

  4. podobne do Ergosolid całe plecy, zagłówek, regulacje plecy zagłówek, kauczukowe kółka, aluminium, nawet ładne podłokietniki, ale brak regulacji przód-tył siedziska, brak podnóżka

  5. https://allegro.pl/oferta/niezwykle-ergonomiczny-obrotowy-fotel-biurowy-z-pelna-regulacja-nario-500-14826927009

  6. https://allegro.pl/oferta/ergonomiczny-fotel-biurowy-obrotowy-krzeslo-obrotowe-135x69x64-cm-premium-15112751768

  7. https://allegro.pl/oferta/fotel-biurowy-ergo-ergonomiczny-obrotowy-czarny-regulowany-z-kolkami-14469701830

  8. https://allegro.pl/oferta/fotel-biurowy-ergonomiczny-mark-adler-expert-9-5-15224226112

ZamhoidnLA, to Dom German
@ZamhoidnLA@mastodon.social avatar

Ukrainer*innen in mit der Unterstützung des Nachbarschaftstreffs laden euch kommendes Wochenende zum Wohltätigkeitsmarkt ein.

Ort: Ländtor Landshut,
Theaterstraße, 84028 Landshut
Datum: 15.03 - 16.03.2024
Uhrzeit: 10:00 - 17:00 Uhr

look997, to tech Polish
look997 avatar

Spodobał mi się Fotel obrotowy Ergosolid 139 x 70 x 70 cm 1499 zł.
Ocenicie, jakaś alternatywa? Może być droższy, ale nie przesadnie, kilka stówek.

To że podłokietniki wychodzą od tyłu, a nie od dołu, to mi się podoba wizualnie.
Ma dużo regulacji.
Podnóżek też dobra rzecz.

Zastanawia mnie odchylenie i zagłówek.
Zagłówka nie da się przód-tył regulować, a jest dość płasko względem oparcia, niektóry fotele mają bardziej wyprofilowane oparcie, i wtedy zagłówek jest bardziej do przodu.
Nie wiem czy przy odchyleniu, zagłówek będzie wystarczająco wysunięty do przodu, żeby trzymać głowę, gdy się patrzy na ekran.
Ewentualnie mocno pod biurko wjadę fotelem, i ekran podreguluję do góry i pochylę w swoją stronę, bo da się tak moim monitorem.

nosherwan, to Dom
@nosherwan@fosstodon.org avatar

🌐 :javascript:

Ok Web Components are good but we need an open web standard to maintain dynamic state in web applications and update components based on them.




minioctt, (edited ) to CSS Italian

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

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

Il punto sta nel voler evitare che essenzialmente non affidabili siano iniettati nel contesto della pagina semplicemente da URL, perché potrebbero fare tante cosine cattive; prima fra tutte, rubare dall’archiviazione del del mio dominio, cosa che è un , perché gli utenti inesperti che aprono la app da 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… ☠️

  • ? 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 vecchie che ricompilano codice 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 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 per NodeJS tramite browserify, tipo Cheerio, ma farla anche solo girare lì dentro è un altro casino allucinante. 🥴️
  • WASM tecnicamente è una 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 : PyScript… sarebbe quasi già pronto, ma avrei dovuto comunque modificarlo per bloccare tutte le API insicure (rimuovere ), 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. 🎉️

https://octospacc.altervista.org/wp-content/uploads/2024/02/image.pngEcco un esempio di tutto, alla fine: questo URL carica il mio MicroBlog, importa un foglio di che mette questo font buffo, e uno script che colora le parole dei in base a come si ripetono man mano (inutile, ma serve giusto per dare idea delle potenzialità)… <a href="https://hub.octt.eu.org/MBViewer/#/siteUrl=https://octospacc.altervista.org|platform=wordpress.org|includeStyle=data:text/css;utf8,@import%20url('https://fonts.googleapis.com/css2?family=Single+Day&display=swap');.MbPost{font-family:'Single%20Day',cursive;}|includeScript=data:text/javascript;utf8,function%20MbViewerFunction(data){const%20dom=new%20DOMParser().parseFromString(data.html,'text/html').body;const%20tokens=dom.textContent.split('%20');const%20words={};for(const%20i%20in%20tokens){const%20word%20=%20tokens[i];if(words[word])words[word]++;else%20words[word]=1;tokens[i]=%60%3Cspan%20style='color:${atob('Iw==')}${[0,'b58900','cb4b16','dc322f','d33682','6c71c4','268bd2','2aa198','859900'][words[word]]};'%3E${word}%3C/span%3E%60}data.html=tokens.join('%20').replaceAll('nn','%3Cbr%3E');for(const%20img%20of%20dom.querySelectorAll('img'))data.html+=img.outerHTML;MbViewerReturn(data)}">https://hub.octt.eu.org/MBViewer/#/siteUrl=https://octospacc.altervista.org|platform=wordpress.org|includeStyle=[...]|includeScript=[...]</a> (il link con tutta quella roba messa inline è una stringa di quasi 1 KB!). Userò tutta la cosa per rendere gli hashtag nel testo meno intrusivi per il mio sito anche lì, oltre che sul dominio originale. 👋️Finisco con dati ancora più tecnici, per chi non ha una vita: con questo , ogni deve provvedere ad esporre una funzione che, tramite la Channel Messaging API, viene richiamata dalla 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/

sir_pepe, to Dom German
@sir_pepe@mastodon.social avatar

TIL: <select> hat ein IDL-Attribut "type": https://html.spec.whatwg.org/#dom-select-type

Liefert entweder "select-one" oder "select-multiple", je nachdem.

Textarea hat sowas auch, liefert immer "textarea": https://html.spec.whatwg.org/#dom-textarea-type

Zwischenhoch, to photography
olgamatna, to Dom Czech
@olgamatna@kolektiva.social avatar

Z ostatniej chwili!
Jutro, tj. w środę 10.1.2024 o godz. 17:00 w Miejskim Domu Kultury „Koszutka” w Katowicach przy ul. Grażyńskiego 47 zagości Grzegorz Chudy malarz akwarelista, badacz kultury i historii Górnego Śląska, który z inspiracji córki oddemonizował beboka, postać z górnośląskiej demonologii, dotąd służącą do dyscyplinowania nieposłusznych dzieci. Doszło do tego, że beboki w sympatycznej wersji zaczęto stawiać w różnych miejscach niczym krasnale we Wrocławiu.
Moje ulubione wcielenie tego stwora, choć go jeszcze nie widziałam, to „Jurek” w dzielnicy Bogucice wspinający się po ścianie szkoły podstawowej, w której uczył się Jerzy Kukuczka.

https://www.mdkkoszutka.pl/wydarzenia/kalendarium/2024-01-10#wydarzenie1568


philsplace, to random
@philsplace@mastodon.sdf.org avatar

As a web developer, this is the hill I will die on.

https://mastodon.sdf.org/@philsplace/111726710467707914

mjgardner,
@mjgardner@social.sdf.org avatar

@philsplace Not when you build a framework of -thrashing bars in front of yourself

vanilla, to Dom
@vanilla@social.spicyweb.dev avatar

Moar APIs in 2024!

One of the things I love most about all this new talk concerning is how much focus there is on vanilla DOM APIs. 😁

https://thathtml.blog/2023/12/moar-dom-apis/

janriemer, to ArtificialIntelligence

and Webpage (2010)

https://lmeyerov.github.io/projects/pbrowser/pubfiles/paper.pdf

"In this , we introduce new for selector matching, layout solving, and font rendering, which represent key components for a fast layout engine. Evaluation on popular sites shows speedups as high as 80x. We also formulate the layout problem with attribute grammars, enabling us to not only parallelize our algorithm but prove that it computes in O(log) time and without reflow."

hl, to Dom
@hl@social.lol avatar

Definitely the start of Winter now, wet and grey, but a good backdrop for the coloured lights of the Winter in which the children love.

Children riding cars at a lot up carousel.

cabanier, to webxr
@cabanier@arvr.social avatar

@ada Quest browser 30.1 was shipped with experimental support for 's transient-pointer.
Go to chrome://flags, enable WebXR transient-pointer support and reboot to get the feature.

Link: https://www.w3.org/TR/webxr/#dom-xrtargetraymode-transient-pointer

iana, to Dom
@iana@rubber.social avatar

I have a very strong desire to use this right now.

Zombiate, to Dom
@Zombiate@mastodon.social avatar

Tiny tiny tiny Zommm 💜 Can she defeat the boss?

:pensive_party_blob: nope

image/jpeg
image/jpeg

simevidas, (edited ) to Dom
@simevidas@mastodon.social avatar
j9t, (edited ) to webdev
@j9t@mas.to avatar

: How many characters does the longest attribute name have?

thesdev,
@thesdev@mastodon.social avatar
haraldhux, to photography German

'Dom Limburg Window'

4th and final image of my little series from the cathedral.

haraldhux, to photography German

'Dom Limburg Stair'

3rd image of my little series from the cathedral.

nurkiewicz, to javascript
@nurkiewicz@fosstodon.org avatar

One more crippled paywall implementation, this time forbes.pl. Content is hidden and turning off doesn't help. Moreover, when inspecting elements, text is not there. But if you simply look at raw returned from the server... At least they put 40 blank lines between each <p> to hide it ;-)

  • All
  • Subscribed
  • Moderated
  • Favorites
  • megavids
  • kavyap
  • DreamBathrooms
  • osvaldo12
  • magazineikmin
  • khanakhh
  • tacticalgear
  • Youngstown
  • mdbf
  • slotface
  • rosin
  • ethstaker
  • Durango
  • normalnudes
  • provamag3
  • ngwrru68w68
  • InstantRegret
  • cubers
  • modclub
  • everett
  • thenastyranch
  • cisconetworking
  • Leos
  • GTA5RPClips
  • tester
  • vwfavf
  • anitta
  • JUstTest
  • All magazines