0

I have an MVS project where I use an AJAX to retrieve an array... The following is my class on C#... I retrieve a list of 19,500 records... basically I pull an IEnumerable

public partial class VW_Suppliers
{
    public int SupplierID { get; private set; }
    public string Name { get; private set; }
    public int SolarNumber { get; private set; }
    public bool TpiClassification { get; private set; }

    public int ValueStreamID { get; private set; }
    public string ValueStream { get; private set; }

    public int StatusID { get; private set; }
    public string Status { get; private set; }

    public string SupplierCode { get; private set; }
    public int PurchaseSystemID { get; private set; }
    public string PurchaseSystem { get; private set; }

    public int AddressID { get; private set; }
    public int AddressTypeID { get; private set; }
    public string AddressType { get; private set; }
    public string Street1 { get; private set; }
    public string Street2 { get; private set; }
    public string PoBox { get; private set; }
    public string City { get; private set; }
    public string PostalCode { get; private set; }
    public int StateID { get; private set; }
    public string StateCode { get; private set; }
    public string State { get; private set; }
    public int CountryID { get; private set; }
    public string CountryCode { get; private set; }
    public string Country { get; private set; }
}


    [HttpGet]
    public ActionResult GetSuppliersData()
    {
        JsonObject jsonObject;
        IEnumerable<ViewSupplierVM> suppliers = _supplierService.GetAllSuppliers();

        JsonResult jsonResult = Json(suppliers, JsonRequestBehavior.AllowGet);
        jsonResult.MaxJsonLength = int.MaxValue;

        return jsonResult;
    }

However, I noticed two things... when using breakpoints I noticed that after I hit return... it takes around 10 seconds for AngularJS to hit the breakpoint when the data is received. Second problem is that whenever the page is ready with all data... the overall site is rather slow... for instance.. you type on a textbox, and everything appears from 0.5 to 4 seconds after typing... which leads me to believe that that array of 19,500 elements is consuming to much memory...

It is required that all suppliers appear on the first screen, so there is no way to turn this requirement around.

Any tips? What tricks could be done on the MVC controller to send to front end faster and prevent site from being to slow?

Victor
  • 1,108
  • 9
  • 29
  • 53
  • Jesus, 19000 in one go. That will scale well. Paginate, infinite scroll, api's that have a skip take mechanism. – ste2425 May 20 '16 at 21:44

1 Answers1

0

Loading and rendering 19,000 is in no way viable to me. I too just worked on an application in which a customer would need to be able to manage all their products (15,000+). The initial implementation was done using pagination for which this answer solved it out really nicely for me. But a more elegant solution is to implement some type of infinite-scroll mechanism, for which I have used ngInfiniteScroll (https://sroze.github.io/ngInfiniteScroll/). Now this solves one part of the problem for you, and that is your page being slow due to massive HTML renders, but in no case retrieving 19,000 items from the server in one shot is a good idea. Not only it stresses the database immensely, but if hosted on a live server you shall see quite a significant delay when the request for the data is made. I suggest pulling your data 20, 30, 100 at a time. For this myPagingFunction from ngInfiniteScroll should be just the right place to implement.

Community
  • 1
  • 1
iuliu.net
  • 6,666
  • 6
  • 46
  • 69