Which is the best approach: placing AJAX calls inside or outside of a for-loop, or having the for-loop on the server

This question pertains to implementation.

I am working with an array of tags and I need to retrieve data for each one individually, without needing them to communicate with one another. My goal is to fetch the data and save it in a designated location.

Which approach yields better performance?

  • Using Ajax inside a for-loop
  • Utilizing Ajax outside the for-loop
  • Implementing the for-loop on the server side?

Answer №1

Typically, when dealing with a large amount of small data, it is more efficient to utilize a single server endpoint that can provide all the necessary information at once. This approach streamlines the process for the client side and eliminates the need to make multiple XHR requests, thus reducing overhead. For example, if you have 100 tags to retrieve, it would be cumbersome to send out individual XHR requests for each tag and manage the subsequent callbacks for all 100.

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

Looking to attach the "addEventListener" method to multiple elements that share the same class?

I'm trying to use an event listener in JS to handle the logic in the "onClick" function, but it's only executing once. I've applied the same class to all four buttons, so I'm not sure why it's only working for the first one. HTML: ...

Issue: ER_PARSE_ERROR: A mistake has been found in your SQL syntax;

I am having trouble inserting values using MySQL in Node.js. I wrote the code below and installed MySQL support via npm, but I am unable to INSERT INTO the table due to this issue. Here is my code: var mysql = require('mysql'); var values=rand ...

Leaving the "OK" button untouched in the sweet alert dialog

While implementing sweet alert in my project, I encountered an issue where the button text was not changing and the cancel button was missing on some pages. On certain pages, it only displayed OK. You can see a screenshot below for reference. https://i.s ...

Vue and Moment JS facing a challenge with today's date validation

I am developing a VueJS application that includes a form component. Within this form, there is a field for selecting dates. My goal is to display an error message if the chosen date is older than today's date. Essentially, the selected date should ...

Storing Array Using a FOR Loop

Good day! I am currently working on saving the numbers generated by a FOR loop. The initial number and final number are entered, and the result is a range of numbers that we have selected. For example: Initial Number: 1 Final Number: 5 Result: 1 2 3 4 5 ...

Struggling to retrieve data from AJAX POST request [Revised Post]

I am encountering an issue with posting a form using the AJAX POST method in jQuery. I am using the serialize method to retrieve the form data, but it seems to fail. The problem might be related to the JavaScript files of the Steps Wizard plugin that I am ...

Is it possible to use v-if in conjunction with a style tag to specify a different source file? Alternatively, is there a more efficient method I

I attempted the example provided below, but unfortunately, it did not function as expected. The reason behind my endeavor is that adding numerous modifiers (--tuned) to achieve the desired outcome seemed impractical. Therefore, I decided to try and link ...

Encountering an issue with React Router v6 where calling `history.push('/')` results in an error of "undefined (reading 'pathname')" - the URL changes, but the page remains unchanged

Having an issue altering the page within a Redux Thunk action creator to redirect the user back to the homepage after form submission Although the URL changes when the action creator is triggered, the page itself remains the same Unable to utilize Browse ...

Eliminate any line breaks from the information retrieved from the node event process.stdin.on("data") function

I've been struggling to find a solution to this issue. No matter what approach I take, I can't seem to remove the new line character at the end of my string. Take a look at my code below. I attempted using str.replace() in an effort to eliminate ...

Why doesn't Select2 function properly in Bootstrap 3 when the tabindex is removed?

There is a bug with Select2 that causes it to malfunction in a Bootstrap 3 modal unless the tabindex element is removed. I have successfully resolved this issue in several modals on my page, but one specific modal still cannot get Select2 to function. Eac ...

Is it necessary to include both `import 'rxjs/Rx'` and `import { Observable } from '@rxjs/Observable'` in my code?

import { Injectable } from '@angular/core'; import { Headers, Http, Response } from '@angular/http'; import { Observable } from '@rxjs/Observable'; import 'rxjs/Rx'; import 'rxjs/add/observable/throw'; @Com ...

Using node modules within an HTML document

I'm finding it challenging to understand how npm handles dependencies when it comes to referencing them in HTML. For example, if I have a specific version of a plugin installed that includes the version number in its path or file name, and npm is set ...

Utilize two separate Ajax calls to populate individual jQuery tabs with specified content

After inquiring about a related issue previously, I believe it's best to create a new question as this one is not entirely connected. I am attempting to generate Json output from two distinct files (spanish.php & italian.php). While I have successful ...

Having trouble with Javascript's JSON.stringify or PHP's json_decode?

I am attempting to send an array from JavaScript to PHP. JavaScript: var json = JSON.stringify(extraFields); url += "&json="+json; PHP: $json = json_decode($_GET['json'], true); foreach($json as $K=>$V){ echo "json".$K . "=" . $V ...

Leverage Async/Await in React.js with the Axios Library

Recently, I came across an interesting article on Medium titled How to use async/await with axios in react The article discussed making a simple GET request to a server using Async/Await in a React.js App. The server returned a JSON object at /data with t ...

Is the create attachment function of the Microsoft Graph API not functioning properly?

I've been trying to create an attachment for my messages by following the documentation provided, but unfortunately, the API seems to be giving me some trouble. I referred to the document at for guidance. Below is the JavaScript code that I have bee ...

Problems with Ajax functionality in CodePen

Currently working on the Wikipedia Viewer project for freeCodeCamp. I'm encountering an issue with the ajax function as nothing is being logged in the console upon click. The code snippet in question is provided below. Appreciate any help or insight o ...

Following the ajax call, the date picker functions as expected, but there seems to be an

Here is the code for the Ajax call in index.php $(document).ready(function() { $(document).on("click", ".result p", function(e) { $(this).parent(".result").empty(); var $txt = $(this).text(); docume ...

Having trouble with npm global installation? Encountering the error message "Error: EACCES: permission denied

As the administrator of my MacBook, I am facing an issue while trying to run a npm command in my Django project. It is refusing to run due to missing permissions. (venv) jonas@Air-von-Jonas salaryx % npm install -g sass npm ERR! code EACCES npm ERR! syscal ...

Node.js promise not returning expected value

In this scenario, I have created the loginUser model to verify if the user exists or not. The code is functioning properly, however, I am encountering an issue with the isValidPassword function. It always returns a false condition, even when the email and ...