jquery - Ajax 数据返回缓慢

Question

我正在使用 Ajax 调用 PHP 页面。我注意到当返回大量数据（将近 5000 行）时，页面加载需要几秒钟。这是正常行为吗？这是我用来调用它的代码：

$.ajax({
        url: '_get_items.php?project_id=<?=$_GET['project_id']?>&list_id=<?=$_GET['list_id']?>&sort='+ sort +'&assigned_to='+ assigned_to,
        type: "GET",
        success: function(data) {
            $('.tasks_items').html(data);

        }
    });

当我在 Chrome 中调试它时，大部分时间都花在“XHR 就绪状态更改”和“重新计算样式”上，被调用了几百次。

全尺寸

我确信它这么慢的原因是因为所有的数据都被返回了。我的问题是，如何解决这个问题？我应该缩小 HTML 吗？GZip 已启用。还有其他建议吗？

这是网络屏幕：

全尺寸

Answer 1

检查网络调试面板。它将向您显示请求花费的时间。是否等待服务器响应，和/或接收数据。如果它大部分时间都在等待响应，那么您需要分析您的服务器端代码。如果它正在接收，您需要考虑如何使有效载荷更小。

Answer 2

我注意到在附加大块 HTML 时，使用原始 JavaScript 比使用库更快：

$.ajax({
    url: '_get_items.php?project_id=<?=$_GET['project_id']?>&list_id=<?=$_GET['list_id']?>&sort='+ sort +'&assigned_to='+ assigned_to,
    type: "GET",
    success: function(data) {
        $('.tasks_items').get(0).innerHtml = data;
    }
});