java - 对加载最多约 30,000 条记录的相关下拉列表的性能影响

Question

这是场景:

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

• 国家/地区:75
• 州:1,000
• 师:3,000
• 村庄:30,000

数据存在于 4 个 HashMap 中，例如:

 - 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 个 HashMap ，并根据之前下拉列表的选择在下拉列表中显示值:`

$("#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 调用以填充后续下拉列表中的值。

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

Answer 1

Here, populating values in dropdown is handled in the javascript itself. I did this to reduce the number of hits on server.But given the large number of records in the hashmaps, is it the correct way to populate data in the dropdowns?

我敢打赌这是个好主意

• 国家/地区:75

也许

• 州:1,000
• 甚至可能有 3,000 个师

但是

• 不适用于村庄:30,000

Should I do an AJAX call each time a value is selected in a dropdown to populate the values in subsequent dropdown.

我愿意这么做。每个子列表都是静态资源，无需计算，并且可以很快提供服务。如果幸运的话，调用时间大约为 50-100 毫秒，即远低于人类感知。

您还可以运行 AJAX 调用来获取整个列表。这将使您的页面加载速度更快并且请求数量更少。最后，只有测量才能告诉您什么最适合您的环境。

<小时/>

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