How to make a horizontal site loading indicator like on YouTube?

Question

Web development

Tell me how to make a horizontal site loading indicator? An example is when you click on a video on YouTube and there, at the top, a red line like that is loaded from left to right. Maybe someone knows ready-made solutions?

Answer 1

Such a component is called ajax progress bar - for Google.
The bottom line is that the ajax request has a "progress" event, in the parameters of which they receive:

1. the value of the total size of the response (event.total)
   
2. and the value of which part is currently loaded (event.loaded).
   

These two values ​​are all that is needed to draw the current progress
. Implementation example: