1. Home
  2. Forum
  3. ASP.NET MVC
  4. Grid Rendering Taking time

Grid Rendering Taking time

Hi,

While rendering Grid in AspNet MVC the 1st time, it take long time.

Is there a way to reduce this?

regards
A R Mohan     

1 Reply
VA Venkatesh Ayothi Raman Syncfusion Team October 11, 2017 11:07 AM UTC

Hi Mohan, 

Thanks for contacting Syncfusion support. 
Maybe scripts and CSS files size cause this problem. The following two ways to reduce the time while initial Grid rendering,  
Compress the ZIP file using GZIP  
   
We suggest you to use GZip. If you use the GZip for compressing the file size, you will have optimal solution in the production server. Please refer to the documentation for information on GZip.    
   
   
Referring Grid dependent files alone:     
   
We can also refer individual files for rendering the Grid control instead of referring the ej.web.all.min.js file. Please refer to the below documentation, where we have listed out the dependent files for rendering the Grid control. Because its reduce the file size and also reducing the load time while page gets again build. Please refer to the Help documentation for more information,  
 
 
We can find the above mentioned files from the below mentioned installed location.     
Script Location:      
C:\Program Files (x86)\Syncfusion\EssentialStudio\XX.X.X.XX\JavaScript\assets\scripts\web     
     
Here, XX.X.X.XX denotes the Product Version such for example, 15.3.0.33       

Also, we suggest you to use the CSG scripts.  
 
   
  
custom script generator is used to generate scripts and themes for only dependent Control .  
 

If you are bounding the large remote data source to Grid with offline property as true. In this case, we have bounded the whole records at initial loading. This is the reason while Grid takes more time at initial loading to bound a record. 
We suggest you to use URL adaptor to get the data from server side. In this, we can fetch the set of records from Grid using URL adaptor feature. In this feature works like load on demand concept. For example, if we set PageSize as 50 then it will get the 50 records from server side and displaying it. And then if we click next page another set of 50 records gets from server side. Please refer to the code example and Help document, 
Code example: 
@Grid 
@(Html.EJ().Grid<object>("FlatGrid") 
 
                      .Datasource(ds => ds.URL(@Url.Action("DataSource")) 
                            .Adaptor(AdaptorType.UrlAdaptor)) 
            .AllowPaging()    /*Paging Enabled*/ 
             
            .PageSettings(p=>p.PageSize(50)) 
. . . 
                     
 
        .Columns(col => 
                             { 
. . . 
                             }) 
    ) 
 
@Server side 
 
public ActionResult DataSource(DataManager dm) 
        { 
            IEnumerable data = OrderData; 
            DataOperations operation = new DataOperations(); 
            if (dm.Sorted != null && dm.Sorted.Count > 0) //Sorting 
            { 
                data = operation.PerformSorting(data, dm.Sorted); 
            } 
            if (dm.Where != null && dm.Where.Count > 0) //Filtering 
            { 
                data = operation.PerformWhereFilter(data, dm.Where, dm.Where[0].Operator); 
            } 
            int count = data.Cast<OrdersView>().Count(); 
            if (dm.Skip != 0) 
            { 
                data = operation.PerformSkip(data, dm.Skip); 
            } 
            if (dm.Take != 0) 
            { 
                data = operation.PerformTake(data, dm.Take); 
            } 
            return Json(new { result = data, count = count }); 
        } 


Also, you can perform the Grid actions such as Paging, Filtering and Sorting in server side as well as we have already created a knowledge base documentation for this, 

We have also created a sample for your convenience which can be download from following link, 

Regards, 
Venkatesh Ayothiraman. 


Loader.
Up arrow icon