Erhöhung der RPS auf Nuxt.js / Sudo Null IT News

Wir alle wissen, dass nuxt.js 2 (und jede node.js-Anwendung mit SSR) die Last ohne Cache nicht beibehält. Wenn Sie den SSR-Modus aktivieren, werden bei einem durchschnittlichen Projekt 20-30 RPS beibehalten, was sehr gering ist.

Standardlösungen bestehen darin, ein paar Pakete irgendeiner Art von Cachern zu verbinden und jede Seite oder Anforderung zwischenzuspeichern. Im Allgemeinen hilft dies sehr.

Es gibt 3 Probleme, auf die ich bei dem Projekt gestoßen bin, und ich möchte die Situation stabilisieren. Um der Anwendung eine weitere Chance zu geben, zumindest ohne SSR zu laufen.

  1. Langsame API-Antworten, es kommt vor, dass der Rücken etwas nicht bereitgestellt hat und die Anfragen auf dem Prod langsam wurden.

  2. JS-Fehler im SSR-Modus, und es gibt keine solchen Fehler im Browser. Zugelassen wegen Fahrlässigkeit oder aus anderen Gründen.

  3. Eine große Last während DDOS, wenn wir in den RAM oder den Prozessor laufen, müssen wir den SSR-Modus deaktivieren und dem Client einen Dummy geben, damit er im Browser starten kann.

Nachdem wir mit den Entwicklern gesprochen hatten, kamen wir zu einigen Regeln, denen die SPA-Anwendung folgen sollte:

  • Deaktivieren Sie SSR bei langsamer Seitenwiedergabe. Delegieren Sie das Rendern an den Browser.

  • Downgrade sollte nicht im ganzen Spa sein, sondern nur dort wo es ein Problem gibt.

  • Bei starker Auslastung und wenn das Rendering immer langsamer wird, müssen Sie dies überwachen und SSR für eine Weile in der gesamten Anwendung ausschalten und nach einer Weile automatisch wieder einschalten.

  • Deaktivieren Sie SSR zwangsweise auf einigen Seiten, auf denen es nicht benötigt wird, um den Server nicht zu belasten.

  • Fügen Sie Cache und Speicher hinzu, um sie in Redis zu behalten

Ich habe im Allgemeinen ein Modul geschrieben, das dies alles automatisch erledigt. Um den maximalen Effekt zu erzielen, müssen Sie auch ein Caching-Modul hinzufügen (z. B. nuxt-ssr-cache).

npm install @drozd/nuxt-performance

Gehen Sie als Nächstes zu nuxt.config.js

module.exports = { performance: { // Anfragezeiten protokollieren renderRouteTimeCallback: (route, ms) => { console.log(`render route time: ${route} ${ms} ms`); }, // SSR auf den benötigten Routen deaktivieren isOnlySPA: (route, _context) => { return route === ‘/personal’; }, // Anzahl der zulässigen ms für das Rendern mit SSR maxRenderTime: 1000, // Anzahl der Versuche, SSR zu rendern, wenn das Rendern langsam ist, // dann für die angegebene Zeit ausschalten timeDisabledSsrWithRoute maxAttemptSsr: 5, // RegExp-Ausnahmeseiten für die Modul als Ganzes excludeRoutes: /healthcheck/, // wie lange wir ssr für die Seite deaktivieren timeDisabledSsrWithRoute: 1000 * 60, // Intervall zum Löschen des Gesamtzählers, wenn SSR auf der gesamten Seite deaktiviert wurde clearSlowCounterIntervalTime: 1000 * 60 * 5 , // Gesamtzahl langsamer Anfragen auf der Seite, dann SSR überall deaktivieren maxSlowCount: 50 } // … };

Nachdem wir dieses Modul implementiert und das Caching aller Seiten auf 10 Sekunden eingestellt haben, haben wir eine Erhöhung der RPS um das ~15-fache erreicht, von 30 auf 500, das Ergebnis ist schwebend, abhängig von den von den Administratoren zugewiesenen Ressourcen 🙂

Repository https://github.com/gustoase/nuxt-performance

Wenn Sie Erfahrung in der Optimierung haben, schreiben Sie, es wird für alle nützlich sein)

Similar Posts

Leave a Reply

Your email address will not be published.