WhatsApp-style UI with LiveView -- Subscribe To All Channels At Once?

Hello all, I’m building a LiveView Chat App and recreating the interface to be like WhatsApp’s Desktop app.

As you can see, the right side is the current chat room, but the left side is a list of every chat room the user is in and it shows updates in realtime to those rooms too.

My question is, what is the most efficient channel strategy for this?

  1. Have the user be subscribed to the channel for every single room he is in? Updates are sent to each room’s channel normally.
  2. Have the user be subscribed to the current chat room channel, and his own channel which is used to update the index view on the left (e.g. “user21_chat_index”). Then, whenever a message is created or updated, it sends the chat over the room channel and to each user’s personal channel.
  3. A different approach from the two above.

Thanks in advance to those who have created something like this before.

1 Like

I’d pick 1.

I did a Helpdesk chat application which is a little different than the concern here.
I had a lobby room and a room for each user.
The helpdesk admin joins the users room after the user turns up in the lobby.
The lobby room is used to indicate presence.

It has worked OK so far. I think the question is scale.
I’d pick whatever most closely resembles communication in the real world.

1 Like

Hey Trevor, I’d do option 2. Subscribing to as many channels as you have conversations feels wrong to me, though I don’t actually know how efficient it would or wouldn’t be.

Edit: either way I’m betting you’d probably have to be at very large scale before it’s an issue, and it’d be easy to change later.


IMHO, It should use no.2 strategy.

User should subscribe to:

  1. user own channel ( to render chat list / left side)
  2. room channel that currently opened (to render room and messages / right side )

In my previous experience I would also separate presence channel and typing channel, for it’s logic dependency, especially typing , it’s quite crowded and need minimal logic intervention.

1 Like