AngularJs/ExpressJs: Best way to manage real time notifications - angularjs

I'm using AngularJs on frontend and ExpressJs on backend and I would like to know the best way to manage real time notification.
I hesitate between using sockets(socket.io) or querying notifications every 5 seconds
What is the cleanest way to do it ?

This is exactly what socket.io is for.
You don't want to make unnessessary HTTP requests to query a notification endpoint every 5 seconds. Imagine this on a scale of 100 users. What about 1000 users?
socket.io lets you initiate communication on the server side without having to make a request from the client. Notify the client when the client needs to be notified.

Related

Display realtime data in reactjs

I'm sending data from my backend every 10 seconds and I wanted to display that data in reactjs. I've searched on the net to use socket.io to display real-time data. Is there a better way to use it?
If you're dead set on updating your data every 10 seconds, it would make more sense to make a request from the client to the server, as HTTP requests can only be opened from client to server. By using HTTP requests, you won't need to use socket.io, but socket.io is an easy alternative if you need much faster requests.
Depending on how you are generating the data being sent from your backend, specifically if you are using a database, there is most likely a way to subscribe to changes in the database. This would actually update the data in realtime, without a 10 second delay.
If you want a more detailed answer, you'll have to provide more detail regarding your question: what data are you sending? where is it coming from or how are you generating it?
I'm working on an autodialer feature, in which an agent will get a call when I trigger the button from the frontend (using react js language), and then automatically all the leads in the agent assigned portal will get back-to-back calls from agent number. However, because this process is automatic, the agent won't know who the agent has called, so I want to establish a real-time connection so that I can show a popup on the frontend that contains information about the lead who was called.

How to handle long requests on the frontend?

My application allows a user to enter a URL of an article he/she wishes to analyze. It goes through our API gateway to reach the correct services engaged in this process. The analysis takes between 5 and 30 seconds depending on the article's word count.
For now, my reactjs client sends the request to the API and waits for 5 to 30 seconds to receive the response. Is there a better way to handle this such as enqueuing the job and let the API ping the client (reactjs frontend) once it has been done?
Server-sent Events (SSEs) allow your server to push new information to your browser, and hence look ideal to me for this purpose. They work over HTTP and there is good support for all browsers except for IE.
So the new process could look as follows:
Client send request to server, which initiates the lookup and potentially responds with the topic the browser needs to subscribe to (in case that's unique per lookup)
Server does its thing and sends updates as it processes new content. See how the beauty of this is that you could inform your client about partial updates.
If SSEs is not an option to you, you could leverage good old Websockets for bi-directional communication, but for such a simple endeavor, it might be too much technology to solve the problem.
A third alternative, especially if you are talking amongst services (no web or mobile clients on the other side) is to use web-hooks, so that the interested party would expose and listen on a specific endpoint, that the publisher (the server that does the processing) would write updates to.
Hope this is useful.

For fetching data from server for React frontend should I use websockets or api calls?

I am very new to frontend. I do not exactly know how react frontends work. Assuming I have a frontend written in React that needs to refresh data on the page say every ten seconds, can I achieve that by making api calls to a server every ten seconds or open a websocket with it and make the server push data? These are not notifications! They are just statistical data that needs to be updated on the page in realtime. Please tell me whats a good way to achieve this.
Websockets are interesting when you want data to be pushed from your server to your client, i.e. when the client doesn't know when new data will be available. In your case, it seems that simple API calls will be enough.

socket.io with apache and angularjs

I would be implementing a notification in my web app.
The technologies on which the app is built is Angularjs Apache PHP(For Api).
Our initial approach was to query the database every 10 seconds for any notification.
Is using socket.io beneficial in this scenario.?
It depends on the way you will implement it.
If you got only 1 or less new datasets in 10 seconds you will save capacity by sending a message via socket.io to the client to pull the new data.
If you got more than 1 new dataset in 10 seconds, the "pull every 10 seconds" will be better.
If you dont know how much new datasets will came up, you could the a mixed thing. Send a message to the client (via socket.io) to do the next pull. and then the client will pull timer-elapsion. if not, your timer will not pull the new data and will save network-traffic.

GWT Servlet-based Notification (Server Event Bus)

Can anyone think of a good way to allow the server to notify the client based upon server processing? For example, consider the following events:
A user requests a deletion of data, however, due to it's long-running time, we kick it off to a queue.
The client receives a "Yes we completed your transaction successfully".
The server deletes the item and now wants to update any local structures any clients may be using (I'd also like to notify the user).
I know this can be done by client-side polling. Is there a event bus type way to do this? Any suggestions are welcome, but please keep in mind I am using GWT with App Engine.
The standard AJAX interaction is that the client sends requests to the server and expects some sort of response back fairly quickly.
In order for the server to initiate a request to the client, you will need to use WebSockets, and experimental HTML5 feature currently only supported by Chrome.
Or, to simulate this kind of interaction, you can use Comet (long-polling), made available in GWT by the rocket-gwt project.
You want server events for GWT? Have a look at GwtEventService (they couldn't have chosen a better name): http://code.google.com/p/gwteventservice/wiki/StartPage
Of course, it uses a Comet implementation, but you can't do any different when using HTTP, the client always initiates the communication. Request, response.

Resources