I'm adding backend-sent notifications to my Vue 3 app.

My Django backend generates notifications and saves them to the user inbox; where they can be accessed and read at any time.

I'm trying to decide which way is best for the front-end to receive such notifications. Basically, I'm torn between two options:

• use polling; something like a setInterval of 20 seconds that simply makes a REST call to get the most recent notifications for the user
• open a websocket; the server pushes a message each time there's a new notification

I'm leaning a little more towards the websocket option; however, I am concerned with:

1. complexity: having to manage re-connections and all the things that can go wrong with a WS
2. performance: I am predicting peaks of 200-300 users at a time; is having that many open WS connection a possible concern?

Weighing these factors, which one would be the better choice for my needs? And how would you mitigate the drawbacks of the chosen approach?

CodePudding user response：

In my opinion, the best solution for a notification system would be to use WebScokets such as socket.io. If you use HTTP requests, the server will receive about 300 requests at a time every few tens of seconds which can be aggravating for the server. In this most of the requests may not be necessary (the user has not received any notifications). Using sockets the server will only send a notification to the client when it receives a notification. Another advantage of sockets is that the notification will come immediately, rather than every specified interval. So to summarise:

WebSockets advantages for a notification system:

• Less load on the server and more efficient operation (much better performance)
• More comprehensive notification system
• Possibility of later extension with other 'server push' data

Disadvantages:

• Longer and more difficult to implement than REST communication

CodePudding user response：

WebSocket is the best solution in your case. I used vue-native-websocket plugin.