JSON-Array macht die Website langsam. AngularJS

Question

ich ein MVS-Projekt, wo ich eine AJAX verwenden, um ein Array abzurufen ... Die folgende meiner Klasse auf C# ist ... abrufen ich eine Liste von 19.500 Aufzeichnungen ... im Grunde ziehe ich eine 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; 
    } 

Allerdings habe ich zwei Dinge bemerkt ... bei der Verwendung von Haltepunkten habe ich festgestellt, dass es nach dem Drücken von Return ungefähr 10 Sekunden dauert, bis AngularJS den Haltepunkt erreicht, wenn die Daten empfangen werden. Das zweite Problem ist, dass, wenn die Seite mit allen Daten fertig ist ... die gesamte Website ist eher langsam ... zum Beispiel .. Sie tippen auf ein Textfeld, und alles erscheint von 0,5 bis 4 Sekunden nach der Eingabe ... was mich führt zu glauben, dass diese Anordnung von 19.500 Elementen zu viel Speicher verbraucht ...

Es ist erforderlich, dass alle Lieferanten auf dem ersten Bildschirm angezeigt werden, also gibt es keine Möglichkeit, diese Anforderung umzukehren.

Irgendwelche Tipps? Welche Tricks könnten auf dem MVC-Controller durchgeführt werden, um schneller zum Frontend zu gelangen und zu verhindern, dass die Site langsamer wird?

Answer 1

Laden und Rendern 19.000 ist in keiner Weise für mich lebensfähig. Auch ich habe gerade an einer Anwendung gearbeitet, bei der ein Kunde alle seine Produkte verwalten muss (15.000+). Die anfängliche Implementierung wurde mit Paginierung durchgeführt, für die Antwort löste es wirklich schön für mich. Aber eine elegantere Lösung ist die Implementierung einer Art von infinite-scroll Mechanismus, für den ich ngInfiniteScroll (https://sroze.github.io/ngInfiniteScroll/) verwendet habe. Jetzt löst dies einen Teil des Problems für Sie, und das ist Ihre Seite langsam wegen der massiven HTML-Renderings, aber in keinem Fall ist 19.000 Elemente vom Server in einem Schuss abrufen eine gute Idee. Nicht nur, dass es die Datenbank immens hervorhebt, sondern auch, wenn es auf einem Live-Server gehostet wird, werden Sie eine beträchtliche Verzögerung sehen, wenn die Anfrage nach den Daten gemacht wird. Ich schlage vor, Ihre Daten 20, 30, 100 auf einmal zu ziehen. Dafür sollte myPagingFunction von ngInfiniteScroll genau der richtige Ort sein, um zu implementieren.