Pixi.js: https://pixijs.github.io/bunny-mark/ langsam

Wie ist es im Vergleich zu früheren Versionen?

Ja, es ist sehr optimistisch, ich habe nur einmal einen Desktop gesehen, der 100.000 multitexturierte Hasen bei 75 FPS verarbeitete. Ich habe auch 18 :)

Versuchen Sie, eine Version ohne Multitexturierung auszuführen, es gab eine Schaltfläche.

PIXI ist für "durchschnittliches" Spiel optimiert, hat aber viele Parameter, und Sie können sogar Ihren eigenen superoptimierten Renderer auf der pixi-Architektur schreiben! Wir haben 10000 animierte Kühe (jeweils ~16 Quads), bei stabilen 30FPS auf alten Grafikkarten und Intel HD. Extreme Stufe, sehr geringe CPU-Auslastung: https://www.youtube.com/watch?v=adixpp9CK_A . Je mehr Objekte ihre Koordinaten ändern, desto mehr CPU wird verwendet, und es kann Fälle verarbeiten, in denen sich alles in jedem Frame mit ausreichenden FPS bewegt. Ich hoffe, diese Gabel von Pixi in ein oder zwei Monaten veröffentlichen zu können :)

Wird dieser Fork im Master zusammengeführt, um pixi wieder großartig zu machen?

Ivan, was Sie mit Pixi erreichen, ist sehr beeindruckend. Freuen Sie sich darauf, diese Gabel zu sehen und daraus zu lernen. :)

@jeebus3000 Nein, es wird eine Produktionsgabel sein, die tiefgehende Kenntnisse von pixi und webgl erfordert.

Die Anzahl der Einstellungen wird hoch sein:

1. Geben Sie an, wie Ihr Json-Animationsformat in ein für die GPU geeignetes Binärformat konvertiert wird. Vordefiniert: nur ein Spritesheet, Flash-Animation, Wirbelsäule. Alle mit unterschiedlichen Einstellungen (Floats pro Instanz, Floats pro Quad)
2. pixi-display++: Während pixi Container hat, wird es auch Stage, Layer und Camera geben. Jedes DisplayObject hat eine Ansicht, die zu einer Ebene gehört, und für Extremfälle (gameofbombs.com) gibt es mehrere Ansichten pro Objekt.
3. updateTransform() wird nicht bei jedem Frame aufgerufen und es gibt mehr Lazy Updates als in Vanilla Pixi. Wir möchten nicht, dass 10.000 Elemente in JS aufgerufen werden, wenn sie sich nicht über die Karte bewegen.
4. Echtzeitatlanten und komprimierte Texturen. Wenn Sie ein Spiel entwickeln, müssen Sie sich ansehen, was im Videospeicher passiert und wie Atlanten gebildet werden. Atlanten werden mit speziellen Einstellungen in Texturpackern erstellt, bevor sie in das resultierende Format komprimiert werden.

@bigtimebuddy

Wie ist es im Vergleich zu früheren Versionen?

Wenn ich auf "v3.0.8" klicke, erhalte ich Folgendes:

Dito für 3.0.9, 3.0.10.

Gemeldet unter #4023.

Mit 3.0.11 bekomme ich 6fps.

Mit 4.0.0 und 4.0.1 bekomme ich 23-24fps.

Von hier an gibt es eine ständige Regression:

Mit 4.1.0 und 4.1.1 bekomme ich 20-22fps.

Mit 4.2.1 bekomme ich 19-20fps.

Mit 4.4.4 und 4.5.1 bekomme ich 16-18fps.

Ich hoffe, dass Pixi wieder schneller wird.

cc @GoodBoyDigital

@ivanpopelyshev Das ist beeindruckend! Aber ich brauche Standard-PixiJS, um extrem schnell zu sein (und meine Anwendungsfälle sehen oft wie Hasenzeichen aus).

Vielleicht gibt es einen Test (der immer ausgeführt wird), der überprüft, ob der neueste Pixi-Code genauso schnell (oder schneller) ist wie der schnellste der vorherigen Versionen.

