Who gets the callback when onreadystatechange is triggered in a single-threaded JavaScript environment?

Having recently delved into the world of JavaScript, I've come across the fact that it is single-threaded. My initial assumption was that when making an asynchronous request, a separate thread would be started to monitor the server's response. However, as I've learned, this approach doesn't work in JavaScript. I'm now wondering if there is some built-in mechanism that stores all listeners and executes them based on certain conditions they've "agreed" to (onreadystatechange).

I realize that my previous thinking may be completely off base. If anyone can provide some guidance or clarification, I'd greatly appreciate it.

javascriptajax

Answer №1

Even though JavaScript execution is single-threaded, there could be multiple threads used by the underlying engine. This concept is further explained in this resource.

For instance, while an HTTP request may have its own thread within the browser, any resulting events are placed in a queue for the JS task scheduler. Once the current script finishes running, the appropriate event handler like onreadystatechange will be invoked.

Answer №2

Each browser has its own way of handling the XHR object - for example, IE uses ActiveX while FF uses XMLHttpRequest. Although there are attempts in HTML5 to standardize this with the introduction of the XHR2 object, widespread support is still lacking. This means that implementation varies across browsers, some using threads and others different methods. While JavaScript is generally single-threaded, asynchronous programming is still possible without manual thread creation.

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

Are you a fan of Ajax calls using JSON or HTML?

Which method is most recommended for implementing AJAX? If you were developing a search page using PHP and Jquery for the AJAX calls, how would you manage the response? a) Would you prefer to have the response include all relevant HTML and styling? or ...

jqueryhtmlajaxjson

Enable lightbox functionality prior to all images being fully loaded

I have a large number of images (thumbnails) on my website and I am using the Featherlite lightbox plugin. However, when I click on one of the loaded images while they are still loading, the lightbox does not work as expected. Instead of opening in a modal ...

javascriptjqueryhtml

There is no index signature that accepts a parameter of type 'string' in the type '{ [key: string]: AbstractControl; }'

I'm currently tackling a challenge in my Angular project where I am creating a custom validator for a reactive form. However, I've encountered an error within the custom validators function that I am constructing. Below you will find the relevan ...

javascriptangulartypescriptangular-reactive-formscustomvalidator

Successful AJAX value transfer with no corresponding output

I have implemented a functionality where a user types in a textarea, presses tab, and then an Ajax call retrieves data to populate a select box based on the input from the textarea. <body> <textarea id='test' name="test"></te ...

phpjquerymysqlajax

Using the inline calendar feature of Bootstrap 3 Datepicker to easily select and capture dates

I've been struggling to extract the selected date from my bootstrap 3 datepicker, and despite attempting to follow the documentation, I still can't grasp it. Here's what I tried: <div id="datetimepicker"> <i ...

javascriptjquerytwitter-bootstrapdatepicker

Toggle class on child element when parent is clicked

I am currently working on a functional React component that looks like this: const RefreshButton = () => ( <IconButton> <RefreshIcon /> </IconButton> ) My goal is to dynamically assign a class attribute ...

javascriptreactjs

Issue with AngularJS causing HTML input field to limit the display to only three digits

Whenever I input a number with 4 digits or more (excluding decimals) into the designated box, it mysteriously disappears once I click away (blur). Could it be due to the currency filter causing this issue? Even though the model retains the value when logg ...

javascripthtmlangularjsinputfilter

"JavaScript: Issue Encountered While Converting Hexadecimal to Decimal

I've been working on a custom function to convert hexadecimal to decimal in my Scratch project: function Hex2Decimal(hex){ var deci = 0; var num = 1; var hexstr = String(hex); hexstr = hexstr.toLowerCase(); var expon = 0; for( ...

javascripthexdecimal

If the PHP variable evaluates to true, then a CJuiDialog in Yii view will open

I am attempting to open the CJuiDialog if the $check value equals true in the view part. <?php if($check==true) { js:function(){$('#dialogDisplay').dialog('open');} } $this->beginWidget('zii.widgets.jui.CJuiDialog', ...

javascriptphpjqueryformsyii

Will the bootstrap carousel continue running in the background even if I hide it?

Currently, I have incorporated the twitter bootstrap carousel into my website with the following code: <div id="slider" class="carousel slide"> <!-- Wrapper for slides --> <div class="caro ...

javascriptjqueryhtmlcsstwitter-bootstrap

What steps should I follow to obtain code coverage data in my Aurelia application with the help of karma?

After creating my Aurelia app using the Aurelia CLI (au new), I wanted to set up code coverage, preferably with karma-coverage, but was open to other options as well. First, I ran npm install karma-coverage --save-dev and then copied the test.js task over ...

javascriptcode-coveragekarma-coverageaurelia

Shrink Font-Awesome icon sizes using a Node.js and Express.js web application

Currently, I am in the process of developing a website using node.js + express.js and implementing font-awesome for icons. The local hosting of Font-awesome has resulted in a 1.2 MB JS file [font-awesome.js], even though we are only utilizing 10-15 icons. ...

javascriptcssnode.jsexpressfont-awesome

What sets srcset apart from media queries?

Can you explain the contrast between srcset and media query? In your opinion, which is more optimal and what scenarios are ideal for each? Appreciate it! ...

javascripthtmlcssmedia-queriessrcset

How to showcase an image with Angular 2?

Just starting out with Angular 2 and ran into an issue while trying to display an image using a relative path. <img src="./../images/publicVideo1.PNG"> Unfortunately, I encountered the following error: null:1 GET http://localhost:4200/null 404 (No ...

javascriptangularangular2-template

Dynamic loading and endless scrolling in jQuery with advanced filtering functionality

I have a page full of items that I filter by class names. This works great, but when I added lazy loading using ajax, it started causing some issues. Currently, I load the next page of items without applying the filter to the ajax call, and then hide the ...

jqueryajaxlazy-loading

What is the process for viewing the collections of all databases while logged in as an administrator?

My aim is to display all databases along with their collections, similar to logging in as an admin user into robo3T, for example. Using the two commands below poses no issue. However, when I use the listCollections command, I only get the collections from ...

javascriptnode.jsmongodb

Utilizing WordPress Variables Beyond the Loop

Following the update of my loop to gather all necessary data using this code: <?php $json = ""; if ( have_posts() ) { while ( have_posts() ) { the_post(); global $wpdb; $query = "SELECT * FROM ". $wpdb-&g ...

javascriptphpwordpress

Rendering the HTML5 canvas within a console environment

I am looking to create images of humans on the console using nodejs. In order to achieve images of higher quality, I require a library or module that can facilitate drawing images in the console. Some options available include imaging and console-png. How ...

javascriptnode.jshtmlcanvas

Adjust image source based on media query (CSS or JavaScript)

Is there a way to update the image src based on a media query with a maximum width of 515px? I'm considering using JavaScript, jQuery, or even AngularJS if there is an event equivalent to a CSS media query that can achieve this. I want to have differ ...

javascriptjqueryhtmlcssimage

Developing a user authentication system with TowerJS

As a front-end designer/developer with limited MVC experience, I am looking to create a login form using TowerJS. Following the documentation, my app includes a model named "User": class App.User extends Tower.Model @field "email", type: "String" @fie ...

javascriptnode.jsjavascript-frameworktowerjs