#javascript #html #json #dom
#javascript #HTML #json #dom
Вопрос:
я клонирую пространство instagram для чата. у меня есть огромный объем данных (около 20-30 тысяч текстов), извлекаемых с сервера с помощью fetchAPI сразу в виде JSON. Fetchapi загружает данные, а затем я выполняю итерацию через json для загрузки данных на экран, используя ванильный javascript и html-теги.
сначала я использовал цикл for для загрузки страницы с элементами html, но я не знаю, почему весь браузер постоянно выходит из строя.
затем я использовал javascript setinterval() с временным интервалом в 1 миллисекунду для загрузки данных, чтобы все работало нормально.
проблема заключается в том, что время выполнения метода setinterval на 1 миллисекунду резко сокращается после загрузки некоторого html, например, около 1000 тегов. для загрузки 10k тегов требуется несколько часов. для загрузки 30k тегов может потребоваться несколько дней.
план состоит в том , чтобы разместить веб — сайт и использовать его для чего — то личного .
можно ли в любом случае загрузить около 30 тысяч HTML-тегов параллельным способом или, например, загрузить 1000 на одну вкладку и следующий 1 тысячу на новую вкладку или загрузить все из них вместе. я новичок в веб-разработке.
это html-теги
<div class="msg_received_container"><img id="receiver-image" src="image.jpg"><span class="msg_received"> <p> THE TEXT FROM JSON </p></span></div>
(я хочу загрузить не менее 30 КБ этого тега)
а также CSS в другом файле.
Комментарии:
1. в зависимости от того, как вы отображаете 30 тыс. элементов dom, используйте intersection observer для загрузки большего количества, ваша проблема заключается в том, что вы можете разместить от 10 до 50 на странице, затем, когда вы прокручиваете вниз, загрузите еще немного, не должно быть причин добавлять их все сразу, если пользователь не собирается их видеть.
2. @LawrenceCherone итак, если он загружается, когда я разворачиваю, что происходит с другими элементами DOM в верхней части. как и элементы, которые я просматривал, будут ли они уничтожены? есть ли какой-либо другой способ загрузить и отобразить все это с плавностью? так, как пользователь может прокручивать страницу без загрузки.
3. нет, они остаются там, вы могли бы их удалить, но вам нужно немного изменить высоту, чтобы сохранить общую высоту полосы прокрутки. Я думал, проблема в их эффективном добавлении? который вы используете lazyloading, как упоминалось. Вы не упоминаете, что возвращает API или имеет ли он подкачку, только то, что он возвращает все из них. Какой API вы используете?
5. @LawrenceCherone я использую fetchAPI для извлечения данных json, которые я загрузил на github. этот json содержит текстовые сообщения, множество текстовых сообщений. я хочу отображать эти текстовые сообщения на экране, как мы получаем из любой системы чата в социальных сетях. итак, когда я использую цикл for для повторения сбоев Chrome, появляется около 30 тысяч сообщений, поэтому я использовал javascript setInterval() API для просмотра каждого DOM с интервалом в 500 миллисекунд, чтобы у всех DOMS было время для загрузки. но я не знаю, почему через некоторое время для загрузки одного DOM требуется более 500 миллисекунд (временной интервал увеличивается экспоненциально), это prblm