jQuery DataTable 服务器端处理集成

Question

**"我的代码是：-我添加了 .Aspx 脚本，还包括了 JS 和 .Cs 部分。

此代码正在运行，它返回超过 70k 的结果，搜索和分页功能不起作用。

它还在加载时显示页面无响应消息。我相信它会给出这个错误作为它的 retun 70 K 结果。请帮助我使它可用。"**

<table id="dataGrid" class="widthFull fontsize10 displayNone">
         <thead>
             <tr>
                 <th>RowID</th>
                 <th>District</th>
                 <th>BlockName</th>
                 <th>VillageName</th>
                 <th>SchoolCode</th>
                 <th>SchoolName</th>
             </tr>
         </thead>
         <tbody>
         </tbody>
     </table>

                    <script type="text/javascript">
                            $(document).ready(function ()
                            {
                                $("#btnSend").click(getUserNames());
                            });
                    
                            var getUserNames = function ()
                            {
                                //$("#dataGrid").hide();
                                $("#dataGrid").DataTable({
                                    dom: 'Bfrtip',
                                    buttons: ['pageLength', 'excel', 'print'],
                                    "lengthMenu": [[100, 200, 300, -1], [100, 200, 300, "All"]],
                                    "iDisplayLength": 100,
                                    "processing": true,
                                    "serverSide": true,
                                    "sAjaxSource": '/WebApp/Login/WebService1.asmx/GetData',
                                    "bJQueryUI": true,
                                    "bDeferRender": true,
                                    "fnServerData": function (sSource, aoData, fnCallback)
                                    {
                                        $.ajax({
                                            "dataType": 'json',
                                            "contentType": "application/json; charset=utf-8",
                                            "type": "POST",
                                            "url": sSource,
                                            success: function (data)
                                            {
                                                var new_data = {
                                                    "data": jQuery.parseJSON(data.d)
                                                };
                                                fnCallback(new_data);
                                                //console.log(new_data);
                                            }
                                        });
                                    },
                                    "columns": [
                                        { "data": "RowID" },
                                        { "data": "District" },
                                        { "data": "BlockName" },
                                        { "data": "VillageName" },
                                        { "data": "SchoolCode" },
                                        { "data": "SchoolName" }
                                    ]
                                });
                            }
                        </script>

                    using PortalLib.BLL;
                        using Newtonsoft.Json;
                        using System.Collections.Generic;
                        using System.Configuration;
                        using System.Data;
                        using System.Data.SqlClient;
                        using System.Web.Services;

                        namespace CitizenPortal.WebApp.Login
                        {
                            /// <summary>
                            /// Summary description for WebService1
                            /// </summary>
                            [WebService(Namespace = "http://tempuri.org/")]
                            [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
                            [System.ComponentModel.ToolboxItem(false)]
                            // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
                            [System.Web.Script.Services.ScriptService]
                            public class WebService1 : System.Web.Services.WebService
                            {
                                public class OData
                                {
                                    public List<DataOBJ> data { get; set; }
                                }

                                public class DataOBJ
                                {
                                    public string RowID, District, BlockName, VillageName, SchoolCode, SchoolName;
                                }

                                [WebMethod]
                                public string GetData()
                                {
                                    List<DataOBJ> lst = new List<DataOBJ>();
                                    PledgeBLL m_PledgeBLL = new PledgeBLL();
                                    string scmd = "SELECT RowID,District,[Block Name] AS 'BlockName',[Village Name] AS 'VillageName', " +
                                        "[School Code] AS 'SchoolCode',[School Name] AS 'SchoolName' FROM Assam_ConsolidatedData ORDER BY RowID DESC";
                                    DataTable table = new DataTable();
                                    SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["MasterDB"].ConnectionString);
                                    SqlCommand cmd = new SqlCommand(scmd, con);
                                    con.Open();
                                    SqlDataAdapter da = new SqlDataAdapter(cmd);
                                    da.Fill(table);
                                    con.Close();
                                    da.Dispose();

                                    for (int i = 0; i < table.Rows.Count; i++)
                                    {
                                        DataOBJ d = new DataOBJ();
                                        d.RowID = table.Rows[i]["RowID"].ToString();
                                        d.District = table.Rows[i]["District"].ToString();
                                        d.BlockName = table.Rows[i]["BlockName"].ToString();
                                        d.VillageName = table.Rows[i]["VillageName"].ToString();
                                        d.SchoolCode = table.Rows[i]["SchoolCode"].ToString();
                                        d.SchoolName = table.Rows[i]["SchoolName"].ToString();
                                        lst.Add(d);
                                    }

                                    //return (new JavaScriptSerializer().Serialize(lst));
                                    return JsonConvert.SerializeObject(lst, Formatting.Indented);
                                }
                            }
                        }

Answer 1

优化问题并不那么容易诊断或解决。大多数情况下，瓶颈将发生在数据库级别。但它本身并不一定与代码相关。这可能是托管数据库的主机的问题，也可能不是。

重要性在于查询，它们的优化涵盖了如何在响应中进行总结的非常广泛的范围。

如果您可以通过某种方式详细说明问题发生的位置，那么以某种方式进行优化可能会更容易，但原则上我看不出太多可能的原因。

我会首先通过攻击数据库并观察时间来直接启动查询。

还可以尝试在使用过滤器 (WHERE) 的地方进行查询，看看是否有帮助。

编辑： 使用计时器计算时间并查看性能损失的位置。在 JS 中做：

var time1 = performance.now();

measurementFocus();

var time2 = performance.now();
console.log(time2 - time1);

记录每个部分放置计时器的时间： ajax调用前，成功时，parseJSON部分后，fnCallback后

你知道我的意思吗？然后带来结果，我们看看。