requestIdleCallback | A requestIdleCallback shim/polyfill | Reactive Programming library

You can give the components a property telling them whether they're in overscan or not, and have shouldComponentUpdate return false if inOverscan is true for both the previous and current props (or if using function components, React.memo's comparison function would return true if inOverscan is true for both the previous and current props).

Here's an example:

The two example functions simply execute synchronously one after the other on the same "thread" (JS effectively has only one thread available to such scripts).

The use of async is irrelevant here because no truly asynchronous operation is occurring in function A - it is simply a busy while loop - so it completes in full before execution can move to anything else.

If function A had called an actual asynchronous operation (such as a HTTP request - not simply a synchronous operation wrapped in an async function), then function B may have a chance to start up (in which case B would complete entirely before the execution returned to A, because B is also only contains a synchronous, busy while loop).

Parallel processing can be achieved with WebWorkers which allowing running on background threads (actual separate threads).

I think this is really dependent on what exactly you are trying to achieve though.

For example, you could initialize your web-worker on loading the page and make it run the background-job, if need be, then communicate the progress or status of the job to the main thread of your browser. If you don't like the use of post-message for communication between the threads, consider user Comlink

1. Web worker
2. Comlink

However, if the background job you intend to do isn't something worth a web-worker. You could use the requestIdleCallback API. I think it fits perfectly with what you mentioned here since you can already make it recursive. You would not need a timer anymore and the browser can help you schedule the task in such a way that it doesn't affect the rendering of your page (by keeping everything with 60fps).

Something like =>

So I changed your markup a little bit:

Cooperative Scheduling of Background Tasks says:

During an idle period the user agent will run idle callbacks in FIFO order until either the idle period ends or there are no more idle callbacks eligible to be run. As such, the user agent will not necessarily run all currently posted idle callbacks within a single idle period. Any remaining idle tasks are eligible to run during the next idle period.

Therefore, I believe with your example, fnOne, fnTwo and fnThree would be executed in that order.

So Idea is behind setInterval and Sockets, setInterval is supported in most browsers and javascript WbsocketApi is supported in almost everybrowser.

Brief overview: setInterval() - this function behaviour is following when your computer is at sleep/suspended/hibernate mode it is paused and when you are at awaken mode it resumes itself.

The following code does the following, at first(maybe at the same time but) it starts php server_socket listening to the connections,

than javascript websocket api sends current timestamp in Unix timestamp milliseconds in every 2 seconds you can have 1 second it is up to you.

after that php server socket is getting this time and checks if it has anything like previous time to compare, when the code is first instantiated php does not has anything like previous time to compare it to the time which was sent from javascript websocket, so php does nothing but saves this time in the session called 'prev_time' and waits for another time data to be recieved from javascript socket, so here begins second cycle. when php server socket new time data from javascript WebsocketApi it checks it has anything like previous time to compare to this newly received time data, it means that php checks if session called 'prev_time' exists, as we are in the second cycle php discovers that it exists, grabs it's value and does following $diff = $new_time - $prev_time, $diff will be 2 seconds or 2000 miliseconds because remember our setInterval cycle happens in every 2 seconds and time format we are sending is in miliseconds,

than php checks if($diff<3000) if difference is less than 3000 if it is it knows that user is active, again you can manipulate this seconds as you wish, I choose 3000 because possible latency in the network which is almost impossible but you know I am always cautious when it comes to networks, so let's continue, when php determines that user is active php just resets 'prev_time' session with the value of $new_time which was newly received and just for testing purposes it sends message back to javascript socket,

but if $diff is more than 3000 it means that something paused our setInterval and there is only way it can happen and I think you already know what I am saying, so in the else logic of ( if($diff<3000) ) you can logout user by destroying specific session and if you want to redirect you can send some text to javacript socket and create a logic which will execute window.location = "/login" depending on the text, that's it here is the code:

First it is index.html file just to load javascript:

That's my solution. I don't know if it's "good" or if it breaks some rules of react or reselect, but it works. Maybe you can assess that?
The code is simplified to improve readability.

The idea is, the selector returns a Promise and I call requestAnimationFrame before computing the data to get a chance to refresh the ui.

selector.js: