Mikä on julkaise/tilaa-kuvio tilalle, ja mitkä ovat sen kompromissit?

Question

Accepted Answer

**Julkaise/tilaa (pub/sub)** on viestintäkuvio, jossa **julkaisijat** lähettävät tapahtumia ja **tilaajat** reagoivat niihin ilman, että ne tietävät toisistaan suoraan. Monet tilakirjastot (ja tapahtumajärjestelmät) perustuvat siihen — kauppa *julkaisee* muutokset ja komponentit *tilaavat* ne.

## Minimaalinen pub/sub-kauppa

```js
function createStore(initial) {
  let state = initial;
  const subscribers = new Set();

return {
    getState: () => state,
    setState(next) {
      state = { ...state, ...next };
      subscribers.forEach((fn) => fn(state)); // PUBLISH: notify all subscribers
    },
    subscribe(fn) {
      subscribers.add(fn);                     // SUBSCRIBE
      return () => subscribers.delete(fn);      // return an unsubscribe function
    },
  };
}
```

Komponentit kutsuvat `subscribe(callback)`-funktiota saadakseen ilmoituksen; kauppa kutsuu jokaista tilaajaa kun tila muuttuu (`setState`). Näin Redux:in `store.subscribe`, Zustand ja event emitterit toimivat sisäkkäin.

## Irtikytkennän hyöty

```text
Publisher (the store) doesn't know WHO is listening.
Subscribers don't know WHO published.
→ They're decoupled, communicating only through the event/store.
```

Tämä löyhä kytkentä antaa sovelluksen toisiinsa liittymättömille osille reagoida samaan muutoksiin ilman suoria viitteitä toisiinsa — joustavaa ja laajennettavaa.

## Kompromissit

```text
✓ Pros: decoupled, flexible, many-to-many communication, easy to add listeners
✗ Cons:
  - Implicit flow — hard to trace WHO reacts to an event (vs explicit calls)
  - Memory leaks — forgetting to UNSUBSCRIBE keeps dead listeners alive
  - Debugging — indirection makes "why did this run?" harder to answer
  - Ordering — subscriber execution order can be non-obvious
```

Suurin käytännöllinen vaara on **unohtaa poistua tilauksesta** (esim. komponentin poistamishetkellä), mikä vuotaa muistia ja voi aiheuttaa callback-funktioita kuolleiden komponenttien osalta.

```jsx
useEffect(() => {
  const unsub = store.subscribe(handleChange);
  return unsub; // ✅ cleanup — unsubscribe on unmount
}, []);
```

## Miksi sillä on merkitystä

Pub/sub on **taustalla oleva mekanismi** useimmissa tilakirjastoissa ja tapahtumajärjestelmissä — sen ymmärtäminen selventää, kuinka kaupat ilmoittavat komponenteille ja kuinka `subscribe`/`unsubscribe` toimivat.

Se selittää sekä voimakkuuden (iritetty, joustava viestintä) että sudenkuopat (implisiittinen tiedon kulku, jota on vaikea jäljittää, ja muistivuodot puhdistamattomista tilauksista).

Pub/sub:in tunnistaminen auttaa sinua ymmärtämään reaktiivisuutta sisäkkäin ja vahvistaa, kuinka tärkeää on aina puhdistaa tilaukset.