Build Reactive Websites with RxJS

Reducing

Now that the array of words is being flattened into separate events, we need some way of handling each of these smaller, “inner” events. Effectively, two different streams of data are going on. One is the same stream from before: every keystroke triggers an event containing the current content of the textbox. The new stream is smaller (and finite), containing an event for every word in the textbox. Mixing these two would be problematic—the view rendering function wouldn’t know whether a new word is a continuation of the inner stream, or represents the beginning of a new event from the original stream. There’s no way to know when to clear the page without adding obtuse hacks to your code.

Instead of intermingling two different streams, ...