Vielleicht sollte auch das Häschenzeichen geändert werden, um kleine Hasen mit einer einzigen Textur zu verwenden, wenn dies der Perfektion hilft. Es könnte eine Option für größere / mehrfach strukturierte (und sogar an sich animierte) Hasen geben (mit einer viel geringeren Standardanzahl). (Für diese Optionen wären zusätzliche Schaltflächen erforderlich, die derzeit nicht vorhanden sind.)

Wenn nach all dem die Standardanzahl von 100000 immer noch zu optimistisch ist, sollte sie auf einen deutlich niedrigeren Wert geändert werden, damit, wenn jemand an das PixiJS-Bunnymark gesendet wird (und es mit den Standardeinstellungen ausgeführt wird), PixiJS nicht schlecht aussieht. Anstelle der derzeit niedrigen Framerate sollten die Leute schöne und flüssige 60fps sehen.

@tobireif du hast dort nur eine Einstellung: Texturanzahl im Spriterenderer. Machen Sie einen großen Atlas 4k x 4k oder 8k x 8k und es wird viel besser sein als Multitexture.

Sie müssen testen, welche Webgl-Einstellungen Ihre Benutzer haben, ohne diese Informationen sind Optimierungen nicht möglich. Als Beispiel wissen wir, dass 99% über 4k-Texturen und ein Float-Textur-Plugin verfügen, und wir verwenden es häufig, während der Vanilla-Pixi-Renderer dies nicht tut.

In meinem Fall ist pixi wie ein Boilerplate für bessere Renderer, die für bestimmte Aufgaben geeignet sind.

@ivanpopelyshev

Texturanzahl im Spriterenderer. Machen Sie einen großen Atlas 4k x 4k oder 8k x 8k und es wird viel besser sein als Multitexture.

Wenn das Perf hilft, sollte es im PixiJS-Bunnymark implementiert werden, oder?

Von Version 4.0.1 bis 4.5.1 wurde PixiJS langsamer – die Bunnymark-Framerate stieg von 23-24fps auf 16-18fps. Dieses Problem muss behoben werden, und dann müssen Perf-Regressionen für die Zukunft verhindert werden (zB durch einen CI-Test).

In meinem Fall ist pixi wie ein Boilerplate für bessere Renderer, die für bestimmte Aufgaben geeignet sind.

Ich brauche "vanilla PixiJS", um extrem leistungsfähig zu sein, und ich vermute, dass andere Pixi JS-Benutzer dies auch tun.

Ja, wir brauchen ein weiteres Textfeld im Setup, wie "texture count:". Was 4.0.1-4.5.1 angeht, müssen wir meiner Meinung nach zuerst verstehen, ob wir die CPU oder GPU deoptimiert haben.

@tobireif , das ist ein guter Punkt! Wir sollten es wahrscheinlich mit etwas niedrigerem beginnen - vielleicht 1000? Ist das eine einfache Optimierung @bigtimebuddy?

In Bezug auf Leistung tauschen wir im Grunde mehr Flexibilität gegen Leistung. Es gibt auch in der aktuellen Version von pixi eine gewisse Voreingenommenheit bei statischen Inhalten (da sich die meisten Dinge nicht bewegen!)

Bunnymark läuft viel schneller, wenn Sie einen Partikelbehälter verwenden :)

Aber es ist ein guter Gruß, ich arbeite gerade an v5, ich werde sehen, ob wir die FPS wieder hochkriegen!

@ivanpopelyshev Ich bin in v5 zur alten Methode der 4.0.0-

@GoodBoyDigital das wird helfen. Die intelligente Texturbindung funktionierte NUR in Einzeltexturen, die Verwendung von mehreren Texturen war damit schmerzhaft.

Hey Leute, welche Version haben wir auf es6 umgestellt? Ich kenne diesen Hit ein kleines bisschen!

@GoodBoyDigital

