javascript - php ajax 实时数据库搜索或一个查询，获取所有要搜索的结果

Question

我正在为一家公司构建一个“客户查找”工具。员工将使用它来提取客户记录。

我很好奇哪个更好以及为什么..

选项 1:

使用php + ajax通过搜索框的onkeyup进行搜索。这将是对按键的实时搜索，每次按键上升时都会查询数据库。我很可能会使用 WHERE CustomerName LIKE '%blah blah%' 客户数据库最终可能会在某个时刻变得非常大......只是想将其添加进去。如何大的？好吧，这取决于公司。

或者

选项 2:

继续通过一个查询调用所有客户，所有客户都会填充在网站上的列表中。当工作人员在搜索框中键入内容时，预先填充的列表将被过滤。 同样，客户数据库可能会变得相当大。

无论哪种方式，都有大量数据需要排序。我需要保留这种“onkeyup”风格的方法，而不使用“搜索”按钮。

<小时/>

如果有更好的方法，也请告诉我。

<小时/>

我已经编写了预填充列表的部分并查看了 ajax 选项；然而，一旦客户名单开始增长，我就会担心性能。所以，这就是这个问题的由来。 这篇文章并不是为了获取具体的代码，只是想了解处理这个项目以及 future 类似项目的最佳方法。

<小时/><小时/>

我将继续发布我当前用于过滤预填充数据的代码，仅供记录之用...

$(".searchbox").on('keyup', function () {
                if ($(this).val() != '') {
                    search(this);
                }
                else {
                    $(".data").show();
                    $.each($(".searchbox"), function () {
                        if ($(this).val() != '') {
                            $(this).keyup();
                        }
                    });
                }
            });

            function search(ele) {
                var val = $(ele).val() || '';
                if (val == '')
                    return;

                var dataclass = $(ele).attr('data-class');
                var SearchInText = '';
                $.each($(".data:visible"), function () {
                    SearchInText = $(this).find("td." + dataclass).text();
                    if (SearchInText.indexOf(val) == -1)
                        $(this).hide();
                });
            }

Answer 1

如果您预计客户数据库非常大，那么在一次调用中将它们全部加载到浏览器并不是一个好的选择。您必须根据用户输入实时加载客户。

实时加载(onkeyup)可能会给您的数据库带来很大的压力。但是，您可以通过缓存来改进它。

由于您只从数据库中检索“客户名称”，因此可以使用缓存机制将客户名称保留在内存中，并将过滤结果发送到浏览器。这样，您就可以避免数据库压力。

您应该延迟 keyup 处理程序以最大程度地减少对服务器的请求。

您可以在以下链接中找到操作方法。

How to delay the .keyup() handler until the user stops typing?