对加载相关下拉列表的性能影响，最多约30000条记录

Performance impact on loading interrelated dropdowns with max of arounf 30,000 records

本文关键字：记录 30000条 影响 性能 加载 下拉列表      更新时间：2023-09-26

以下是场景：

在Spring MVC应用程序的JSP页面中，我有4个下拉菜单。下拉列表（国家、州、分区和村庄）相互关联，因为选择特定国家时会将州下拉列表加载为州值，选择特定州时会加载分区下拉列表中的值，依此类推。我的应用程序中的最大记录数为：

  • 国家：75
  • 州：1000
  • 部门：3000
  • 村庄：30000

数据存在于4个哈希图中，如：

 - Map of String CountryId key with String Name as value
 - Map of String CountryId key with (Map of String StateId key with String StateName) as value
 - Map of String StateId key with (Map of String DivisionID key with String DivisionName) as value
 - Map of String DivisionId key with (Map of String VillageId key with String VillageName) as value

问题：

目前，我正在JSP页面上加载所有4个哈希图，并根据上一个下拉列表的选择在下拉列表中显示值：`

$("#country").on("change", function(e) {
    var stateMap = '${stateList}';
    var jsondata = $.parseJSON(stateMap );
    $.each(jsondata[$(this).val()], function (key, value) {
        $('#state').append($('<option></option>').val(key).html(value)).prop('disabled',false);
    });
});

在这里，在下拉列表中填充值是在javascript本身中处理的我这样做是为了减少服务器上的点击次数但是，考虑到哈希图中有大量记录，在下拉列表中填充数据的正确方式是什么？或者，每次在下拉列表中选择值时，我是否应该执行AJAX调用，以填充后续下拉列表中的值。

从性能的角度来看，这两种方法中哪一种更合适。

在这里，在下拉列表中填充值是在javascript本身中处理的。我这样做是为了减少服务器上的点击次数。但是，考虑到哈希图中有大量记录，在下拉列表中填充数据的正确方式是什么？

我敢打赌这对来说是个好主意

  • 国家：75

也许还有

  • 州：1000
  • 甚至可能是Divisions：3000

但是

  • 不适用于村庄：30000

每次在下拉列表中选择值时，我是否应该执行AJAX调用，以填充后续下拉列表中的值。

每个子列表都是一个静态资源，没有什么可计算的，而且可以很快提供。如果你幸运的话，这个通话大约需要50-100毫秒，也就是说，远低于人类的感知能力。

您也可以运行AJAX调用来获取整个列表。这将使页面加载速度快，请求数量低。最后，只有测量才能告诉你，什么在你的环境中最有效。

请注意，您不必提出4个请求，每个实体类型一个请求。例如，您可以将所有75个国家/地区放在页面中，然后加载所选国家/地区的所有内容。

相关文章：