Das Hasenzeichen ist eine Sache. Wichtig ist, dass es schnell ist, denn es soll zeigen, dass Pixi schnell ist. Und weil es ein perfektes Beispiel ist (dessen Quellen die Leute studieren und paraphrasieren könnten), sollte es alle möglichen und sinnvollen Optimierungen auf der Lib-Benutzerseite aufweisen. Und der Bunny Count sollte immer noch eine beeindruckende Zahl sein, zB 40000 oder 50000 (zB der höchste Count, der 60fps mit den in diesem Ticket erwähnten Verbesserungen und mit Pixi Version 5 auf zB meinem/Ivans Rechner bringt).

Aber unabhängig vom Bunnymark-Code muss Pixi selbst extrem schnell sein, da sind wir uns alle einig.

Ich hoffe, Sie alle können großartige Leistungen erzielen und beibehalten!

Es gibt auch in der aktuellen Version von pixi eine gewisse Voreingenommenheit bei statischen Inhalten (da sich die meisten Dinge nicht bewegen!)

Immer wenn ich Pixi benutze, bewegen sich die meisten Sachen 😀

Bunnymark läuft viel schneller, wenn Sie einen Partikelbehälter verwenden :)

Der Bunnymark-Code sollte also einen Partikelbehälter verwenden, oder?

Ich arbeite gerade an v5, ich werde sehen, ob wir die FPS wieder hochkriegen!

Groß! 👍

Ich bin mit dem angenommenen Zweck von Bunny-Mark hier nicht einverstanden. Das Ziel ist, nicht unbedingt etwas mit 60fps zu zeigen. Wir verwenden dies, um die relative Leistung von Releases/Entwicklung zu vergleichen und als Rauchtest. Solange wir keine guten Benchmarking-Methoden haben, ist dies derzeit unser bestes Werkzeug, um die Auswirkungen auf die Leistung zu messen. 100000 Bunny war beabsichtigt, den Renderer wirklich an einen Ort zu bringen, an dem er Schwierigkeiten hätte. Wenn wir zeigen wollen, wie schnell Pixi ist, ist dies nicht das Richtige für den Job. Ich hätte etwas mit ParticleCointainer geschrieben, wie ~Ivan~ Mat vorgeschlagen hat.

Wir wissen, dass es in v4.1+ einen leichten Leistungseinbruch gab, und vieles davon lag daran, dass wir die Codebasis in ES6 neu geschrieben haben, um sie wartungsfreundlicher zu machen. Das Kernteam war der Meinung, dass der kleine Leistungseinbruch den Kompromiss langfristig wert war.

Ich habe ein paar Vorschläge, wie wir das angehen könnten:

• [ ] Erstellen Sie eine sexy, benutzerfreundliche Leistungsanzeige für Pixi, vorzugsweise etwas in Beispielen. Könnte Feinkornsteuerungen zum Umschalten von Funktionen haben. Behalten Sie bunny-mark nur als internes Testwerkzeug bei.
• [ ] das Wiki für Leistungstipps weiter verbessern und möglicherweise Demos bereitstellen
• [ ] implementieren Benchmarking-Tests für Pixi, die konsistent zu messen sind
• [ ] Überprüfen Sie die Leistungseinbußen der neuesten Versionen wie oben angegeben

Dieses Problem muss behoben werden, und dann müssen Perf-Regressionen für die Zukunft verhindert werden

Natürlich müssen wir das Leistungsbenchmarking verbessern, und natürlich wäre eine Integration in CI großartig, und natürlich muss Pixi so schnell wie möglich sein. Aber wir brauchen auch Leute, die bereit sind, Zeit zu schicken, um diese sehr komplexen Probleme zu lösen. Wenn es Leute gibt, die über eine besondere Erfahrung mit Leistungs-Benchmarks für verschiedene Browser/Hardware verfügen, würden wir uns freuen, hier Beiträge zu leisten!

Was ist mit dir, @tobireif? Verfügen Sie über Expertise in diesen Bereichen? Viele Möglichkeiten sich zu verbessern. Willkommene PRs oder Bemühungen hier, ein Profil zu erstellen, bessere Tests zu erstellen, Lösungen für CI (Travis) mit webgl zu finden, binäre Suchen in der Commit-Historie auf der Suche nach negativen Performance-Beiträgen durchzuführen.

