Загрузка большого объема данных в память - самый эффективный способ сделать это?
================================================================================

У меня есть система поиска / просмотра документации на основе Интернета, которую я разрабатываю для клиента. Частью этой системы является поисковая система, которая позволяет клиенту искать термин (и), содержащийся в документации. У меня созданы необходимые файлы поисковых данных, но нужно загрузить много данных, и загрузка всех данных занимает от 8 до 20 секунд. Данные разбиты на 40-100 файлов, в зависимости от того, какую документацию нужно искать. Каждый файл находится где-то от 40-350 КБ.

Также это приложение должно запускаться как в локальной файловой системе, так и через веб-сервер.

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

С этим предисловием, давайте посмотрим, как я это делаю сейчас.

После того, как я знаю, что вся веб-страница загружена, я вызываю функцию loadData ()

Это последовательно обрабатывает массив файлов с интервалом в 1 мс между файлами. Это помогает предотвратить полную блокировку браузера во время процесса загрузки, но браузер все еще имеет тенденцию зависать при загрузке данных. Каждый из загружаемых файлов выглядит следующим образом:

Где каждая строка - это вызов функции, которая добавляет данные в массив. Функция «AddToBookData» просто делает следующее:

Это существующая система. После загрузки всех данных «AddToBookData» может вызываться более 100 000 раз.

Я подумал, что это было довольно неэффективно, поэтому я написал скрипт для файла test.js, который содержит все вызовы функций выше, и обработал его, чтобы превратить его в гигантский массив, равный структуре данных, создаваемой BookData. Вместо того, чтобы делать все вызовы функций, которые делала старая система, я просто делаю следующее:

Я ожидал увидеть повышение производительности, потому что я удалил все вызовы функций выше, этот метод требует немного больше времени для создания точной структуры данных. Я должен отметить, что «test\_array» содержит чуть более 90 000 элементов в моем реальном тесте.

Кажется, что оба метода загрузки данных имеют примерно одинаковую загрузку ЦП. Я был удивлен, обнаружив это, так как ожидал, что второй метод потребует небольшого процессорного времени, так как структура данных создается заранее.

Пожалуйста, порекомендуйте?

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

Использование веб-работников[Веб-работники](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers) может не поддерживаться всеми вашими целевыми браузерами, но должно препятствовать блокировке основного потока браузера во время обработки данных.

Для браузеров без рабочих, вы можете рассмотреть возможность увеличения`setTimeout` немного интервал, чтобы дать браузеру время для обслуживания пользователя, а также ваш JS. Это на самом деле сделает вещи немного медленнее, но может увеличить счастье пользователя в сочетании со следующим пунктом.

Предоставление обратной связи о прогрессеКак для рабочих, так и для рабочих браузеров, потратьте некоторое время, чтобы обновить DOM с помощью индикатора выполнения. Вы знаете, сколько файлов осталось загрузить, поэтому прогресс должен быть достаточно последовательным, и хотя на самом деле все может быть немного медленнее,[пользователи будут чувствовать себя лучше](http://www.useit.com/papers/responsetime.html) если они получают обратную связь и не думают, что браузер заблокировал их.

Ленивая ЗагрузкаПо предложению[JIRA](https://stackoverflow.com/users/436450/jira) в своем комментарии. Если Google Instant может выполнять поиск по всей сети по мере ввода, действительно ли невозможно, чтобы сервер возвращал файл со всеми местоположениями поискового ключевого слова в текущей книге? Этот файл должен быть намного меньше и быстрее загружаться, чем расположение всех слов в книге, что, как я полагаю, вы сейчас пытаетесь загрузить как можно быстрее?



Есть отличная статья, очень похожая проблема, от людей, которые создали поиск по Flickr:<http://code.flickr.com/blog/2009/03/18/building-fast-client-side-searches/>



9 000 000 точек в Firefox 3.64.

Я выполнил свои тесты двумя способами: во время первой итерации я импортировал 100 файлов, содержащих 10000 строк данных, каждая строка содержала 9 элементов данных [0,1,2,3,4,5,6,7,8]

Во втором случае я попытался объединить файлы, чтобы импортировать 1 файл с 9 миллионами точек данных.

Это было намного больше, чем набор данных, который я буду использовать, но это помогает продемонстрировать скорость различных методов импорта.

Интересные результаты, если не сказать больше. Я закрыл браузер после загрузки каждой веб-страницы и запускал тесты по 4 раза каждый, чтобы минимизировать влияние сетевого трафика / вариаций. (бегал по сети, используя файловый сервер). Число, которое вы видите, является средним, хотя отдельные пробеги отличались не более чем на секунду или две.



После получения ответа JSON вы можете позвонить`AddToBookData` на нем, вот так:

Если ваши файлы имеют несколько наборов вызовов AddToBookData, вы можете структурировать их следующим образом:

А затем изменить`AddToBookData` Функция для компенсации новой структуры:

**добавление**  
Я подозреваю, что независимо от того, какой метод вы используете для передачи данных из файлов в`BookData` массив, истинное узкое место в самом количестве запросов. Должны ли файлы быть фрагментированы в 40-100? Если вы измените формат JSON, вы можете загрузить один файл, который выглядит следующим образом:

Затем вы можете сделать один запрос, загрузить все необходимые данные и двигаться дальше ... Хотя браузер может изначально заблокироваться (хотя,возможно, нет), это было бы, вероятно,**МНОГО** быстрее, таким образом.

Вот хороший учебник JSON, если вы не знакомы:<http://www.webmonkey.com/2010/02/get_started_with_json/>