javascript - ajax 调用中的数据是如何计算的？

Question

我将使用 AJAX 作为分页脚本，并希望使该脚本尽可能“节省数据消耗”。因此，我的想法是只加载所选页面的项目，并为所有未显示的项目加载带有 data-id 的空 li-items。

问题是，如果ajax调用的php文件无论如何都会遍历所有数据，这是否真的节省了数据消耗。

我想问题是；数据是根据ajax响应中有多少内容来计算的，还是根据对php文件的ajax调用有多大来计算的？

我是否可以通过将大量 li-items 留空来保存任何数据，或者我是否可以添加内容，因为它已加载到 ajax 调用中？

有谁明白我的意思吗？

人们总是想要代码示例:

jQuery.post(ajaxurl, 'action=load_items', function(response)
{
            // Is it the action 'action=load_items' 
            // that consumes data? Or is it the amount
            // of data coming out in the response?
});

Answer 1

我想您希望最大限度地减少客户(访问网站的人)消耗的数据(例如，由于手机上的数据计划较小)。它是否正确？

如果是这样，您需要考虑从您的网站实际发送给客户的内容。 PHP 脚本回显一些数据，并且仅将这些数据传输到客户端。因此，您在计算过程中实际读入的内容(并保存在服务器内存中)并不相关。这与您实际发布并发送给客户的内容相关。

这就是说，您可以优化脚本的输出。首先，您应该启用 GZIP。这可以节省最多的数据，并且每个浏览器都可以理解。在 PHP 中，这非常容易(参见 detailed answer )。只需在输出之前添加 ob_start("ob_gzhandler"); 即可。

其次，您应该缩小发送回客户端的 JSON。您只需使用默认函数 json_encode() 即可完成此操作。这将删除 JSON 中所有不必要的空白。

如果您现在仅发送数据 block 而不是整个数据集，那么这可能是最节省数据的方法。请记住，总是有一个 HTTP header 也需要传输。因此，如果您想优化数据消耗，请不要制作太小的数据包(理想情况下，您发送的正是普通用户希望在一个包中看到的内容)。

您可以在“网络”选项卡中跟踪网站的数据消耗情况，例如: Google Chrome 的开发工具(我确信这在其他浏览器中也可用)。每个 Ajax 调用都会在此处列出及其大小(您可以使用 XHR 对其进行过滤)。