Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Dona Hertel
9,459 PointsIn javascript, is it possible for asynchronous functions to run simultaneously?
I get the impression that asynchronous functions can start running at any time. So, is it safe for two asynchronous callbacks to be changing the DOM at the same time? Or is that possible?
2 Answers
Dave McFarland
Treehouse TeacherHi Dona Hertel
JavaScript can't actually do 2 things at once. Sometimes it may feel like it does because browsers are so fast at processing JavaScript.
If you have 2 asynchronous callbacks, one will run before the other -- however, because they're asynch you won't know which runs first. On other words, you won't run into the situation where the two callbacks are simultaneously trying to change the DOM, but it could be possible for one callback to change the DOM in such a way that the second callback doesn't work. For example one callback removes a DIV from the DOM and the second callback tries to add content to the (now removed) DIV.
Dona Hertel
9,459 PointsOkay. I was concern about a project I'm doing on my own that gets data from two different database tables (ie. does two different AJAX calls) and uses jQuery to append the data from both sources to one table (in any order). I just wanted to make sure it would work in the rare case that both callbacks appended at the same time. But I guess I don't have to worry about.
Geoffrey Neal
30,301 PointsGeoffrey Neal
30,301 PointsSo if these callbacks have to wait for one another to finish before executing, would it be accurate to say that if you were trying to get lots of data from several different places but all requests were going through the same async function, it would create sort of a bottleneck and increase the time taken to actually receive that data?
I ask because I am considering whether to write a single function that handles all requests or different functions for GET, POST, PUT etc. I want to make sure its clean, and because these functions would have a lot of the same code it doesn't seem DRY. I know the end goal isn't to use as little code as possible but to make it as readable and efficient as possible, and I feel that different functions for each type of request would probably be easier to read.
Also even if I do this, it will eventually still boil down to using the same method (eg: fetch()) to actually make the request. So no matter how I filter and set up each request they still end up in the same place at the same time.
To give a little more context, I am trying to write a bunch of data services for an inventory system that I can call a method on anywhere in the app to receive specific data. For example Stock.getCars() and ActiveJobs.getCars() to get all cars in stock and all cars currently being rented out can be called in a React component inside the componentDidMount method, and then passed down to other components as props.
I guess what I'm asking is what is the most efficient way to collect a large amount of data, keeping things readable and without slowing everything down? Am I going about this the wrong way entirely? Would Redux be better?
Sorry this is so long! Thanks for any advice.