用KnockoutJS存储AmplifyJS建模的数据

Question

我正试图找到一种方法来缓存我的knockoutJS SPA数据，我一直在试验amplifyJS。这是我的一个GET函数：

UserController.prototype.getUsers = function() {
   var self = this;

   return $.ajax({
      type: 'GET',
      url: self.Config.api + 'users'
   }).done(function(data) {
      self.usersArr(ko.utils.arrayMap(data.users, function(item) {
         // run each item through model
         return new self.Model.User(item);
      }));         
   }).fail(function(data) {
      // failed
   });
};

下面是相同的函数，“放大”：

UserController.prototype.getUsers = function() {
   var self = this;

   if (amplify.store('users')) {
      self.usersArr(ko.utils.arrayMap(amplify.store('users'), function(item) {
         // run each item through model
         return new self.Model.User(item);
      }));
  } else {
     return $.ajax({
        type: 'GET',
        url: self.Config.api + 'users'
     }).done(function(data) {
        self.usersArr(ko.utils.arrayMap(data.users, function(item) {
           // run each item through model
           return new self.Model.User(item);
        }));         
     }).fail(function(data) {
      // failed
   });
};

这和预期的一样，但是我不确定我所使用的方法，因为它还需要在addUser、removeUser和editUser函数上做额外的工作。而且，由于我在整个应用程序中都有更多类似的功能，如果可能的话，我想避免额外的代码。

我在ko.extenders的帮助下找到了一种处理事情的方法，如下所示：

this.usersArr = ko.observableArray().extend({ localStore: 'users'  });

然后，每当ko.extenders.localStore函数检测到observableArray内部的变化时，就使用它来更新本地存储数据。因此，在init上，它将写入observableArray，以防存在users密钥的本地存储数据，并且在发生更改时，它将更新本地存储数据。

这种方法的问题是，我需要在模型中运行我的数据，但是我无法从localStore函数中找到这样的方法，该函数保存在一个单独的页面上。

你们中有谁曾与KO和放大器合作过吗？你用了什么方法？我应该使用第一个，还是尝试两者的组合，并重写扩展程序，使其只更新本地存储而不写入init上的observableArray？

Answer 1

在问题注释中的讨论之后，我建议使用本机HTTP缓存，而不是通过额外的库在客户机上添加另一个缓存层。

这将需要实现一个有条件的请求方案。

这种方案依赖于通过Last-Modified (或E-Tag) headers和其他影响浏览器缓存的头(比如Cache-Control:及其各种选项)的Ajax响应头中的新鲜信息。

• 当随后请求相同的资源(URL)时，浏览器透明地向服务器发送一个If-Modified-Since (或If-None-Match)头。
• 如果客户端的信息仍然是最新的，服务器可以使用HTTP 304 Not Modified进行响应.这比从头开始重新创建完整的响应要快得多。
• 从Ajax请求的角度(jQuery或其他方面)来看，响应的工作方式是相同的，无论它是来自服务器还是来自浏览器的缓存，后者的速度都要快得多。

仔细调整服务器端对此是必要的，而客户端则不需要太多的更改。

实现条件请求的好处是减少了服务器上的负载，并加快了客户端的响应行为。

Knockout的一个特长是为了进一步改善这一点：

如果您碰巧使用映射插件将原始服务器数据映射到一个复杂的视图模型，那么您可以定义一个key函数，作为控制映射过程的选项的一部分。它的目的是将视图模型的部分与源数据的部分进行匹配。

这样，已经映射的部分数据将不再被映射，其他部分将被更新。这有助于减少客户端对它已经拥有的数据的处理时间，并可能减少不必要的屏幕更新。