I am having repeater control to display grid and using bootstrap js and css for searching, sorting and paging.

it was working fine till data limit of 2500 but afterwards page is taking too much time to load so that i need to implement serverside pagination for sorting, searching and paging to reduce page load time and it will fetch only that data which are requested by user.

For the same i have searched many blogs but i didnt find any solution working for C# with bootstrap paging, sorting and searching.

Can you please help for the same?

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link href="../../../assets/css/lib/data-table/buttons.bootstrap.min.css" rel="stylesheet" />
    <link href="../../../assets/bs_table/bs_css/datatables.bootstrap4.min.css" rel="stylesheet"
        type="text/css" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="content" runat="server">
    <div class="row">
        <div class="col-lg-12 p-l-0 title-margin-left">
            <div class="page-header">
                <div class="page-title">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item "><a href="../../../Content.aspx">Dashboard</a> </li>
                        <li class="breadcrumb-item active">Supl List</li>
                    </ol>
                </div>
            </div>
        </div>
        <!-- /# column -->
    </div>
    <div id="main-content">
        <div class="row">
            <div class="col-lg-12 p-t-0">
                <div class="card">
                    <div class="card-title">
                        <h4>
                            Supl List
                        </h4>
                    </div>
                    <%--  <div>
                        <asp:Button ID="btnAdd" runat="server" Text="New Comparitive" OnClick="btnAdd_Click"
                            CssClass="btn btn-success btn-sm"></asp:Button>
                    </div>--%>
                    <%--      <br />--%>
                    <div class="card-body">
                        <div class="bootstrap-data-table-panel">
                            <div class="table-responsive">
                                <div class="w3-row">
                                    <div class="w3-col s12 text-center">
                                        <asp:Label ID="lblMessage" runat="server" ForeColor="Red" Font-Bold="true" Text=""></asp:Label>
                                    </div>
                                </div>
                                <table id="bstable" class="table table-hover table-bordered table-responsive" style="font-size: smaller">
                                    <thead>
                                        <tr>
                                            <th>SUPL CD</th>
                                            <th>SUPL NAME</th>
                                            <th>CATEGORY</th>
                                            <th>CONTACT DATE</th>
                                            <th>CLASS</th>
                                            <th>ADD</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <asp:Repeater ID="grdList" runat="server">
                                            <ItemTemplate>
                                                <tr>
                                                    <td><%#DataBinder.Eval(Container.DataItem, "SM_SUPL_CD")%></td>
                                                    <td><%#DataBinder.Eval(Container.DataItem, "SM_SUPL_NM")%></td>
                                                    <td><%#DataBinder.Eval(Container.DataItem, "SM_SUPL_CAT")%></td>
                                                    <td><%#DataBinder.Eval(Container.DataItem, "SM_CNT_DT")%></td>
                                                    <td><%#DataBinder.Eval(Container.DataItem, "SM_CLASS")%></td>
                                                    <td><%#DataBinder.Eval(Container.DataItem, "SM_ADD_TOT")%></td>
                                                </tr>
                                            </ItemTemplate>
                                        </asp:Repeater>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /# card -->
            </div>
            <!-- /# column -->
        </div>
    </div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="script" runat="server">
    <script src="../../../assets/bs_table/jquery-1.12.4.js" type="text/javascript"></script>
    <script src="../../../assets/bs_table/jquery.dataTables.min.js" type="text/javascript"></script>
    <script src="../../../assets/bs_table/dataTables.bootstrap4.min.js" type="text/javascript"></script>
    <script src="../../../assets/js/lib/data-table/dataTables.buttons.min.js" type="text/javascript"></script>
    <script src="../../../assets/js/lib/data-table/buttons.bootstrap4.min.js" type="text/javascript"></script>
    <script src="../../../assets/js/Validation.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#bstable').DataTable({
        });
    });
    </script>
</asp:Content>