JavaScript最快的JSON解析器是什么？
我想用Json显示一个包含1000行的列表，这是Struts2所支持的，比如pug。我使用解析1000行来显示。但它太慢了，有时我的浏览器会崩溃。（Firefox&IE） 那么，什么是最快的Javascript框架来解析大约1000行内容呢？1000行内容是什么？jQuery实际上相当快，特别是在1.4版（几天前发布）中进行了性能升级之后。如果您在显示1000行时遇到问题，我首先会问您为什么要显示那么多行-没有人应该滚动那么多行。第二，所有的信息都是至关重要的，并且您只是将重要的信息传递到JSON值中。最后，添加数据的方式是否会使DOM变得不必要的复杂JavaScript最快的JSON解析器是什么？,javascript,jquery,json,flexigrid,Javascript,Jquery,Json,Flexigrid,我想用Json显示一个包含1000行的列表，这是Struts2所支持的，比如pug。我使用解析1000行来显示。但它太慢了，有时我的浏览器会崩溃。（Firefox&IE） 那么，什么是最快的Javascript框架来解析大约1000行内容呢？1000行内容是什么？jQuery实际上相当快，特别是在1.4版（几天前发布）中进行了性能升级之后。如果您在显示1000行时遇到问题，我首先会问您为什么要显示那么多行-没有人应该滚动那么多行。第二，所有的信息都是至关重要的，并且您只是将重要的信息传递到JSO
同样，如果您只查询需要显示的内容，并且显示的数据量合理（在屏幕上显示1000行是不合理的），那么jQuery将足以满足您的需要。我认为您不会从几乎任何同时显示1000行的网格组件获得可接受的性能，尤其是在IE上（甚至IE8）。但大多数网格应该能够支持内存中有1000个（好吧，取决于它们有多大）并在其中显示一个窗口（例如，20行、40行等），并具有分页和过滤选项，而不会出现明显的性能问题。我认为，这也将是一种更好的用户体验 编辑 我很好奇地检查了一下，是的，JSON解析时间不是问题；这将是渲染。下面是一个非常简单（不是生产）的完全客户端分页示例。在我的上网本上，IE7以36毫秒的速度解析1000行简单的JSON对象，因此即使是复杂的对象也不应该成为问题。这是在使用
evalJSONeval<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<title>1,000 Row Test Page</title>
<style type='text/css'>
body {
font-family: sans-serif;
}
#log p {
margin: 0;
padding: 0;
}
</style>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js'></script>
<script type='text/javascript' src='1000rows.js'></script>
</head>
<body><div>
<input type='button' id='btnLoadData' value='Load Data'>
<input type='button' id='btnNext' value='Next'>
<input type='button' id='btnPrevious' value='Previous'>
<table>
<thead>
<tr><th>Name</th><th>Description</th><th>Count</th></tr>
</thead>
<tfoot>
<tr><th colspan='3' id='theLabel'></th></tr>
</tfoot>
<tbody id='theData'>
<tr><td colspan='3'></td></tr>
</tbody>
</table>
<hr>
<div id='log'></div>
</div></body>
</html>
…可以找到data.txt的完整副本。向用户显示他们希望看到的内容 显示50行，添加筛选器或搜索 如果您真的认为数据应该可以在单个页面中访问，那么您可能希望 JavaScript最快的JSON解析器是什么
eval或当可用时，本地JSON解析器，至少在Chrome、Safari、Firefox 3.something、Opera 10.50甚至IE8（仅在IE8模式下）如果你真的想要速度，javascript
eval（“…”）函数是最快的。不幸的是，它不安全，因为它可以执行恶意javascript
还有JSON.org中的javascript JSON解析器（已找到）。他们编写了javascript来解析JSON字符串以创建JSON对象（我听说使用Firefox插件Firebug进行调试会创建一个JSON对象数组，但我从未尝试过）。您能显示当前代码吗？如果让我猜的话，不是JSON解析器那么慢，而是用所述数据更新DOM的方式。是否需要使用JSON？像CSV这样的简单格式比JSON解析快得多。@Gumbo:True-CSV解析起来真的很痛苦；这不仅仅是数据的问题。拆分（“，”
）。然而，JSON是一个棘手的问题（随着浏览器对显式解析JSON的支持的提高，速度和一致性也在提高，因为人们已经意识到仅仅eval
it是个坏主意）。此外，我怀疑数据解析是真正的问题。@T.J.克劳德：但在JSON中，也有不同的数据类型可以嵌套。在CSV中，只有两个值：带引号的值和不带引号的值。如果您的数据不需要引用，您可以使用类似于data.split（“，”）
@Gumbo:是的。正如我所说，真正的CSV是一种痛苦。CSV lite，如果你愿意的话（除了分隔符等，没有逗号）确实很容易。但是，我再次怀疑数据解析是否是问题所在。我通过Oracle过程获得了一个列表返回，因此它不可更改，因此，无法在Oracle中使用可滚动的ResultSet。（限制）仍然，将数据缓存在某个地方，无论是在应用程序层还是其他地方，然后从那里对其进行分页。当然，如果无法将数据保留在某个临时Oracle表（或类似的表）中，我仍然会感到惊讶，但这不会改变您可以将其缓存到其他地方的事实。请提供有关spring jdbc和Oracle缓存的更多信息，谢谢你：）请查看我上面的回答评论，我使用FlexGrid加载1000行，我认为问题的原因在于Fexigrid:），我将更新更多关于jquery的信息，谢谢你：）W.0.W，你的代码太好了。这真的很有帮助，谢谢你：）
(function() {
var data, windowTop, WINDOW_SIZE;
// "Constant" for the size of our window into the data
WINDOW_SIZE = 20; // Rows
// No data yet
clearData();
// Hook up our observers when we can
document.observe('dom:loaded', function() {
$('btnLoadData').observe('click', loadData);
$('btnNext').observe('click', function(event) {
event.stop();
updateWindow(WINDOW_SIZE);
});
$('btnPrevious').observe('click', function(event) {
event.stop();
updateWindow(-WINDOW_SIZE);
});
});
// Clear our data to a known state
function clearData() {
data = [];
windowTop = 0;
}
// Click handler for the load data button
function loadData() {
var success;
log("Loading data..");
clearData();
updateWindow();
success = false;
// Note: Using text/plain rather than application/json so
// Prototype doesn't parse the data for me, so I can measure
// how long it takes to do it.
new Ajax.Request("data.txt", {
onSuccess: function(response) {
var start, duration;
success = true;
log("Got data, parsing");
start = new Date().getTime();
data = response.responseText.evalJSON();
duration = new Date().getTime() - start;
log("Data parsed in " + duration + "ms");
updateWindow.defer();
}
});
}
function updateWindow(offset) {
var dataElement, labelElement, markup, index, template;
// Get the target element
dataElement = $('theData');
labelElement = $('theLabel');
if (!dataElement || !labelElement) {
return;
}
// If no data, simply say that
if (!data || data.length <= 0) {
dataElement.update("");
labelElement.update("No information");
return;
}
// Ensure that windowTop is rational
if (WINDOW_SIZE > data.length) {
windowTop = 0;
}
else {
if (typeof offset == 'number') {
windowTop += offset;
}
if (windowTop + WINDOW_SIZE > data.length) {
windowTop = data.length - WINDOW_SIZE;
}
if (windowTop < 0) {
windowTop = 0;
}
}
template = new Template(
"<tr><td>#{name}</td><td>#{description}</td><td>#{count}</td></tr>"
);
markup = "";
index = windowTop + WINDOW_SIZE - 1;
if (index >= data.length) {
index = data.length - 1;
}
$('theLabel').update('Showing rows ' + windowTop + ' through ' + index);
while (index >= windowTop) {
markup = template.evaluate(data[index]) + markup;
--index;
}
dataElement.update(markup);
}
// Log a message
function log(msg) {
$('log').appendChild(new Element('p').update(msg));
}
})();
[
{"name": "Name #0001", "description": "Description #0001", "count": 1},
{"name": "Name #0002", "description": "Description #0002", "count": 2},
{"name": "Name #0003", "description": "Description #0003", "count": 3},
...
{"name": "Name #1000", "description": "Description #1000", "count": 1000}
]