Question

“实时搜索功能”的效率是多少？

稍微延迟的keyup是一个请求，记录返回json，我以这种方式追加：

$.ajax({            
            type: "POST",
            url: "/spares/search/getresults",
            dataType: "json",
            data: "val="+ searchval,
            success: function(response){
                if (response.error == false) {

                        $.each(response.result, function(index, value){
                            $(".choosCred").append("<tr class='productChoose'> <td class='hide'>"+ value.id +"</td> <td class='hide'>"+ prod_id +"</td> <td class='hide'>"+ article +"</td> <td>"+ value.cd_cred +"</td> <td >"+ value.name_org +"</td> <td >"+ value.quality +"</td> <td class='hide'>"+ article_description +"</td> <td>" + '<button type="button" id="add"class="btn-xs btn btn-info add">Add </button>' +"</td> </tr>");         
                        }); 
                }  
            }
        });

但是我可以在php中生成完整的表，然后像这样添加它：

 $.ajax({            
            type: "POST",
            url: "/spares/search/getresults/",
            data: "SearchTerm="+ searchValue,
            success: function(response){
                $(".products tbody").html(response).show();
            }
        });

注意：在php代码中，我循环遍历每个结果并为其添加一些值，而不是我在那里生成表，因为我已经有一个for循环。当我追加它时，它是闪电般的。当我用javascript追加记录并循环遍历每个json结果时，它会变慢。

最好和最快的方法是什么？或者还有另外一个技巧吗？

Answer 1

这取决于用例。

我们使用Ajax来减少回发的HTML开销。这意味着您只交换数据（例如json）。考虑到这一点，你的拳头是“更好”的。

性能是一个非常不同的点。你的服务器有多好？你的客户有多好？数据有多大？我可以肯定地说，如果你在客户端上创建表，你的服务器就没那么做了（这意味着可以处理更多的请求）。

Answer 2

这可能是对您的javascript示例的一个小改进：

if (b1) {
} else if (bx) {
}

现在jQuery不需要查找每一次迭代并注入HTML。而是做一次。

我认为你的方法取决于你得到的结果集除了多少。因为您在请求中返回的HTML越多，javascript读取/解析它所需的时间就越长。

例如，除了返回结果集以外，还有200多个项目。它必须解析可能超过1MB的正文/ HTML。你可以除了它需要更长一点。但是，如果您的结果集是10-20轮，则可以更快地将生成的HTML直接推送到您的页面中。

希望你明白我的去向。

最近有同样的问题，因为我的javascript试图解析5MB的HTML。经过调查，浏览器需要5-10秒才能解析响应，而PHP则在150-200ms内完成。我改为JSON并使用javascript解析它在1秒内完成（注意：我添加了甚至是时髦的过渡以使其看起来很酷而且快速）。

Answer 3

javaScript方式很好，因为每次用户输入都要改变你的值，这样javaScript会比php提供更好的用户体验

什么更有效？在javascript或php中生成每个tr？

3 个答案: