Как сделать прелоадер на сайт в %?

Question

[Вячеслав Яшников]

Приветствую!
Может кто делал на сайт прелоадер который действительно отображает процент загрузки всего сайта? а не просто стоит задержка на несколько секунд после загрузки всех js.
Есть идея замерить за сколько загрузится один файл с сервера и потом на основании этого высчитать время самой анимации, но по моему это тот еще костыль...

Comments

[Sanovskiy]

Сайт на флэше? Если нет, то делать прелоадер глупая идея.
Обычно время загрузки страницы не должно превышать 1 секунды. Если то, конечно не страница с каким=набудь очень длинным списком товаров.

[Вячеслав Яшников]

Sanovskiy, демонстрация мокапов, очень много изображений которые очень высокого разрешения для ретины

[Sanovskiy]

Вячеслав Яшников, поищите здесь. Может понравится что.

А навесить ещё проще.
Добавляете оверлей с z-index 1000
Над ним прелоадер.
В заголовке засекаете время начала загрузки страницы
А по document.ready его убираете и отмечаете время окончания загрузки страницы.
Мануальчик

Повторюсь. Сайт на чем сделан?.

[ⓒⓢⓢ]

реальный процент лоадера для "всего" сайта можно сделать, если знать реальный размер всего того, что надо загрузить. (например размер всего отдать с сервера) и слушать браузерные загрузки.

имхо если Такое и делать, то лучше отбросить проценты и показать точные цифры сколько уже скачалось трафика.
Ибо пользователю фиолетово на псевдо-реальные проценты

[Вячеслав Яшников]

Sanovskiy, html jquery

[Sanovskiy]

Вячеслав Яшников, тогда вполне подойдёт $(function(){});

Answer 1

[Aleksey Solovyev]

демонстрация мокапов, очень много изображений которые очень высокого разрешения для ретины

Подгружайте картинки js'ом(lazy load). Пусть вся станица будет 10%, то каждая загруженная картинка будет 90% / n-image. Вот и обновляйте статус после каждой картинки.

Но изначально подход какой-то странный. Вы заставляете клиента ждать загрузки картинок всех? Почему не использовать lazy load? Под каждой картинкой pre-loader и по мере загрузки страницы меняйте pre-loader на картинку. Пусть клиент смотрит на 1 пока остальные грузятся.

Ну и если уж совсем 'правильно', то делайте адекватную preview-картинку(маленького размера). Если ему понравится, то он перейдет на странице с полноразмерной картинкой

Comments

[eeiaao]

плюсую. никому не интересно сидеть и залипать в инкремент процента

Answer 2

[Максим Тимофеев]

Может кто делал

Не встречал и вряд ли тут может быть полноценное решение даже в теории

Есть идея замерить за сколько загрузится один файл с сервера и потом на основании этого

Файлы бываю разного размера, могут храниться на разных серверах, могут грузиться из кеша браузера, соответственно скорость загрузки 1 файла не скажет Вам ни о чем.

Добавим сюда асинхронно подгружаемые ресурсы, время на срабатывание js скриптов и т.д. В итоге логика, которая это все отследит, будет замедлять работу сайта больше чем все остальное.
Многие думали на этот счет и всегда правильный выход - эмуляция прогресса загрузки, а не его точное определение.

Comments

[Вячеслав Яшников]

про кэш не подумал, конечно не круто