I just noticed, that Invoker Commands are available across all major browsers. Good to see that HTML progresses to make Javascript redundant for basic UX.
I've always browsed with javascript disabled but in the last few months (presumably in response to AI scraping) loads of sites that previously worked now don't. IMDB. Loads of open-source blogs, wikis and source repositories. Commenting on Wikipedia. Browsing job sites.
It's never been easier to create a great site that doesn't require javascript, but hardly anyone is.
JS is not needed for some defined build-in commands [0]. Custom commands will emit an Event only which probably should end up in some JS function most of the time.
This is remarkably useful. Even ignoring the built-in commands (which are handy in their own right), I find the button's action being self-described in the html ("tell this element to do this") far more pleasant to read than the normal see button -> /document.getElementById("buttonID") -> scroll back up to the html to figure out what elements are referred to in the script.
I’ve been adding global listeners for click and keydown that call handleFoo(event) if event.target has a data-foo attribute.
The Invoker API seems like a neater way of handling the same pattern but I’m biased towards global event listeners because they work automatically on newly injected markup and they scale O(functionality) as opposed to per element listeners that scale O(elements). I’ll be the first to admit that the latter is more of an aesthetic choice rather than being based on any kind of performance statistics.
10 comments
[ 224 ms ] story [ 910 ms ] threadIt's never been easier to create a great site that doesn't require javascript, but hardly anyone is.
It's not supported on the previous main version of Safari, so everyone following the "last two major versions" of browser support rule can't use them.
Also, it's currently limited to only dialogs and popovers (and custom events, but in those cases you need js anyway).
It'll be more useful once it can control:
- details (open, close, toggle)
- video (play, pause, toggle play state, set seek point, mute, set volume)
- select (open/close widget, set/unset value(s))
- input (open/close widget, set/unset value(s))
- all elements (add/remove/toggle/set a class/attribute)
[0] https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/...
Looks like safari shipped support in December though so now I can go nuts
We’ve already had it as `label for=“form-element-id”`
The Invoker API seems like a neater way of handling the same pattern but I’m biased towards global event listeners because they work automatically on newly injected markup and they scale O(functionality) as opposed to per element listeners that scale O(elements). I’ll be the first to admit that the latter is more of an aesthetic choice rather than being based on any kind of performance statistics.