可以缓存JSON以增加性能/加载时间吗?

nul*_*ull 11 javascript json

我正在使用JSON文件自动填充下拉列表.它绝不是大规模的(3000行和不断增长),但刷新页面所花费的时间变得非常明显.

第一次加载页面时,将读取JSON,具体取决于用户选择的选项指示JSON的哪个部分用于填充下拉列表.

然后在每次刷新或菜单选择后加载它.是否有可能以某种方式缓存值以防止需要一次又一次地重新加载它?

谢谢.

编辑:更多信息:它本质上是一个单位转换器.JSON包含所有细节.例如,当用户选择"Temp"时,进行呼叫并填充列表.一旦转换完成后,你可以整天运行温度的转换,他们将被罚款,但每次用户所以现在改变转换类型长度,页面刷新,并花费的时间显着量.

War*_*0ck 12

不幸的是,我不知道PHP中的标准化全局缓存机制.文章说,被包含在PHP核心的5.5版本开始优化升级,第三方加速器.不确定您使用的是哪个版本,但您可以试试.

另外一点,您是否考虑过安德鲁指出的文件存储?我认为它结合起来$_SESSION可以在这种情况下真正帮助你.让我举一个可以使用现有JSON数据的示例:

服务器端

将JSON数据存储在.jsonPHP服务器上的文件中:

{
    "data": "some data",
    "data2": "more data",
    "data3": [
        ...
     ],
     etc.
}
Run Code Online (Sandbox Code Playgroud)

注意:确保正确格式化JSON数据.请记住,所有字符串必须用引号括起来".

在PHP中,使用if语句来决定适当的操作:

error_reporting(E_ALL);
ini_set("display_errors", "On");
session_start();

if(isset($_SESSION['dataCache'])) {
    echo json_encode($_SESSION['dataCache']);
} else {
    $file = 'data.json';
    if (!is_file($file) || !is_readable($file)) {
        die("File not accessible.");
    }
    $contents = file_get_contents($file);
    $_SESSION['dataCache'] = json_decode($contents, true);
    echo $contents;
}
Run Code Online (Sandbox Code Playgroud)

因此,让我们深入研究上面的编码.所以这就是我们简单地做的事情:

  1. 打开错误报告并启动会话支持.
  2. 检查我们是否已经读过该用户的文件.
  3. 如果是这样,从存储中提取值并将其回显并退出.如果没有继续下面.
  4. 保存文件名并进行一些错误检查,以确保PHP可以查找,打开和读取文件的内容.
  5. 阅读文件内容.
  6. 将解码后的json(由于传递给`json_decode`的`true`参数而不是数组)保存到`$ _SESSION`变量中.
  7. 将内容回显到屏幕.

这将节省您解析JSON数据和/或在服务器上手动构建它的时间和风险.它将被缓存给用户,session以便他们可以在整个过程中使用它.

客户端

我假设你ajax用来获取信息?如果不能纠正我,但我认为这是你的一些JavaScript发挥作用的地方.如果是这样,你可以考虑这个:

sessionStorage从服务器返回时,将返回的数据存储在用户的浏览器中:

$.ajax({
    ...
    success: function (res) {
        localStorage.setItem("dataCache", JSON.stringify(res));
    },
    ...
});
Run Code Online (Sandbox Code Playgroud)

或者如果您使用promise对象:

$.ajax({
    ...
}).done(function (res) {
    localStorage.setItem("dataCache", JSON.stringify(res));
});
Run Code Online (Sandbox Code Playgroud)

当您需要阅读它时,您可以进行简单的测试:

var data;
// This returns null if the item is not in local storage.
// Since JavaScript is truthy falsy, it will be evaluated as false.

if(localStorage.getItem("dataCache")) {
    data = JSON.parse(localStorage.getItem("dataCache"));
} else {
    // Make ajax call, fetch object and store in localStorage in the success or done callbacks as described above
}
Run Code Online (Sandbox Code Playgroud)

笔记:

localStorage是HTML5中的一项新功能,因此尚未完全支持所有浏览器.然而,大多数主要的确实如此,甚至可以追溯到IE8(我认为).但是,对于每个站点需要保留多少浏览器,没有标准化的大小限制.

考虑到这一点很重要.我可以保证你可能无法在localStorage中存储整个30,000行字符串.但是,您可以将此作为开始.结合服务器端解决方案,您应该看到性能提升.

希望这可以帮助.