Which technology to push data to browser?

[IAmAndre]

Hi,

 

I'm writing the specs of a web project. I need to find a update data quickly, like a button should change when you receive a message or something like that. Basically I need a way to take actions based on changes in the database. It seems like Node and Node-based technologies are the most used technologies used for that today, but I have never used it before. I have a couple of weeks to lean it, but I wish I could use something I'm a little more familiar with. What alternatives do I have?

 

Thanks

[Mr_KoKa]

Node is just server side javascript environment. So when you think about node you think about learning javascript.

To communicate browser with server in real time you use websockets or ajax. Node can serve as a server application where client application written on browser side will be connecting.

 

If you gonna go into websockets you can use anything you want, the simplest solution will be picking environment that has already websockets libraries ready to use, Node is one example, GoLang is another, and you probably would be able to find something else like C# websocket library and what not (or even C++, tedious but doable).

 

Ajax would just run on the webserver you use to serve your website. The con of ajax is that you need to ask server for data, not other way around, when with websocket you have established connection where you can send data both ways. Don't get me wrong, with ajax you can receive and send data, but it is browser who requests data, server cannot send data to browser without browser making request first.

[madknight3]

I expect you'll be able to use whatever server side language you're already familiar with. You just need to use bi-directional communication, like web sockets or one of the other options out there.

 

To give you a more specific example, someone who is using ASP.NET may choose to go with SignalR.

[IAmAndre]

2 minutes ago, Mr_KoKa said:

Node is just server side javascript environment. So when you think about node you think about learning javascript.

To communicate browser with server in real time you use websockets or ajax. Node can serve as a server application where client application written on browser side will be connecting.

 

If you gonna go into websockets you can use anything you want, the simplest solution will be picking environment that has already websockets libraries ready to use, Node is one example, GoLang is another, and you probably would be able to find something else like C# websocket library and what not (or even C++, tedious but doable).

 

Ajax would just run on the webserver you use to serve your website. The con of ajax is that you need to ask server for data, not other way around, when with websocket you have established connection where you can send data both ways. Don't get me wrong, with ajax you can receive and send data, but it is browser who requests data, server cannot send data to browser without browser making request first.

Actually having to constantly send requests to "fake" push notifications is exactly what I want to avoid. Is there any clean way to use web sockets with client-side Javascript?

[IAmAndre]

4 minutes ago, madknight3 said:

I expect you'll be able to use whatever server side language you're already familiar with. You just need to use bi-directional communication, like web sockets or one of the other options out there.

 

To give you a more specific example, someone who is using ASP.NET may choose to go with SignalR.

I'm familiar with PHP and JavaScript. It have never worked on a website not using an Apache server.

[Mr_KoKa]

with websocket you just send and receive, it was ajax that has to make request constantly.

[madknight3]

1 minute ago, IAmAndre said:

I'm familiar with PHP and JavaScript. It have never worked on a website not using an Apache server.

Then look into a websockets library for PHP. Like Ratchet for example. I'm not a PHP developer so I can't recommend something specific.

[IAmAndre]

6 minutes ago, Mr_KoKa said:

with websocket you just send and receive, it was ajax that has to make request constantly.

 

4 minutes ago, madknight3 said:

Then look into a websockets library for PHP. Like Ratchet for example. I'm not a PHP developer so I can't recommend something specific.

Thanks. After googling it I think I will use a PHP library supporting sockets. Do you confirm that from a browser perspective it's the same as if Node was used on the server? What about browser compatibility with sockets?

[madknight3]

8 minutes ago, IAmAndre said:

What about browser compatibility with sockets?

It looks like browser compatibility for websockets is pretty good these days, however you can fall back to other options if needed.

 

This is what signalr does. It attempts to use websockets and falls back to other options, described below, if necessary.

Quote

HTML 5 transports

These transports depend on support for HTML 5. If the client browser does not support the HTML 5 standard, older transports will be used.

• WebSocket (if the both the server and browser indicate they can support Websocket). WebSocket is the only transport that establishes a true persistent, two-way connection between client and server. However, WebSocket also has the most stringent requirements; it is fully supported only in the latest versions of Microsoft Internet Explorer, Google Chrome, and Mozilla Firefox, and only has a partial implementation in other browsers such as Opera and Safari.
• Server Sent Events, also known as EventSource (if the browser supports Server Sent Events, which is basically all browsers except Internet Explorer.)

Comet transports

The following transports are based on the Comet web application model, in which a browser or other client maintains a long-held HTTP request, which the server can use to push data to the client without the client specifically requesting it.

