Is Dealing with Multiple AJAX Requests a Pain?

Currently, I am utilizing AJAX to retrieve a list of active streams from TwitchTV along with their viewers, updating every second. Sometimes the stream list can become quite long, so my plan is to divide the AJAX requests into 2 or 3 parts:

1) Obtain Number of Viewers for Current Stream (Check every 1 Second)

2) Divide Stream List in Half and Check First Half for Active Streamers (Check every 5 Seconds)

3) Check Second Half of List for Active Streamers (Check every 5 Seconds)

This approach will involve running 3 requests simultaneously, but I am concerned about potential increase in load times. Will the constant data retrieval slow down the page? Would users notice any delays? Is it more efficient to use one large AJAX request for substantial data or multiple smaller requests for smaller data portions? Is AJAX truly the best method for continuously fetching constantly changing live data?

Answer №1

When it comes to your queries, the answer may lie in the famous phrase "It varies":

  1. The AJAX calls themselves shouldn't pose a hindrance to speed. These requests are asynchronous, meaning they will only impact the user's browser once they are finished.

  2. Your app's performance could be affected by DOM manipulation upon request completion. While updating the streaming user count may not cause issues, redrawing lists of streams could be resource-intensive and lead to lag during redraws.

  3. Consider utilizing websockets instead of AJAX for real-time updates, as this allows for constant connections and server-triggered data changes without polling.

  4. What is the purpose behind dividing your list into two halves?

  5. To reduce data transfer, consider signaling the latest data received to prevent sending redundant information. For example, like how Twitter sends the ID of the most recent tweet to avoid unnecessary data transfer. Tailoring this approach to your specific needs could prove beneficial.

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

Automating Indesign with HTML5 and JavaScript through IDML files

I am currently working on automating IDML files. My goal is to display an IDML template in an HTML5 editor. Within the sample.idml file, I have a basic TextFrame containing the text "Hello World." After unzipping the file and navigating to the stories fol ...

Using a prop array as v-model in a Vue JS CheckBoxGroup implementation

Struggling to create a reusable CheckBoxGroup component with a prop array as v-model. I checked out the vuejs guide at https://v2.vuejs.org/v2/guide/forms.html#Checkbox which uses the v-model array in the data of the same component. However, this approach ...

The behavior of Mozilla in handling JQuery attr() function may result in variations in design elements such as font-family or font-size

I'm currently working on the login form. Below is my view in CodeIgnitor: <div id="login-form"> <?php echo heading('Login', 2); echo form_open('login/login_user'); echo form_input('email', set_value ...

Angular reactive form encountered an issue with an incorrect date being passed

Currently, I am utilizing the PrimeNg calendar module to select a date. Here is the code snippet: <p-calendar formControlName="valid_till" [dateFormat]="'mm/dd/yy'"></p-calendar> Upon selecting a date like 31st J ...

How can I incorporate a standalone Vuetify component into my Nuxt.js project?

Using Vuetify with nuxt.js specifically for the dashboard layout - how can I achieve this in my nuxt.config.js file? modules: [ //['nuxt-leaflet', { /* module options */}], 'bootstrap-vue/nuxt', '@nuxtjs/ax ...

What is the method for obtaining the entire object as a response following a click?

I am working on a basic JavaScript snippet: var image = [{name: "Breakfast", age: 100, author: "Alice"},{name: "Dinner", age: 10, author: "Teddy"}]; function gallery(name, content) { this.name = name; this.c ...

Error: The connection with mssql in nodejs has been unexpectedly terminated due to a read ECONNRESET issue

I am currently using the node-mssql module which can be found at this link Whenever I try to insert a large amount of data into an MSSQL table, the connection is lost If I attempt to insert more than 4 rows at a time, an error is thrown import * as SQL ...

Guidelines on transforming a Java Object list into JSON format and displaying it through AJAX requests

Currently, I am facing an issue where I have a Java object list retrieved from the database as an ArrayList of objects. I need to display this on a JSP page using AJAX. While I know how to display an ArrayList of Strings via AJAX in a JSP page, I'm st ...

"Mastering the art of extracting data from JavaScript-rendered popup windows: harnessing links with Scrapy

I'm currently working on using scrapy to extract content that is only displayed after clicking a javascript link. Since the links do not seem to have a consistent numbering system, I am unsure of how to: 1 - trigger a javascript link to expand a coll ...

Steps to Change the Background Color to White in a Dropdown menu

Hello everyone! I'm currently using this codepen example on my website. My query is regarding the fifth panel - is it possible to change the color of the drop-down box when clicking on it? Here's a snippet of the HTML: <link href='https: ...

AJAX retrieving data with a GET request

Looking to customize my page www.domain.com/page.php?x=1&y=2&z=3 Is there a way to assign values to the $_GET variables in an AJAX request using $.get()? $.get('page.php', {x: x, y: y, z: z}, function(){ }) How can I set the $_GET par ...

Guidelines for storing information in a database utilizing jQuery and JSON within an asp.net framework

I've been developing an application that utilizes jQuery and JSON to store data in a database. Here is the script function I have written: <script type="text/javascript"> function test() { $(document).ready(function () { var Email = document.ge ...

The maskededitextender in ajaxtoolkit is causing some issues and is not

I'm currently utilizing Visual Studio 2008 and following this tutorial: http://www.asp.net/ajax/videos/how-do-i-use-the-aspnet-ajax-maskededit-controls After running the web application, I encountered no errors, but it seems that the masking feature ...

Error messages displayed within a form_for using the remote: true attribute for asynchronous submission

I've designed a modal form that displays as follows: <%= form_for (@change_office_address_), remote: true, format: :json, html: { class: :contact_form } do |f| %> <div id="error_explanation" style='display:none;' class="b ...

Identifying with a jQuery IF statement all input fields that contain null values in order to eliminate the respective elements

My goal is to create a jQuery script that checks all input fields to see if they are empty. If an input field is empty, I want to remove the child image of the next occurring span element. Here is what I have attempted so far: if ($("input").val() == "") ...

Grab a parameter from the URL and insert it into an element before smoothly scrolling down to that

On a button, I have a URL that looks like this: www.mywebsite.com/infopage?scrollTo=section-header&#tab3 After clicking the button, it takes me to the URL above and opens up the tab labeled tab3, just as expected. However, I would like it to direct m ...

Storing data collected from a Google form into an Excel spreadsheet

I have created a form using table layout. My goal is to automatically shift the focus to the next input field once the current one reaches its maximum length. I tried implementing this functionality with jQuery, but it only seems to work with inputs and no ...

"Sticky Top Button That Stays in Place When Scrolling | Innovative CSS & jQuery

I've been inspired by the "Proceed to checkout" button on amazon.com and I want to recreate it. However, I'm facing a challenge as their website is not responsive and I can't find a way to view a device user agent in Chrome. To see what I&ap ...

Tips for retrieving the values of both a checkbox and radio button in AngularJS

Hello, I have created MY PLUNKER I have a condition in my JSON where if the minimum value of the ingredients is equal to one, it will change to a radio button. If it's greater than one, it will change to a checkbox. To display as a radio button: ng ...

Organizing into distinct categories using Angular

I'm a beginner in the world of Angular and programming, seeking guidance on how to learn. I have an HTML page with 5 tabs: "Who," "What," "Where," "When," and "Events." The code snippet below showcases my current setup. Can anyone provide assistance o ...