Differences and proper use of front-end javascript pubsub patterns and custom events

Question: Question:

I don't understand the difference between pubsub pattern and custom event in front end javascript.

I have the following personal perceptions.

  • pubsub pattern: DOM independent
  • Custom event: DOM dependent, javascript event specific processing
  • In both cases, the role of "registering and executing the process triggered by the trigger" does not change.

Is this recognition correct in the first place?
If not, what is the difference between the two?

Please teach me.

Answer: Answer:

As a Javascript-independent term, "events" send and receive messages at about the same time, and generally you can't receive them unless you listen to them at the time of sending, but in the "pubsub pattern" this is not the case. The difference is that you may want to store the sent messages and receive them all at once.

Custom events are a feature of the DOM, but the pubsub pattern is, as the name implies, a type of pattern that cannot be simply contrasted. You can think of custom events as one of the implementations of the pubsub pattern.

On top of that, if I dare to mention two features,

  • If you want to use features such as Bubbling / Capturing that propagate events hierarchically, DOM custom events are suitable. This is a feature not found in the pubsub pattern itself.

  • If you also want to receive the history of messages notified before Listen / Subscribe, you'll have to implement your own pubsub pattern instead of a custom event.

Scroll to Top