Google Chrome scroll freezing while appending ajax content on a page

Question

I have a problem with chrome scrollbar,on Mozilla there is no such a problem. I have couple of synchronous ajax requests and then some info appending on the page,they need about 2 secs to load.During this time the scrollbar freezes and is not usable,when the ajax end the scroll works fine.

Answer 1

When you use synchronous AJAX the page stops until ajax finish, so if you want the page not stop, must be asynchronous AJAX call.

You can see more here: Documentation AJAX W3Schools

Answer 2

The problem you are describing is not browser behavior problem.

When you make an synchronous request it means that the the code pending for the response. Since javascript is a single threaded language (lets ignore web-workers for now), also the UI processing/manipulation is pending, and this is why the browser or scroll-bar "stuck".

The reason it works on Firefox is that synchronous calls are deprecated (btw because of the "stuck" behavior), and what you are actually doing there is asynchronous request; You can read more about it here: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests

Answer 3

Javascript is completely single-threaded.

If you make multiple AJAX calls, you will receive each response as soon as the server sends it; the order depends on the amount of time that it takes the server to send each reply.

If your code is still running when the server replies, the reply will only be processed after your code finishes.

You should try to load all of the data in a single request.

Source: SLaks

I might hit a wall here, in other programming languages you can start a new thread for connections/things like that, if you run multiply threads (kinda like layers) your interface stays the way it is/was.