Известен начальный размер страницы, нужно узнать процент её загрузки в текущий момент или время, за которое она будет загружаться (но лучше процент). Наверное, чистого решения здесь не выйдет.
Из найденных решений:
1. Вначале загружаем картинку, замеряем время её загрузки, делим размер на время, получаем скорость соединения, делим размер страницы на скорость, получаем время загрузки страницы, загружаем всё остальное.
Минусы: не учитывает время на запросы к серверу, скорость соединения может измениться.
Точность: низкая
2. Упаковываем всё (или делим всё на блоки и упаковываем уже их) во фреймы, ставим им по .load(), в котором увеличиваем значение переменной на 1. Процентное значение — переменная поделённая на общее количество фреймов.
Минусы: очень грязно, ломается вёрстка и взаимодействия элементов друг с другом.
Точность: низкая
3. Проверяем каждую секунду загрузку каждого ресурса
performance.getEntriesByName('ссылка_к_ресурсу')[0]
, если ресурс загружен, повышаем переменную на размер этого ресурса (
performance.getEntriesByName('ссылка_к_ресурсу')[0].decodedBodySize
). Или сразу проверять по .decodedBodySize. Загрузка в процентах — переменная поделённая на общий размер.
Минусы: нельзя узнать процент загрузки ресурса, он либо загружен, либо ещё нет, следовательно, точность будет зависеть от количества и размера ресурсов. Но зато это чистый метод.
Точность: средняя