Außerdem möchte ich anmerken, dass es bunnymark in mehreren Versionen gab, aber vor ein paar Monaten habe ich @bigtimebuddy gebeten,

Ich glaube, dass die Anzahl der Texturen die einzige Aufgabe ist, die für Benchmarks entscheidend ist.

@bigtimebuddy

Danke für die Frage. Ich habe zwar Erfahrung mit Performance-Optimierung, werde aber in absehbarer Zeit leider nicht die Zeit finden, direkt an Pixi zu arbeiten. Ich hoffe, dass meine Beiträge in Form dieser (und anderer) Themenberichte trotzdem geschätzt werden (sie brauchen auch Zeit ...)

Ich verstehe jetzt, dass "pixijs.github.io/bunny-mark" für dev-interne Perf-Tests gedacht ist.

Wenn ich also jemandem die großartige Leistung von PixiJS zeigen würde (zB wenn ich Pixi für ein bestimmtes Projekt empfehle), würde ich dies http://www.goodboydigital.com/pixijs/bunnymark/ verlinken?
(statt https://pixijs.github.io/bunny-mark/ )
(Obwohl es in Zukunft möglicherweise zusätzliche Perf-Demos geben wird, mag ich das Bunnymark, und es macht die Arbeit beeindruckend.)

(Ich denke, dass es der ursprüngliche Zweck der ersten/früheren bunnymarks war, potenziellen lib-Benutzern die Leistung zu präsentieren, es wurde in GoodBoy-Blog-Posts usw. veröffentlicht, es war nicht nur dev-intern.)

Übrigens, http://www.goodboydigital.com/pixijs/bunnymark/ verwendet ParticleContainer, aber eine ältere Pixi-Version.

Nochmals an euch alle:

Danke für PixiJS!

@GoodBoyDigital

Ich arbeite gerade an v5, ich werde sehen, ob wir die FPS wieder hochkriegen!

Klingt gut! Freue mich schon

Vielleicht könnte es ein v5-Bunnymark geben (eines zur Präsentation von Pixis Leistung, wie das vorhandene v3-Bunnymark http://www.goodboydigital.com/pixijs/bunnymark_v3/ ).

Hi! Dieses Problem wird wegen Inaktivität vorerst geschlossen. Fühlen Sie sich frei, uns einen Stupser zu geben, wenn Sie möchten, dass dieses Problem wieder geöffnet wird. Danke 👍

Kein Problem

Aber es wäre trotzdem toll, wenn es immer ein Bunnymark für die jeweils neueste Version geben würde, nur um die beeindruckende Animationsleistung von PixiJS zu zeigen (etwas anderes als das von den PixiJS-lib-Entwicklern verwendete Smoke-Test-Bunnymark). . Das Verlinken einer beeindruckenden Animations-Demo wie dem bunnymark ist hilfreich, um PixiJS zu bewerben, zB in Tweets. (Das jeweils neueste Bunnymark sollte nicht langsamer sein als die vorherigen / sollte mindestens die gleiche Anzahl von Hasen bei 60fps unterstützen wie die vorherigen Bunnymarks. Es würde wahrscheinlich ParticleCointainer verwenden.)

Wenn dies für das PixiJS-Projekt in Frage kommt, öffnen Sie es bitte erneut (oder wir könnten das Obige in ein neues Ticket einfügen).

Außerdem gibt es in diesem Ticket hier verschiedene wichtige Zeilen, zB "Benchmarking-Tests für Pixi implementieren, etwas, das konsistent zu messen ist" von Matt Karl.

Verwandte: https://github.com/pixijs/pixi.js/issues/4026 .

Dieser Thread wurde automatisch gesperrt, da nach dem Schließen in letzter Zeit keine Aktivität stattgefunden hat. Bitte öffnen Sie eine neue Ausgabe für verwandte Fehler.