Ответ 1

Это именно та проблема, которую мне пришлось решить для моего сайта 33hotels.com. Вы можете проверить его и сыграть с вкладками "Фильтр" и "Список фильтров" (соответствующие различным маршрутам) и увидеть, что представление обновляется мгновенно без задержки!

Как я это сделал? Идея удивительно проста - избавиться от маршрутизатора!

Почему? Поскольку способ работы маршрутизатора - это перекомпилировать представление каждого изменения маршрута. Да, Angular кэширует шаблон, но не скомпилированный вид, заполненный данными. Даже если данные не меняются! В результате, когда я использовал Router в прошлом, коммутатор всегда чувствовал себя вялым и нереактивным. Каждый раз, когда я мог заметить раздражающую задержку, это была небольшая часть секунды, но все же заметно.

Теперь решение, которое я использовал? Не перекомпилируйте свои представления! Храните их внутри DOM в любое время! Затем используйте ng-hide/ng-show, чтобы скрыть/показать их в зависимости от маршрутов:

<div ng-show="routeIs('/dashboard')">
    <-- Your template for Dashboard -->
</div>

<div ng-show="routeIs('/book')">
    <-- Your template for Book -->
</div>

Затем создайте функцию routeIs(string) внутри Controller, чтобы проверить, соответствует ли $location.path() string, или начинается с string, когда я его использую. Таким образом, я все еще получаю свой вид для всех патчей, например /book/2. Вот функция, которую я использую:

$scope.routeBegins = function () {
    return _.some(arguments, function (string) {
           return 0 === $location.path().indexOf(string);               
    });
};            

Так что не нужно быть умным с кешированием - просто держите его в DOM. Он будет кэшировать ваши представления для вас!

И самое лучшее - когда ваши данные будут изменены, Angular мгновенно обновит все Представления внутри вашей DOM, даже скрытые!

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

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

Другим возможным, но недопустимым недостатком является стоимость перекомпиляции скрытых просмотров. Здесь вы можете стать умнее и избегать вычислений тяжелых частей в зависимости от текущих маршрутов. Кроме того, вы не перекомпилируете весь View, а только части, подверженные изменениям данных, что также снижает вычислительные затраты.

Я считаю весьма примечательным, что все используют Маршруты и, похоже, совершенно не знают (или не знают) об этой проблеме.

Ответ 2

1) О статических страницах в приложении (представления), angular берет на себя загрузку.

например: для страницы вашей панели мониторинга вам не нужно беспокоиться о кешировании страницы, так как angular позаботится об этом. angular будет загружать только представление панели мониторинга один раз и во всех последующих запросах для представления панели мониторинга, angular просто покажет вам представление (не загружает файл для просмотра), если это все статический вид без каких-либо данных, загруженных ajax calls.

2), если ваша панель сама загружает список книг (или аналогичные данные) через ajax, то вы можете сообщить своему контроллеру только один раз загрузить данные и сохранить их в localstorage, а при последующих запросах на страницу панели мониторинга можно загрузить только данные из localStorage.

3) аналогичный подход можно использовать, когда ваш BooksController загружает данные в представление. Вы можете проверить свой BookController, если запрос для конкретной книги был ранее сделан, и если вы не можете сохранить его в localstorage или в базе данных. и если данные были запрошены ранее, вы можете загрузить те же данные из хранилища без запроса на сервер.

Пример ситуации:

скажем, пользователь делает запрос для book1, затем

• ваш контроллер i.e BooksController проверяет, были ли ранее запрошены те же данные,
• Если нет, вы можете загрузить данные через вызов ajax с сервера, а также сохранить его в локальном хранилище.
• если он был загружен, прежде чем вы загрузите данные, хранящиеся в localstorage или в базе данных.

Ответ 3

Если вы используете ui.router, тогда вы должны взглянуть на дополнительные функции ui.router, в частности на модуль липких состояний. Это позволяет вам кэшировать "дерево" состояния (включая визуализированные представления), поэтому их не нужно компилировать или повторно отображать при изменениях состояния.

http://christopherthielen.github.io/ui-router-extras/

Вот демо:

http://christopherthielen.github.io/ui-router-extras/example/sticky/#/