• Forever Frame (for Internet Explorer only). Forever Frame creates a hidden IFrame which makes a request to an endpoint on the server that does not complete. The server then continually sends script to the client which is immediately executed, providing a one-way realtime connection from server to client. The connection from client to server uses a separate connection from the server to client connection, and like a standard HTML request, a new connection is created for each piece of data that needs to be sent.
• Ajax long polling. Long polling does not create a persistent connection, but instead polls the server with a request that stays open until the server responds, at which point the connection closes, and a new connection is requested immediately. This may introduce some latency while the connection resets.

For more information on what transports are supported under which configurations, see Supported Platforms.

Source of quote

[DevBlox]

The client allways makes the call for data. But how fast should the change/notification be? Seconds? Miliseconds? On that depends what method to use and how carefully you should code your backend. If it's seconds to tens of seconds you're fine with simple repetitive calls that query for changes, but this has drawbacks. If it's milliseconds, you can use a similar method mobile phones use for push notifications, though that is harder to implement, it is a much more elegant and robust solution IMO.

[Clechay]

Check out  socket.io

[Ciccioo]

check out pusher.com, depending on your needs and your budget it might be a good choice

[Nineshadow]

2 hours ago, Clechay said:

Check out  socket.io

This.

Of course, that's if you want to use Node, which I usually totally do.

[Blade of Grass]

On 2016-12-29 at 4:34 AM, DevBlox said:

The client allways makes the call for data. But how fast should the change/notification be? Seconds? Miliseconds? On that depends what method to use and how carefully you should code your backend. If it's seconds to tens of seconds you're fine with simple repetitive calls that query for changes, but this has drawbacks. If it's milliseconds, you can use a similar method mobile phones use for push notifications, though that is harder to implement, it is a much more elegant and robust solution IMO.

Maybe in the past, but with current web development technologies (specifically, since the advent of web sockets) it is no longer true. Websockets allow you to easily push data to browsers instead of having to make frequent requests on the client side for new data. 

[IAmAndre]

On 1/3/2017 at 5:23 PM, Blade of Grass said:

Maybe in the past, but with current web development technologies (specifically, since the advent of web sockets) it is no longer true. Websockets allow you to easily push data to browsers instead of having to make frequent requests on the client side for new data. 

Do you confirm that it's safe and convenient for everyone to use web sockets. Well the audience we target for this particular object does have recent laptops/desktops, and it's made of young people overall. But what about that old Colombian guy still running Windows XP?

[Niemand]

On 12/22/2016 at 5:35 PM, Mr_KoKa said:

Node is just server side javascript environment. So when you think about node you think about learning javascript.

To communicate browser with server in real time you use websockets or ajax. Node can serve as a server application where client application written on browser side will be connecting.

 

If you gonna go into websockets you can use anything you want, the simplest solution will be picking environment that has already websockets libraries ready to use, Node is one example, GoLang is another, and you probably would be able to find something else like C# websocket library and what not (or even C++, tedious but doable).

 

Ajax would just run on the webserver you use to serve your website. The con of ajax is that you need to ask server for data, not other way around, when with websocket you have established connection where you can send data both ways. Don't get me wrong, with ajax you can receive and send data, but it is browser who requests data, server cannot send data to browser without browser making request first.

What about SQL?

 

1 hour ago, IAmAndre said:

But what about that old Colombian guy still running Windows XP?

He's not Colombian, he's Peruvian.

[Blade of Grass]

3 hours ago, IAmAndre said:

Do you confirm that it's safe and convenient for everyone to use web sockets. Well the audience we target for this particular object does have recent laptops/desktops, and it's made of young people overall. But what about that old Colombian guy still running Windows XP?

Websockets is as safe and convenient as any other competing technology (polling Ajax request, etc), assuming they're using compatible browsers. The web socket standard is compatible with Firefox 6, Safari 6, Google Chrome 14, Opera 12.10 and Internet Explorer 10, so assuming they're using gone of those browsers, it should work just fine. 

Whether or not those browsers cover enough of your target market to be worth using is something that you will have to determine  

 

1 hour ago, Niemand said:

What about SQL?

Whacha mean?

[Niemand]

57 minutes ago, Blade of Grass said:

Whacha mean?

Isn't SQL used to manipulate databases?

[fizzlesticks]

4 minutes ago, Niemand said:

Isn't SQL used to manipulate databases?

Yes, but how is that going to help push data to a browser?

[Niemand]

1 minute ago, fizzlesticks said:

Yes, but how is that going to help push data to a browser?

I have no clue. I have no knowledge of this, hence my question.

[Clechay]

5 hours ago, IAmAndre said:

Do you confirm that it's safe and convenient for everyone to use web sockets. Well the audience we target for this particular object does have recent laptops/desktops, and it's made of young people overall. But what about that old Colombian guy still running Windows XP?

You make an interface that app (backend) uses identically to communicate with every client but this interface utilizes different technologies depending on what client supports. Example of such interface is socket.io which is in fact capable of using not only few different socket technologies but also xhr if client does not support sockets at all