Comparing SSE and Ajax Polling for querying in the browser without using JavaScript code

I have been learning about Server Side Events and one key distinction that stands out to me is the way SSE handles server queries compared to Ajax Polling. With Ajax Polling, users are responsible for querying the server after each response, whereas with SSE, the browser takes care of this automatically. Is this understanding accurate?

Furthermore, in terms of server processing, there seems to be minimal difference between SSE and Ajax Polling. The only distinguishing factor is the need to format the response in a specific way and include the Content-type: text/event-stream header when using SSE. Is that right?

Answer №1

Just like Seabizkit mentioned before, one approach involves continuously polling the server while the other method waits for the server to send updates.

For example, if there was only one data update per day, consider the difference between all clients checking every minute versus the server sending a single message to all subscribed clients.

Your question raises a point about the distinction between SSE and Ajax Polling. In Ajax Polling, you have to query the server after each response to check for changes. On the other hand, with SSE, the browser automatically handles these requests for you.

With Ajax Polling, you are actively requesting data at regular intervals to monitor any modifications, similar to refreshing a web page. In contrast, SSE sends notifications to subscribers only when a change occurs.

Polling allows you to query as frequently as desired, while events in SSE notify subscribers only when a relevant change takes place.

Think of it like waiting for a parcel delivery - you could keep calling to check the status every minute, or you could simply wait for the driver to notify you when they are on their way.

Regarding client-server communication initiation, the client sets up an event listener to receive updates from the server. Afterward, the server sends messages to the client whenever the specified event occurs, without the client needing to constantly request updates.

Keep in mind that this explanation offers a broad overview of the concepts, rather than delving into technical details, as your question seemed to focus on understanding the fundamental differences between the two approaches.

Answer №2

When it comes to browsers...

The distinction lies in this: One uses Polling, while the other reacts to an Event(*).

Polling: originates from the browser.

Send a request...get a response...take action. (often involves changing the UI)

  • Polling can be resource-intensive (depending on the task at hand!).
  • Setting up polling is much simpler compared to handling server-side changes in the browser.

Server-Side Events/Changes: initiated on the server.

How does the browser get notified?

  • By default, browsers cannot react to server-side changes. Essentially, the browser remains oblivious to any server activities.

You have to manage this on your own.

Fortunately, libraries like SignalR

Can greatly simplify this process for you. However, it does come with a higher level of complexity compared to a simple polling setup.

You need to handle socket connections between "clients".

(*) = take this with a grain of salt, not precisely worded.

If this doesn't address your query or you need more information, feel free to ask.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for including an additional label on a data point within a scatter plot using the Highcharts JavaScript framework

Incorporating the Highcharts JavaScript library, I am visualizing float values by passing them from PHP to the JS code. In the image below, you can observe that upon hovering over each point, the corresponding axes values are displayed along with the text ...

Extracting the JQuery library from its source code

Is there a simple method for extracting only the necessary functions from the jQuery library? I have found that many of the functions within the library are not being utilized, so it would be beneficial to remove them. ...

Mastering the art of grouping by a key and generating sub-objects from a plain array of key-value pairs in JavaScript ES5 without relying on third-party libraries

