Update a Client with Real-time Data

Real-time data

Instead of using a Channel broadcast to replace content by swapping out the HTML and sending the client server-rendered HTML, our real-time message will include details about the new stock level in this lesson. The JavaScript client will use this data to change the relevant parts of the DOM to affect the view. Our message stock_change will include the product ID, item ID, and the new stock level.

Our ProductChannel will be modified to define the new broadcast function. This function will broadcast if the stock level changed, or skip the broadcast if it’s identical. This prevents unnecessary data from being sent to connected clients.

Add the stock level change function to the ProductChannel module.