In der neuen Benutzeroberfläche (UI) standen wir vor einer häufigen UI-Herausforderung: Benutzer sollten eine große Anzahl von Dateien auswählen und eine Gruppenaktion für diese Elemente ausführen können. Als Erstes kam uns die Idee, alle Dateien mit einem Kontrollkästchen daneben anzuzeigen. Dies erwies sich aus drei Gründen als problematisch: 1) Das Laden von Daten für mehr als 100,000 Elemente kann lange dauern, 2) das Rendern des DOM für mehr als 100,000 Elemente kann einen Browser zum Absturz bringen und 3) das Umschalten zwischen „Alle auswählen/abwählen“ oder das Sortieren einer Liste mit mehr als 100,000 Elementen kann sehr langsam sein.

Zunächst suchten wir in einer häufig genutzten Anwendung nach einer bestehenden Lösung und stellten fest, dass Gmail ein ähnliches Problem hat, allerdings nur mit E-Mails. In der Gmail-App können Sie in Ihrem Posteingang nicht „Alle auswählen“ auswählen. Sobald Sie jedoch die Liste der E-Mails mithilfe eines Filters eingegrenzt und alle Konversationen auf der Seite ausgewählt haben, erhalten Sie diese Benachrichtigung:

Wenn Sie auf „Alle Konversationen auswählen, die dieser Suche entsprechen“ klicken, werden alle E-Mails ausgewählt, die nach dem Suchbegriff gefiltert sind. Wenn Sie jedoch versuchen, eine E-Mail in der Liste abzuwählen, wird der Schalter „Alle auswählen“ deaktiviert. Mit anderen Worten: Das Ausführen einer Aktion für alle Elemente, die dem Filter entsprechen, mit Ausnahme einiger weniger, ist in der Benutzeroberfläche von Gmail nicht möglichIn solchen Fällen müssen Sie Ihren Filter sorgfältig einrichten, um nur die E-Mails einzuschließen, für die Sie eine Gruppenaktion durchführen möchten.

Was Gmail tat, war zwar definitiv besser, als einen Browser zum Absturz zu bringen, aber es entsprach nicht den Bedürfnissen unserer Nutzer. Auf der Rescale-Plattform wollten die Nutzer tatsächlich alle ihre Dateien löschen oder herunterladen, mit Ausnahme einiger weniger. Deshalb haben wir uns etwas ausgedacht, das wir als Einschluss-/Ausschlussregel, und so funktioniert es.

Wenn ein Benutzer die Ergebnisseite zum ersten Mal besucht, werden ihm nur die ersten 10 Dateien angezeigt (sofern nicht anders angegeben). Die Liste wird serverseitig paginiert, sodass der Browser nur die ersten 10 Dateien gleichzeitig erkennt.

Wenn der Benutzer beginnt, Dateien mithilfe eines Kontrollkästchens auszuwählen, werden die ausgewählten Dateien in den Einschlusssatz aufgenommen.

Was hier anders ist, ist die Option „Alles auswählen N Dateien“. Wenn der Benutzer auf diese Schaltfläche klickt, wird der Einschlusssatz geleert und das Flag für die Auswahl aller Dateien auf „true“ gesetzt. Ab diesem Zeitpunkt werden die Dateien, deren Auswahl der Benutzer aufhebt, in einen Ausschlusssatz aufgenommen.

Wenn der Benutzer schließlich eine Gruppenaktion ausführt, Neu skalieren Senden Sie dem Server entweder einen Einschlusssatz oder einen Ausschlusssatz, der für die Aktion verwendet werden soll.

Da Benutzer in der Vergangenheit eine bessere Möglichkeit zur Verwaltung ihrer Ausgabedateien gefordert haben, haben wir daran gearbeitet, die neue Benutzeroberfläche hilfreicher zu gestalten – insbesondere für diejenigen, die Simulationen ausführen, die eine große Anzahl von Dateien generieren.