Software Design Patterns — Pt2

In the last article we discussed one of the many Behavioral Software Design Patterns.

Lets look at “Observer Design Pattern”

To put it in the simplest possible way

“The Observer pattern is like a group chat where one person sends a message, and everyone else in the chat gets notified. When something changes, like the location of a party or the time of a meeting, everyone in the chat knows about it and can adjust their plans accordingly. It’s a great way to keep everyone on the same page without having to constantly check in.”

Thats too easy.

This is as simple as the explanation of an Observer Design Pattern can get. (IMO)

Lets look at the formal definition of Observer Design Pattern.

The Observer Pattern defines a one-to-many relationship between objects. When the state of one object changes, all of its dependents are notified. Observers are loosely coupled in that the Observable knows nothing about them, other than they implement the Observer Interface.

This means we are moving from a Poll Strategy to a Push Strategy.
To put in simpler terms we dont constantly ask the source about state-change but depend on the source to send the updated-state whenever it happens.

Let me explain the Push vs Poll Strategy
Imagine you have a favorite pizza place that offers delivery service. In the past, when you wanted to check the status of your pizza order, you would have to call the pizza place and ask them for an update. This would be the equivalent of a poll strategy, where you actively reach out to the source (the pizza place) to ask for information.

Now, let’s say the pizza place decides to implement a push strategy. Instead of having you constantly call and ask for updates, they provide you with a real-time tracking system. When you place an order, they send you a link or a notification that allows you to track the status of your order in real-time. This means that you don’t have to actively inquire about the state of your pizza; the pizza place will automatically send you updates whenever there is a change in the order’s status.

In this scenario, the pizza place is the source, and they are using a push strategy to keep you informed about the state of your pizza order. They no longer rely on you to ask for updates but instead proactively send you the updated state whenever there is a change (e.g., order confirmed, out for delivery, delivered).

By adopting a push strategy, the pizza place improves the overall customer experience. You no longer have to make multiple phone calls or wait in uncertainty; you receive timely updates without any effort on your part. Similarly, in software systems, moving from a poll strategy to a push strategy can lead to more efficient and real-time communication between different components or services.

Lets take another day-to-day example with a bit of tech involved ,
Assume you have been following a Netflix Show, and the new season just released. and the episodes roll out every monday.
If you would have noticed, all new releases and episode launches automatically come to your Continue Watching Screen.

This is Netflix’s take on Observer Pattern

Now lets imagine a time where this design pattern was not invented or not put to use.

Imagine if Netflix did not notify you (the user) of any new content, but instead only allowed you to see the content that was available at the time you logged in. In this scenario, Netflix would not be using the Observer design pattern.

This would mean that you would have to manually search for new content each time you logged in to Netflix, without any indication of whether or not new content had been added since your last visit. This could result in frustration or boredom for users who are looking for new and interesting content to watch.

This design pattern is highly used in Software Systems involving UI , Content, Events , Notification Systems .etc.

In order to connect the above scenario with the formal definition
Observable: Netflix’s Content Management Systems
Observer : Client side devices.

Lets give this design pattern life with a simple JS implementation

class Netflix {
  constructor() {
    this.subscribers = [];
    this.newContent = [];
  }

  // Method to subscribe to Netflix
  subscribe(subscriber) {
    this.subscribers.push(subscriber);
  }

  // Method to unsubscribe from Netflix
  unsubscribe(subscriber) {
    this.subscribers = this.subscribers.filter(
      (existingSubscriber) => existingSubscriber !== subscriber
    );
  }

  // Method to notify subscribers of new content
  notifySubscribers() {
    this.subscribers.forEach((subscriber) => {
      subscriber.update(this.newContent);
    });
  }

  // Method to add new content
  addContent(content) {
    this.newContent.push(content);
    this.notifySubscribers();
  }
}

// Observer: User
class User {
  constructor(name) {
    this.name = name;
  }

  // Method to update the user with new content
  update(newContent) {
    console.log(`${this.name}, new content available:`, newContent);
  }
}

// Creating Netflix object
const netflix = new Netflix();

// Creating User objects
const user1 = new User("Alice");
const user2 = new User("Bob");
const user3 = new User("Charlie");

// Subscribing users to Netflix
netflix.subscribe(user1);
netflix.subscribe(user2);
netflix.subscribe(user3);

// Adding new content to Netflix
netflix.addContent("Movie: Action-packed Adventure");
netflix.addContent("TV Show: Romantic Comedy Series");

// Unsubscribing user2 from Netflix
netflix.unsubscribe(user2);

// Adding more new content to Netflix
netflix.addContent("Movie: Thrilling Mystery");

In this example, we have a Netflix object acting as the Subject, and User objects acting as Observers. The Netflix object maintains a list of subscribers (Users) and notifies them when new content is added using the update() method. The users are subscribed to Netflix using the subscribe() method and can unsubscribe using the unsubscribe() method. When new content is added to Netflix using the addContent() method, it triggers the notification process, and the users receive the new content updates.

I hope this helped you understand Observer Design Pattern a bit better.
Ciao! I will go binge some shows , in the meanwhile . read more about where Observer Pattern is used in Real World Software Systems and you will be baffled.