For some reason, async communication between a web app backend and the browser causes more anxiety than it should (guilty 🙋). I’ve had my fair share of headaches with WebSocket frameworks before, but for poketto.me, I tried a much simpler stack—and was pleasantly surprised:
➡️http backend: Flask (
https://flask.palletsprojects.com/en/stable/)
➡️websocket backend: Flask-Socketio (
https://flask-socketio.readthedocs.io/en/latest/)
➡️websocket frontend: socketio-client (
https://www.npmjs.com/package/socket.io-client)
🔌 Backend: Handling connections is dead simple
@socketio.on('connect')
def handle_connect():
_, user_id = authenticate()
sid = request.sid
connected_clients[user_id] = sid
📤 Sending data to a connected client
sid = connected_clients.get(user_id)\
if sid:
socketio.emit('message', {
'message_type': 'save_changed',
'data': {
'id': save_id,
'state': 'archived'
}
}, to=sid)
#### **🖥️ Frontend: Receiving messages is just as easy**
const socket = io(environment.WS_BASE_URL, {
socket.on(‘message’, (message) => { this.message$.next(message) });
✅Super simple\
✅Works out of the box with Angular + Python
⚠️ **One caveat**: My implementation stores WebSocket sessions in memory. That means: If the backend restarts, the connected_clients dictionary is wiped. If you\'re running multiple backend instances, clients may hit different ones. So, I only use WebSockets for "nice-to-haves," like preview updates once a Save finishes processing. If it fails? No big deal---users still see something and get fresh data on the next refresh.