My dataset consists of an array of objects, each containing 4 keys: [ { "team": "USA", "team_profile_id": "10", "player": "Captain America", "player_id": "10X1" }, { "team": "USA", "team_profile_id": "10", "player": "The ...

Understanding JSON Parsing in Jade

I am facing a challenge with handling a large array of objects that I am passing through express into a Jade template. The structure of the data looks similar to this: [{ big object }, { big object }, { big object }, ...] To pass it into the Jade templat ...

Creating a customized navigation bar with a unique menu list underline feature using JavaScript

I recently created a customized navbar using a script to add a hover effect to the menu links. You can find the script I used here: https://github.com/shadeed/underliner. Although I was able to get it partially working, there are still some issues. The we ...

Issue with Firefox browser: Arrow keys do not function properly for input tags in Twitter Bootstrap drop down menu

Requirement I need to include a login form inside the dropdown menu with username and password fields. Everything is working fine, except for one issue: Issue When typing, I am unable to use the arrow keys (up/down) in Firefox. This functionality works ...

Evaluating Vue with AVA - The key is in the whitespace

Currently, I am engrossed in a Laracast Episode about Vue Testing with AVA. Everything has been going smoothly so far, but now I have encountered an intriguing bug. This is my notification.js: import test from 'ava'; import Notification from &ap ...

The issue I am facing is with the post_logout_redirect_uri not functioning properly when using localStorage in an OIDC Auth

authority: 'yyy', client_id: this.'yyy', redirect_uri: 'http://localhost:4200/login', response_type: 'token', scope: 'yyy', post_logout_redirect_uri: & ...

Deleting a button from a list item or array in Angular 12

Having some trouble removing a list item with the click button, I've tried a few options but nothing seems to be working. Can anyone offer assistance? I need to remove a list item from my users array when clicked. Below is the Typescript code and cor ...

What is the best way to divide an array into pairs and store them in separate arrays?

I'm attempting to challenge my JavaScript skills and faced with a dilemma. There is an array containing data var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];. The goal is to pair the elements and generate a new array of arrays such as var newArray = [[1 ...

Utilize Javascript to interact with specific Objects

Working with Node.js, I have written a code that produces the following output: entries: [ { data: [Object] }, { data: [Object] }, { data: [Object] }, ... { data: [Object] } ] } null The code snippet is as follows: targetingIdea ...

Watching a live video stream in real-time using WebRTC with React

Here is the HTML code <video ref={videos} autoPlay ></video> <Button onClick={() => navigator.mediaDevices.getUserMedia({audio: true, video: true}).then((mediaStream) => { videos.srcObject = mediaStream; videos.onloadedmetad ...

Checking for Internet Connectivity in Mobile HTML5

Is it possible to check for internet connectivity on a mobile device? Can websockets be utilized to ping a server and determine if the connection is available? I am feeling frustrated as I believed there was a ping function in websockets for client-side u ...

Issues with jQuery focus function in Internet Explorer 11

Is there a way to set the focus on an anchor tag using the URL? Anchor Tag: <a id='714895'>&nbsp;</a> URL: jQuery Code: try { if(document.URL.indexOf("?ShowAllComments=True#") >= 0){ var elementClicked = "#" +location.hre ...

Executing JavaScript function on AJAX update in Yii CGridView/CListView

Currently, I am integrating isotope with Yii for my CListView and CGridView pages to enhance their display. While everything functions smoothly, an issue arises when pagination is utilized, and the content on the page is updated via ajax, causing isotope ...

Unable to properly execute Fetch Delete Request

When using the Fetch API, I am sending this request: const target = e.currentTarget; fetch(target.href, { method: 'delete', }) .then(res => console.log(22)) .catch(err => console.log(err)); In addition, here is the middleware that manag ...

Is there a way to make Outlook show only the caption of a link instead of the entire URL?

In my PDF file, I have set up a button for sending an email. The email is a request that needs approval or denial. I want the recipient to respond with just 2 clicks: Click on either "Approve" or "Deny" (a new email will pop up) Click on "send" - and it& ...

What is the meaning of this CSS acronym?

div[id^=picture]:target{ /*applying various styles here*/ } I stumbled upon the snippet of code shown above on a website discussing CSS image galleries. Can anyone clarify what this code accomplishes? Appreciate it. ...

Is it possible to make asynchronous calls to an external API without causing any drag on the overall speed of the website?

Currently, I operate an online store where at the end of the page, I integrate the eBay API with items related to the main product. Unfortunately, I have noticed that this integration causes a significant delay in the overall page loading by 4 to 10 secon ...

What methods can be used to conceal a div when the content is not being shown?

I'm a beginner in HTML and CSS and I have a page with the following code: Content displayed : <div id="row-3" ><!-- Row 3 starts here --> <div class="groupz_column1" style="margin-right:0px;"><a href="http://www.xyz.in/ads/ ...