Question

我有一个列出了许多代理商的页面。列表中的每个代理商旁边都有代理商类型下拉列表。

我在我的控制器方法中设置了我的视图：

var agenciesViewModel = new AgencyViewModel
    {
        Agencies = _agenciesRepository.Agencies.ToList(),
        AgencyTypes = _agencyTypesRepository.AgencyTypes.ToList()
    };

return View("Agencies", agenciesViewModel);

在我的机构视图中：

<table cellpadding="0" cellspacing="0">    

    @foreach (Agency agency in Model.Agencies)
    {
    <tr>
        <td><b>@agency.Name</b></td>
        <td>
            @Html.DropDownList("AgencyTypes" + agency.ID,
                new SelectList(Model.AgencyTypes, "AgencyTypeID", "Name"))
        </td>
    </tr>
    }
</table>

问题在于，在这个特定页面上，我列出了大约500个代理商，这意味着500个下拉列表。大约有2000种代理商类型。

这会导致初始页面加载时出现性能问题，加载页面大约需要2分钟。几乎看起来它每次循环通过代理商时都会从数据库中检索AgencyTypes集合。

页面加载后也会导致性能问题 - 如果我点击其中一个下拉列表，打开列表大约需要15秒。我发现这很奇怪，因为所有数据都已加载，但由于某种原因，它会导致我的浏览器出现性能问题。

我是否正确设置了这些下拉列表，还是有更好的方法可以提高性能？

Answer 1

问题是双重的：

500个代理商* 2000个代理商类型= 1,000,000 <option>已下载，其中大多数是重复的
下载代理机构和代理机构类型还需要下载许多<td>，<select>和<option>代码以及数据。

您可以通过使用Ajax将代理商和代理商类型下载为json数据，然后动态构建表来缩短下载时间。

您的控制器操作应返回最少的信息以加载骨架视图。
在您看来，使用javascript和Ajax从您的控制器下载代理商和代理商类型列表。
根据下载的json数据构建您的<table>和<select>。

这样，您不仅可以减少下载数据的开销，还可以下载一次2000个代理类型。

至于您打开下拉列表的延迟，这可能是因为它们中有2000个条目。正在使用的浏览器，版本，操作系统，都可能是此问题的因素。

多个DropDownLists的性能问题

1 个答案: