Andrea Giammarchi

I’ve fixed a few hiccups here and there, mostly related to the ability to style [is=“ce-name”] even if created at runtime + ability to automatically create regular custom elements that extend HTML.Element.

The /auto variant on CDN lazy load for Safari in less than blink too 🥳

GitHub - WebReflection/elements: HTML & SVG Custom Elements. HTML & SVG Custom Elements. Contribute to WebReflection/elements development by creating an account on GitHub.

today I’ve quickly glued together two libraries that makes custom elements without shadow dom as fast and as simple as it can get and for every browsers … after reading the N post about ShadowDOM issues with CSS.

You can stop that madness already 👋

github.com/WebReflectio...

GitHub - WebReflection/cached-proxy: A cached Proxy with optional timeouts per property to simplify complex remote scenarios. A cached Proxy with optional timeouts per property to simplify complex remote scenarios. - WebReflection/cached-proxy

JS Proxy are wonderful, penalized by TS inability to actually understand/deal with these but the things that these unlock are incredible!

It might be a niche use case but if you need cached results, here my next go-to library:
github.com/WebReflectio...

live demo on codepen:
codepen.io/WebReflectio...

try to compare its code with the original one 😉

GitHub - WebReflection/gen-q: An efficient queue implementation for JavaScript. An efficient queue implementation for JavaScript. Contribute to WebReflection/gen-q development by creating an account on GitHub.

this might be handy for any "forever waiting" pattern that requires instant reactivity + it doesn't leak compared to the original post that inspired it 😇

github.com/WebReflectio...

GitHub - WebReflection/basic-toml: A simple TOML subset parser. A simple TOML subset parser. Contribute to WebReflection/basic-toml development by creating an account on GitHub.

a common complain about our minimalistic TOML parser is that it wouldn't support trailing commas ... well, v0.4.0 does now, keeping it ~540bytes after brotli 🥳

github.com/WebReflectio...

> I would probably only replace partial parts of the document and not a nav with a search input in it.

agreed, but that's *not* how specs work ... these need to address all edge cases too or ... good luck

this is *very* close to a SSR hydration concept and while I welcome this feature as I think it's awesome for HN or X like streams (or chats or list-items, or ...) I wonder what happens if the page had an input in that <nav>, somebody started typing in it (a11y tools too) and that gets replaced ... 🤔

GitHub - WebReflection/packatoon: Pack JSON collections as TOON like format Pack JSON collections as TOON like format. Contribute to WebReflection/packatoon development by creating an account on GitHub.

"Let's Call The Whole Thing Off" 🎶🎵

github.com/WebReflectio...

Reflect.set(...args, receiver) throwing for no reason I swear I read binding before and because that’s a delicate topic I’d like to explain to future readers how not to bind methods because: obj.method === obj.method should always be true obj.method in...

if you use Proxies and you bind methods returned on `get` trap, please read carefully why that's a bad idea and how to avoid doing that:

es.discourse.group/t/reflect-se...

JSON vs TOON — A new era of structured input? Why structure matters more than ever

so ... TOON is basically JSONH but 14 years later? ... cool 🙄

medium.com/medialesson/...

github.com/WebReflectio...

Sickos - Wikipedia

VPN providers being like ...

en.wikipedia.org/wiki/Sickos#...

I guess the idea that a customer might be away from home isn't intuitive to A FUCKING AIRLINE

A list of locations in German

Great, so www.britishairways.com

🎉 Displays in geo language rather than user language
🎉 The language picker is at the bottom of a long page
🎉 The language picker is in the current language, so in order to select "United Kingdom", I need to know what that is in German

honestly, as much as I hate User Agent sniffing, whenever I travel and find unreadable websites because they decided the lang should be the one I've just travelled to upsets me every. single. time
on top of that, mapping IP to languages is a waste of money for most cases, it requires a db + it fails

GitHub - WebReflection/weaky: An easy way to avoid leaks. An easy way to avoid leaks. Contribute to WebReflection/weaky development by creating an account on GitHub.

cleaning up signals effects automatically on vanilla DOM cases might be tricky ... the fact an inner node contains references to its parent makes it hard to do so via FinalizationRegistry but thanks to Proxy/WeakRef it's possible to make it easy: weaky 🥳

github.com/WebReflectio...

Re-thinking uhtml v5 · WebReflection uhtml · Discussion #160 So, I've clearly made a mistake in current v5 implementation: I've introduced a hybrid model where both render and reactivity via signals was backed in at the same time if signals are meant to defi...

brainstorming uhtml v5 and if you have hints/ideas/comments you are more than welcome to chime in 🙏

github.com/WebReflectio...

YouTube video by Andrea Giammarchi Introducing Regurlator Web Extension

a quick introduction to regurlator 😇

www.youtube.com/watch?v=BJKm...

regurlator - Chrome Web Store A RegExp URL Redirector

regurlator is out 🥳

chromewebstore.google.com/detail/regur...

GitHub - WebReflection/regurlator: A RegExp URL Redirector. A RegExp URL Redirector. Contribute to WebReflection/regurlator development by creating an account on GitHub.

tired of looking for "Open in Browser" links ???

I did create WebJeans and Woom (local only) but the pattern is always the same so I've put an end to this pointless struggle and published regurlator extension: you are in charge, you can redirect anything!
github.com/WebReflectio...

this bug is the reason I am trying to provide a basic utility that would take care of everything out of the box as the dance to persist users' choice on local FileSystem access is nearly unbearable and convoluted in branches and operations to do ... 🥲

issues.chromium.org/issues/45453...

UserActivation: isActive property - Web APIs | MDN The read-only isActive property of the UserActivation interface indicates whether the current window has transient user activation.

watch out developer.mozilla.org/en-US/docs/W... returns true while live-debugging because typing in devtools automatically activate transient mode.

This might be a huge source of confusion and WYSI-NOT-WYG 👋

... aaaaand it's gone!
Chromium Version 141.0.7390.108 (Official Build) (64-bit) works like a charm (and so does Edge)

Chromium Version 141.0.7390.123 (Official Build) (64-bit) wants permissions granted via a resilient user action to reuse a handler it had permissions already 🤦

TIL: if you store in IndexedDB a granted FileSystemX handler you should als store with it options because if you close and reopen the browser, or create a new session, that handler will not work unless you check again against its permissions.
Only then it prompts: once or always?

YouTube video by Davie504 I'm Suing

Davie504 is suing Suno AI and for very valid and good reasons: www.youtube.com/watch?v=RNHx...

NavigateEvent: intercept() method - Web APIs | MDN The intercept() method of the NavigateEvent interface intercepts this navigation, turning it into a same-document navigation to the destination URL.

TIL: event.intercept(...) after navigation.addEventListener('navigate', ...) 🤯

developer.mozilla.org/en-US/docs/W...

YouTube video by ThePrimeTime Apple Introduces The Year Of The Linux Desktop!

best honest video I've seen around Linux as developer:
www.youtube.com/watch?v=GQJZ...

For reference: bsky.app/profile/webr...

Reads better than leaky symbols around to me

Readability is good to me (see the follow up with just static block, no need to delete) and security superior for real private fields no library can lurk around.

I’m sold, you do what’s best for you

it leaks the symbol at the prototype level so … no? If you can host a symbol you can host a variable that won’t leak outside the module and it’s as fast as any shared accessor, if not faster