Как сделать горизонтальный индикатор загрузки сайта как на YouTube?
Подскажите, как сделать горизонтальный индикатор загрузки сайта? Пример когда кликаешь на видео на ютубе и там вверху красная линия типа прогружается слева-направо. Может кто знает готовые решения?
vladislav997, на ютубе когда кликаешь на видео этот прогресс идет при переходе по роутам внутри их SPA приложения через AJAX без перезагрузки всего сайта
возможно ты не понял что на ютубе этой полосы нет когда ты новую страницу в браузере открываешь, в этом случае у них другая анимация загрузки - без полоски. И это сделано потому что в таком случае полоску можно только фейковую поставить (очень приблизительную - угадывающую прогресс по фактам загрузки отдельных файлов)
vladislav997, ты запутывающий пример привел, потому что на ютубе эта полоска есть только на переходах по ajax-у
У тебя SPA приложение или классические странички?
Судя по тому что тебе не нравится предложенный мной вариант, классические странички. Тогда тебе нужно что-то типа такого: https://origami1024.github.io/progress/ https://github.hubspot.com/pace/docs/welcome/
Но если ты поисследуешь эту тему, то скорее всего откажешься от подобного прогрессбара, потому что в браузере нет данных о прогрессе первоначальной загрузки, есть только события загрузки отдельных файлов.
Все подобные либы просто закрывают страницу сайта на ~0.5сек лоадером, и убирают лоадер примерно угадываная что загрузка закончилась.
Особенно изощренные либы используют во время загрузки уточнения по различным событиям загрузки файлов, но это не дает хорошей точности, потому что изначально нет информации сколько всего будет файлов, так как при подгрузке очередного скрипта обнаруживается что он хочет подгрузить еще скриптов или картинок и прогресс течет вниз
