3

我正在使用 PHP、Javascript/jQuery/Ajax、JSON 和 localstorage 为我的公司构建一个访客列表应用程序。它将用于智能手机：主要是 Iphone 4。我使用 localstorage 作为我的缓存，因为应用程序的搜索部分必须在离线模式下工作。

我在搜索来宾列表时遇到性能问题。

该应用程序的流程如下所示（例如，我正在使用包含 600 位客人的客人列表）

1. 使用 PHP 编码 JSON 从服务器检索所有客人，并通过 AJAX 发送回 js。这工作正常。

2.使用 JSON.Parse 解析 PHP responseText（称为 phpData）：

var parsedMysqlData = JSON.parse(phpData);

这给了我们一个包含 600 个对象的 JSON.Array，如下所示：

Object:  {
Id: Int
EventId: int
guestInfo: string
guestlist: string
guestName: string
reference: string
total: int
used: int
}

3.使用 JSON.Stringify 将 JSON.Array 保存到用户的本地存储中：

 localStorage.setItem(0, JSON.stringify(parsedMysqlData));

4.当用户开始搜索时，我们得到他的搜索字符串，然后在 localstorage 中使用 JSON.parse 检索我们的客人列表，如下所示：

 var currentGuestlist = JSON.parse(localStorage.getItem(0));

然后使用这个 for 循环遍历我们的对象，尝试将他的搜索字符串与我们的客人数组 currentGuestlist 匹配：

 for (i=0; i<currentGuestlist.length; i++) {
 // match 'currentGuestList[i]['name']' with what the user typed in search form 
}


出于某种原因，这在 iPhone 4 上需要很长时间。搜索 600 个对象会使 iphone 在返回匹配项之前冻结大约 4 秒。

在将包含 JSON 对象的数组存储在 localStorage 中并使用 JSON 解析之前，我只是将无序字符串存储在 localStorage 中，它的工作速度要快得多。JSON 对象广告结构到存储在 localStorage 中的数据，这是至关重要的。所以我想速度问题与我使用 JSON 对象的事实有关吗？如何以有组织的方式构建我的本地存储数据，同时仍保持与以前一样好的速度性能？

最后，非常感谢您提供有关您将使用哪些技术使该应用程序尽可能轻巧和快速的任何提示或建议。

4

2 回答 2

2

您是否从本地存储中获取每次搜索的列表？不要那样做，而是仅在需要时（无论何时更改）将其存储在本地存储中，并始终将其保留为数据结构。

简单地使用对象而不是普通字符串不能成为缓慢的原因，因为 JavaScript 中的所有内容都已经是一个对象，因此它应该只以一个常数因子减慢。

此外，如果这是关于自动完成类型的行为，那么我建议您放慢搜索速度，并考虑如果用户在“Ma”框中键入，则列表被过滤，并且用户添加“tt”为“马特”，只需要考虑以前过滤的匹配...

于 2012-05-16T15:10:24.613 回答
0

也许您的设置更适合使用 WebSQL 数据库，而不是在本地存储中存储 JSON 对象。WebSQL 现在已被弃用，但它在 webkit-browsers 中得到了很好的支持。我在几个项目中使用它并取得了很好的效果。

你可以在这里阅读更多关于它的信息：http: //html5doctor.com/introducing-web-sql-databases/

于 2012-12-06T09:08:57.117 回答