Question

我正在构建一个应该可以离线工作的应用。我正在使用jQuery Mobile，PHP，MySQL和jStorage以便轻松使用HTML5 localStorage

我正在尝试找出将数据下载到本地设备localStorage并在以后阶段使用它而不会减慢或崩溃浏览器的最佳方法。

我在MySQL表中有大约5000条记录（500 Kb数据），我需要该应用程序才能下载所有这些数据，以便在离线时可以在第二阶段使用。

download_script.php以JSON格式返回所有记录例如

{"1":{"1":{"p_bar":"10.30","v_0":"0.0312207306000000","h_vap":"311.78","p_10c":"99.99"}},"2":{"1":{"p_bar":"10.40","v_0":"0.0309405941000000","h_vap":"311.29","p_10c":"0.00"}},

我想知道是否有任何方法可以优化以下脚本（例如，为了不挂起浏览器，并可能显示正在下载的数据的百分比）

$.ajax({
  url: "download_script.php",
  cache: false,
  success: function(big_json_dump){
  $.jStorage.set('some_key', big_json_dump);
 }
});

这种方法可以优化，例如使用radpidjson？如何更改它以显示下载的实时百分比数据？

Answer 1

（您在评论中进行了很好的讨论，但问题没有答案......）

＆＃34;为了不挂起浏览器＆＃34;您需要将数据拆分为较小的部分并分别获取每个部分（例如，在循环中）。否则，解析大量JSON可能会使浏览器挂起几毫秒。 Rapidjson无法提供帮助，因为Rapidjson是C ++，浏览器会使用JavaScript。

＆＃34;显示数据的百分比＆＃34;您需要首先通知浏览器的JavaScript部件总数。再一次，与Rapidjson无关。

还有JavaScript流式JSON解析器（如Clarinet），从理论上讲，它可以解析块中的大型JSON文档。这使您可以更多地控制解析，但代价是CPU和编程的复杂性。您可能需要引入一个Web Worker或一个不活跃的aritifial时刻来保持浏览器的响应。但是如果你正在使用Web Worker，你可以在那里执行标准的JSON.parse：http://igorminar.github.io/webworker-json-perf/; http://blog.softwareispoetry.com/2013/05/using-web-workers-to-jsonparse-large.html

Answer 2

分页结果并在循环中执行$.ajax：

var total_records = 5000; // get this number to the browser somehow.
var per_page = 75;
var total_pages = Math.floor(total_records / per_page);

for(var i = 0; i < total_pages; i++) {
    $.ajax({
      url: "download_script.php",
      cache: false,
      data: { page: i },
      success: function(big_json_dump){
      $.jStorage.set('some_key', big_json_dump);
     }
    });
}

在PHP / SQL语句中分页：

$page = intval($_GET['page']);
$from = $page * 50;
SELECT * FROM my_table LIMIT $from, 50;
                             ^^     ^^ total records to show
                             record_cursor

AJAX解析了大量的JSON并存储在localStorage中

2 个答案: