Re: [whatwg/dom] Improving ergonomics of events with Observable (#544)

For developer ergonomics to improve, Observable has to ship with a complete operator library in my opinion. A standard `Observable` without operators would only benefit library authors and could just as well be a userland standard.

> Ironically, benjamingr , a LONG time supporter of RxJS may have killed any chance the community had at getting Observable on a platform when he added `{ signal }` to `addEventListener`. 

This might be a case of "worse is better" since it covers the large majority of use cases where no complex combination of event streams etc. is required.

This is how the drag example above looks using `AbortSignal`:

```js
div.addEventListener("mousedown", (downEvent) => {
    const divX = div.getBoundingClientRect().left
    const startX = downEvent.clientX
    const abortController = new AbortController()
    
    document.addEventListener("mousemove", (moveEvent) => {
        const x = divX + moveEvent.clientX - startX
        div.style.transform = `translate3d(${x}px, 0, 0)`
    }, {signal: abortController.signal})
    
    document.addEventListener("mouseup", () => abortController.abort(), {once: true})
})
```

Sure, the API is not as nice, but I would argue that it is easier to understand for most developers today and works in all modern browsers. The order of events is also preserved when reading the code (mousedown, mousemove, mouseup). 

There is a pitfall however: it is easy to create a memory leak by forgetting to add `{ once }` or `{ signal }` .
This might be avoidable with linting rules warning on  nested `addEventListener` calls or a helper like `abortController.abortOn(target: EventTarget, eventName: string)`.

Once observables are part of the language, developers will expect [common operators](https://rxjs.dev/api?query=operators&type=function) to be present.
I don't really see how ergonomics are improved if everyone still has to import a library for operators.

After advocating for `addEventListener` over `on*` and `querySelectorAll` over `import jQuery` for years, tutorials using event streams and `.on` + "import this operator library" as the new best way would be highly confusing for learners.

-- 
Reply to this email directly or view it on GitHub:
https://github.com/whatwg/dom/issues/544#issuecomment-1435660670
You are receiving this because you are subscribed to this thread.

Message ID: <whatwg/dom/issues/544/1435660670@github.com>