> ## Documentation Index
> Fetch the complete documentation index at: https://docs.appsignal.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Browser monitoring

> Was AppSignal über die Browser Ihrer Nutzer meldet und wie Front-end-Fehler und web vitals dargestellt werden.

<Note>
  Browser monitoring ist ein Beta-Feature von [AppSignal Labs](/labs). Das Paket
  `@appsignal/browser` wird unter dem `beta`-Tag auf npm veröffentlicht, und
  seine Konfiguration und API können sich zwischen Beta-Releases noch ändern.
  Teilen Sie Ihr Feedback in unserer
  [Discord-Community](https://discord.gg/EjF6ykYx63).
</Note>

Browser monitoring meldet, was in den Browsern Ihrer Nutzer passiert: Front-end-Fehler, jeweils mit der Ereigniskette, die zu ihnen geführt hat, und web vitals, gemessen an echten Seitenaufrufen.

Ihre Back-end-Telemetrie kann Fragen wie diese nicht beantworten:

* Nach einem Deploy stoßen einige Nutzer auf `Failed to fetch dynamically imported module`, während Ihre eigenen Tests sauber bleiben. Welches Release hat das eingeführt, und was hat der Nutzer dabei getan?
* Ihre traces zeigen, dass der Server in 80 ms antwortet, aber Nutzer sagen weiterhin, das dashboard fühle sich langsam an. Geht die Zeit irgendwo im Browser verloren?
* Sie haben gestern eine Änderung an Ihrem JavaScript-Bundle ausgeliefert. Sind die Seiten, auf denen Ihre Nutzer die meiste Zeit verbringen, langsamer geworden?

Browser monitoring ist ein eigener Bereich Ihrer Anwendung in AppSignal, mit zwei Ansichten:

* [Errors](/browser-monitoring/errors) gruppiert Front-end-Fehler zu Issues, die Sie triagieren, zuweisen und für die Sie sich benachrichtigen lassen können.
* [Performance](/browser-monitoring/performance) meldet web vitals pro Route, damit Sie Releases vergleichen und die Seiten finden, die Arbeit brauchen.

<h2 id="what-the-sdk-collects">
  Was das SDK erfasst
</h2>

Browser monitoring wird von [AppSignal für Browser](/browser) gespeist, dem Paket `@appsignal/browser`, das Sie Ihrem Front end hinzufügen. Nach der Initialisierung erfasst es ohne weitere Einrichtung drei Dinge:

* [Errors](/browser/error-tracking) sind die JavaScript-Fehler, die Ihr Code auslöst, ohne sie abzufangen, einschließlich fehlgeschlagener Promises. Jeder Fehler kommt mit einem Stacktrace und allen Tags an, die Sie gesetzt haben.
* [Breadcrumbs](/browser/breadcrumbs) sind eine Zeitleiste dessen, was vor einem Fehler passiert ist: die Seiten, die der Nutzer geöffnet hat, was er ausgewählt hat, welche Requests die Seite gestellt hat und was die Konsole protokolliert hat.
* [Web vitals](/browser/web-vitals) sind fünf Messwerte dafür, wie sich die Seite bei der Nutzung anfühlt. Wie lange sie zum Laden braucht, wie schnell sie reagiert und ob das Layout beim Laden umherspringt.

Die SDK-Dokumentation beschreibt Installation und Konfiguration und was jeder dieser Punkte genau enthält. Dieser Abschnitt beschreibt, was AppSignal damit macht.

<h2 id="how-it-relates-to-your-back-end-errors">
  Wie es sich zu Ihren Back-end-Fehlern verhält
</h2>

Front-end-Fehler werden an den `browser`-[namespace](/guides/namespaces) gemeldet, wodurch sie aus Ihren Back-end-Fehlerlisten und deren Benachrichtigungseinstellungen herausbleiben. Das ist der Grund, warum browser monitoring ein eigener Bereich ist und kein Filter auf Ihren bestehenden Fehlern: Eine Front-end-Entwicklerin öffnet eine Ansicht, die Front-end-Arbeit und nichts anderes enthält, statt eine Ansicht einzuschränken, die für das Debuggen serverseitiger Probleme gebaut wurde.

Ansonsten sind es gewöhnliche Issues: Gruppierung, Triage und Benachrichtigungsmodell sind dieselben, die [Errors](/errors) überall sonst in AppSignal verwendet.

Web vitals sind getrennt von Ihren Back-end-Daten zu [Performance und Tracing](/performance-tracing). Ein Browser misst, wie lange eine Seite gebraucht hat, um nutzbar zu werden. Ein trace misst, was Ihr Server getan hat. Wenn dieselbe Route in beiden langsam ist, sehen Sie ein Problem von zwei Seiten.

<h2 id="two-settings-worth-getting-right">
  Zwei Einstellungen, die Sie richtig setzen sollten
</h2>

Diese beiden Entscheidungen bestimmen, wie nützlich die Daten sind:

* **Melden Sie das Route-Template.** Sagen Sie AppSignal, dass der Nutzer auf `/orders/:id` ist, nicht auf `/orders/1042`. Fehler und web vitals werden beide nach der Route gruppiert, die Sie melden. Ohne Template werden aus tausend Bestellungen tausend einzelne Routen, und aus einem Bug tausend Issues. Mehr dazu unter [Die aktuelle Route melden](/browser/installation#report-the-current-route).
* **Setzen Sie eine App-Version.** Beide Ansichten können nach der Version filtern, die die Daten gemeldet hat. So erkennen Sie, ob ein Release etwas verschlechtert hat. Mehr dazu unter [`appVersion`](/browser/configuration#appversion).

Die vollständige Liste dessen, was aufgezeichnet wird, und wie Sie Kategorien abschalten, finden Sie auf der [Breadcrumbs-Seite](/browser/breadcrumbs).