![]() ![]() We will be using Entity Framework Core – Code First Approach as our Data Access Layer. This JQuery Datatable will have the Server Side Processing Property enabled and perform AJAX calls to receive page data from our API. We will use JQuery Datatable Library to list all the Customer Records from the Customer API (We will fill this source with some random data). In this implementation, We will be using an ASP.NET Core 3.1 Web Application Project Template. WIth JQuery Datatable, life is easier for a developer □ What we’ll Build? Since this is a client-side library, various tech-stack developers use this Powerful Open Source Plugin to handle everything related to viewing / manipulating data on HTML Tables.Īs the JQuery Datatable runs at the client browser, you really don’t have to code extra to enable searching, sorting, paging which would otherwise take up hours of development time. Why do you need JQuery Datatable in ASP.NET Core?Ī quick answer to this would be, ‘ASP.NET Core does not ship with any default HTML Tables along with the tons of features that jQuery Datatables can provide’. In this article we will be implementing Server Side Processing in our ASP.NET Core Application. But when the Records count cannot be anticipated or has the potential to reach thousands or even Millions, it is very much advisable to use Server Side Processing. If you have less than 5,000 records, Client-Side Processing gets the job done efficiently. You would still want to use Client-Side Processing if you think that your data record count does not go above 5,000 or 10,000. Now, there is nothing against Client-Side Processing. Get the advantage? So, this approach is also known as Server-Side Processing in JQuery Datatable. So, with every page, the JQuery Datatable would request for the next set of ~50 records. With this approach, you are drastically improving the load time (as the JQuery Datatable is loading just ~50 records instead of 10,000+ records), reducing the CPU and bandwidth usage. Instead, send the 10,000 records in chunks, in small paged units that may contain like 50 records a page. ![]() ![]() What it exactly means is, You do not have to send 10,000 records in one go from the API to the Browser. What can be a better approach? Apply Paging on the Server Side, right? In cases where the number of records present in the Customer SQL Table is way above 10,000 or more, it is not ideal to send all the data back to the browser, right? What would the browser do with 10,000 records at a single time? That’s a wastage of resources and bandwidth. This is known as client-side processing.īut what happens when the N factor is like 10,000 or more? In this case, what happens, the API sends back all the Customer records (~1000 Records) in JSON format directly to the JQuery Datatable which then takes it as a data source and ultimately renders the HTML Table. If N was, let’s say 100-1000, it can be easily handled by the Browser. In context with our tutorial, this is one of the most important concept in JQuery Datatable. Server Side Processing vs Client Side Processing That said, it a highly flexible and powerful plugin. The Core Features that come along with JQuery Datatable are searching, sorting, pagination, JSON formatted source data, blazing-fast load times, server-side processing, client-side processing, and more. JQuery Datatable is one of the most popular jQuery plugins that help create HTML tables and add a whole lot of interactive events to them. Installing the Required Client-Side Libraries. ![]()
0 Comments
Leave a Reply. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |