JQuery несколько get () из базы данных в массив - хорошая идея?

Question

Я пытаюсь сделать просмотрщик слайд-шоу для ряда книг с главами. «Слайды» - это фрагменты HTML-данных, хранящихся в базе данных. Глава может состоять из 50-100 слайдов, но они довольно маленькие (1-2 КБ каждый и картинки в некоторых). Я хочу, чтобы у пользователя были кнопки для перехода к предыдущему и следующему слайду и минимизации времени загрузки.

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

<?php
require_once 'Database.php';
echo Database::getInstance()->getSectionText($_GET["bookID"], $_GET["chapter"], $_GET["section"]);
?>

Мой Javascript запускает цикл и выбирает каждый раздел с $.get() для текущей главы:

        $(function() {                                
            <? $db = Database::getInstance(); ?>

            var chapterSize = <?= $db->getChapterSize($this->bookID, $this->chapter) ?>;
            var chapterContent = []; // this is where I want to store the contents
            var currentSection = <?=$this->section;?>;

            for (var i = 1; i <= chapterSize; i++) {
                $.get("ContentFetcher.php", { 
                    bookID  : <?= $this->bookID  ?>,
                    chapter : <?= $this->chapter ?>,
                    section : i
                }, function(data) {
                 chapterContent.push(data);
             });
           }

        $("#slides").html(chapterContent[currentSection]); // show the current slide

     });

Так это хорошая идея с точки зрения производительности? Если да, то мое понимание JS-замыканий еще не так велико - как я могу получить доступ к тому же chapterContent внутри замыкания?

Answer 1

Эта идея означает, что вы будете делать от 50 до 100 HTTP-запросов для загрузки одной главы; и все это будет сделано почти одновременно.

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

В такой ситуации я, вероятно, попытался бы реализовать что-то вроде этого:

• Когда пользователь открывает главу, выполните один HTTP-запрос, который вернет первые 10 слайдов
• Когда пользователь попадает на слайд 8, выполните один HTTP-запрос, чтобы загрузить слайды с 11 по 20
• Когда пользователь попадает на слайд 18, выполните один HTTP-запрос, чтобы загрузить слайды с 21 по 30
• И так далее

Конечно:

• Если пользователь попадает на слайд 56, набирая его URL (если это возможно) или используя некоторую функцию «Перейти к слайду X», вы должны выполнить HTTP-запрос для загрузки слайдов с 51 по 60.
• И это означает, что пользователям, возможно, придется немного подождать, если они слишком быстро переходят от слайда к слайду.

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

• Вы не будете загружать слишком много данных одновременно,
• Вы не будете предварительно загружать слишком много данных,
• Вы не будете делать слишком много HTTP-запросов,
• И это будет сделано заранее, поэтому пользователю не нужно ждать, пока появятся новые слайды.

Answer 2

Нет, это определенно не очень хорошая идея. Я бы порекомендовал вам сделать один запрос $ .get (), чтобы получить все записи в массиве JSON.

Что касается замыканий, вы должны смотреть отличные видео Дугласа Крокфордса "Язык программирования JavaScript" (4 части) . Да, затворы можно использовать таким образом, они просто великолепны.