Als ich anfing, an meinem aktuellen Projekt zu arbeiten, wurde mir eine ziemlich mühsame Aufgabe gestellt - etwas zu bauen, das im Grunde genommen große Tabellenkalkulationsprogramme ersetzen soll, die in meinem Unternehmen verwendet werden.

Deshalb dachte ich, ein paginierter Tisch würde niemals funktionieren, und ehrlich gesagt finde ich Paginierung dumm. Das Anzeigen sich dynamisch ändernder Daten in einer paginierten Tabelle ist lahm. Angenommen, ein Element auf Seite 2 mit der nächsten Datenaktualisierung kann auf einer beliebigen Seite landen.

So mussten wir ein Gitter mit einer schönen unendlichen Schriftrolle bauen. Versteh mich nicht falsch, ich habe viele verschiedene Lösungen ausprobiert. Zuerst habe ich ein Vanille-Ng-Repeat-Ding gebaut und es mit @ versuch ng-infinite-scroll, und dann ng-scroll von UI.Utils. Das brachte mich schnell an den Punkt, an dem das Scrollen schmerzhaft langsam wurde, und ich hatte noch nicht einmal verrückte Sachen wie komplizierte Zellvorlagen benutzng-ifs oder Filter. Sehr bald wurde Leistung mein größter Schmerz. Als ich anfing, Dinge wie veränderbare Spalten und benutzerdefinierte Zellvorlagen hinzuzufügen, konnte kein Browser mehr mit all diesen Bindungen umgehen.

Dann habe ich versucht ng-grid, und anfangs gefiel es mir irgendwie - einfach zu bedienen, es hat ein paar nette Funktionen, die ich brauchte, aber bald wurde mir klar, dass ng-grid schrecklich ist. Die aktuelle Version ist vollgestopft mit Fehlern. Alle Mitwirkenden haben aufgehört, diese zu beheben, und sind zur Arbeit an einer nächsten Version übergegangen. Und nur Gott weiß, wann das einsatzbereit sein wird. ng-grid erwies sich als ziemlich viel schlimmer als Vanille ng-repeat.

ch habe immer wieder versucht, etwas Besseres zu finden. trNgGrid sah gut aus, aber viel zu simpel und bietet keine Funktionen, nach denen ich sofort gesucht habe.

ng-table sah nicht viel anders aus als ng-grid, wahrscheinlich hätte es die gleichen Leistungsprobleme verursacht.

Und natürlich musste ich einen Weg finden, um die Bindungen zu optimieren. Versucht einmal binden - war nicht zufrieden, das Gitter war immer noch träge. (upd: Angular 1.3 bietet{{::foo}} Syntax für einmaliges Binden)

Dann habe ich versucht zu reagieren. Das anfängliche Experiment sah vielversprechend aus, aber um etwas komplizierteres zu bauen, muss ich etwas über die Besonderheiten von React lernen. Außerdem fühlt sich das Ding irgendwie nicht anguleresk an und wer weiß, wie man mit Angular + React gebaute Direktiven testet. Alle meine Bemühungen, gute automatisierte Tests zu erstellen, scheiterten. Ich konnte React und PhanthomJS nicht dazu bringen, sich zu möge (Das ist wahrscheinlich mehr Phantoms Problem. Gibt es einen besseren Browser ohne Kopf?) Außerdem löst React das Problem "An DOM anhängen" nicht - wenn Sie neue Elemente in das Datenarray verschieben, blockiert der Browser für einige Millisekunden den UI-Thread. Das ist natürlich eine ganz andere Art von Problem.

Mein Kollege (der auf der Serverseite arbeitet) murrte, nachdem er meine Kämpfe gesehen hatte, dass ich bereits zu viel ausgegeben hatte, um Leistungsprobleme zu lösen. Er hat mich dazu gebracht, @ zu versuch SlickGrid, erzähl mir Geschichten, wie dies das beste Gitter-Widget ist. Ich habe es ehrlich ausprobiert und wollte schnell meinen Computer brennen. Das Ding hängt komplett von jQuery und einigen anderen jQueryUI-Plugins ab und ich weigere mich, plötzlich in die mittelalterliche Zeit der Webentwicklung zurückzukehren und jede Winkelgüte zu verlieren. Nein danke

Dann kam ich vorbei ux-angularjs-datagrid, und es hat mir wirklich sehr, sehr gut gefallen. Es verwendet einen intelligenten Bad-Ass-Algorithmus, um die Dinge sehr reaktionsschnell zu halten. Das Projekt ist jung, sieht aber vielversprechend aus. Ich war in der Lage, ein einfaches Raster mit vielen Zeilen (ich meine eine große Anzahl von Zeilen) zu erstellen, ohne zu sehr vom eckigen Zen abzuweichen und trotzdem reibungslos zu scrollen. Leider handelt es sich nicht um eine vollständige Lösung für Raster-Widgets. Die Größe von Spalten und anderen Elementen wird nicht sofort geändert, die Dokumentation fehlt etwas usw.

Auch ich fand diesesArtike, und hatten gemischte Gefühle, diese Jungs wendeten ein paar nicht dokumentierte Hacks auf eckige an und höchstwahrscheinlich würden diese mit Feature-Versionen von eckigen brechen.

Natürlich gibt es mindestens ein paar kostenpflichtige Optionen wie Wijmo und Kendo UI. Diese sind mit Angular kompatibel, die gezeigten Beispiele sind jedoch recht einfache, paginierte Tabellen, und ich bin mir nicht sicher, ob es sich lohnt, sie einmal auszuprobieren. Ich könnte am Ende die gleichen Leistungsprobleme haben. Außerdem kann man nicht selektiv nur für das Grid-Widget bezahlen, sondern muss die gesamte Suite kaufen - voller Scheiße, die ich wahrscheinlich nie benutze.

So, endlich zu meiner Frage - gibt es eine gute, garantierte, weniger schmerzhafte Möglichkeit, ein schönes Gitter mit unendlichem Scrollen zu haben? Kann jemand auf gute Beispiele, Projekte oder Webseiten verweisen? Ist es sicher, ux-angularjs-datagrid zu verwenden oder besser, mein eigenes Ding mit angle zu bauen und zu reagieren? Hat jemand jemals Kendo oder Wijmo Grids ausprobiert?

Bitte! Stimmen Sie nicht dafür, diese Frage zu schließen, ich weiß, dass es viele ähnliche Fragen zum Stackoverflow gibt, und ich lese fast jede einzelne davon durch, aber die Frage bleibt offen.