Question

我在用户控制页面中有一个AJAX自动完成搜索，在document.ready上调用。在那里我们对Web服务进行AJAX调用，从数据库获取数据（大约90,000），将数据插入缓存，将数据返回到JavaScript并添加到数组中。

首先，每次从缓存中获取数据时，它都会从数据库中获取数据并在将数据插入缓存之后。当我们在文本框中键入内容时，它会将文本框的文本与数组匹配并显示列表。要从存储过程中获取90,000个项目，本地服务器需要2秒。

但是在实时服务器上，从存储过程中获取数据大约需要40秒。另外，从缓存中获取数据也需要相同的时间。如何减少时间并提高性能？

AJAX电话：

var locationSearchListData = [];
        var termTemplate = "<span class='ui-autocomplete-term'>%s</span>";
        var postData = '{cultureId : "DE"}';
        // Ajax call to run webservice's methods.
        $.ajax({
            url: "/asmx/SearchLocations.asmx/GetAutoCompleteSearchLocations",
            type: "POST",
            data: postData,
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (responseData) {
                if (responseData != undefined && responseData != null && responseData.d.length > 0) {
                    for (i = 0; i < responseData.d.length; i++) {
                        // Add resopnse data in location search lis, this list is used as a source for autocomplete textbox.
                        locationSearchListData.push({
                            label: responseData.d[i].locationData,
                            latitude: responseData.d[i].latitude,
                            longitude: responseData.d[i].longitude
                        });
                    }
                }

网络服务：

    [ScriptMethod]
    [WebMethod(Description = "Provides instant search suggestions")]
    public List<GeoLocationObject> GetAutoCompleteSearchLocations(string cultureId)
    {
        SqlDatabase database = new SqlDatabase(WebConfigurationManager.ConnectionStrings["MasterDB"].ConnectionString);

        string databaseName = WebConfigurationManager.AppSettings["databaseName"];
        // Key to identify location search data in cache
        string cacheKey = "auto_complete_result";
        // List to store locations 
        List<GeoLocationObject> lstGeolocationObject = new List<GeoLocationObject>();

        // If location data is present in cache then return data from cache.
        if (Context.Cache[cacheKey] is List<GeoLocationObject>)
        {
            return Context.Cache[cacheKey] as List<GeoLocationObject>;
        }
        else // If data is not present in cache, get data from db and add into cache.
        {
            // Call method GetAutoCompleteSearchLocations of LocationManager to get list of geo location object.
            lstGeolocationObject = LocationManager.GetAutoCompleteSearchLocations(database, cultureId);

            // Checking if lstGeolocationObject is not null
            // If its not null then adding the lstGeolocationObject in the cache
            if (lstGeolocationObject.Count > 0)
            {
                // Add locationdata in cache.
                // Removed sqlcache dependency.
                Context.Cache.Insert(cacheKey,
                                    lstGeolocationObject,
                                    null,
                                    Cache.NoAbsoluteExpiration,
                                    Cache.NoSlidingExpiration,
                                    CacheItemPriority.NotRemovable,
                                    null);
            }

            // Return geolocation data list
            return lstGeolocationObject;
        }

    } // GetAutoCompleteSearchLocations

Answer 1

自动完成工具的主要目的是缩小搜索范围并仅将几乎匹配的记录放在前面，以方便用户选择他想要的确切记录。如果可能，尝试添加debounceTime（）。其他选项是微调sql查询，实现服务器端分页并在浏览器中检查页面呈现时间。

Answer 2

很抱歉我迟到的回复。感谢所有帮助我找到解决方案。

我们通过在ajax调用中进行一些更改来解决问题。我们将搜索文本发送为：

    // set auto complete textbox
    $("#<%= txtOrtOderPlz.ClientID%>").autocomplete({            
    // Set required minimum length to display autocomplete list.
    minLength: 3,

    // Set source for textbox, this source is used in autocomplete search. 
    source: function (request, response) {      
    // Ajax call to run webservice's methods.
    $.ajax({
       url: "/asmx/SearchLocations.asmx/GetAutoCompleteSearchLocations",
       type: "POST",
       data: '{ searchText :\'' + request.term + '\' }',
       dataType: "json",
       contentType: "application/json; charset=utf-8",
       Success: function (responseData) {                                                     
       response(responseData.d);
   },
   error: function (XMLHttpRequest, textStatus, errorThrown) {                        
   }
   });
   },

每当我们搜索任何内容时，它都会搜索文本并调用Web服务，将搜索文本发送到SP，从SP获取数据并显示在自动完成搜索中。

自动完成搜索需要很长时间才能从服务器检索数据

AJAX电话：

网络服务：

2 个答案: