> ## Documentation Index > Fetch the complete documentation index at: https://docs.germainux.com/llms.txt > Use this file to discover all available pages before exploring further. # Angular Operational Experience Intelligence > GermainUX provides real-time user experience monitoring, Session Replay, JavaScript analysis, and synthetic testing for Angular and AngularJS applications. Components [`Engine`](https://docs.germainux.com/main/germain-ux-engine) [`JS Profiler`](https://docs.germainux.com/main/germain-ux-js-profiler) [`Mobile App`](https://docs.germainux.com/main/germain-ux-mobile-app) [`RPA Bot Recorder`](https://docs.germainux.com/main/germain-ux-rpa-bot-recorder) [`RUM JS`](https://docs.germainux.com/main/germain-ux-rum-js) Availability 2017.1 or later > [card] [Real User Monitoring](#real-user-monitoring) > > Segment real user experience > [card] [JavaScript Error Monitoring](#javascript-error-monitoring) > > Catch Angular handled failures > [card] [User Feedback](#user-feedback) > > Link feedback to technical causes > [card] [Privacy and Security](#privacy-and-security) > > Pre-release privacy checklist ## Angular Application Observability ## Overview GermainUX provides real-time user experience monitoring, Session Replay, JavaScript analysis, business-process monitoring, synthetic testing, and application observability for Angular and AngularJS applications. It helps teams understand: * How users interact with the application * Which routes, features, and workflows are used * Where users encounter errors or poor performance * Why business processes fail or are abandoned * Which browsers, devices, releases, and user groups are affected * Whether the cause is in the browser, network, API, integration, backend, or infrastructure GermainUX can monitor modern Angular single-page applications and legacy AngularJS applications. The available detail depends on the application architecture and deployed GermainUX components. ## Real User Monitoring GermainUX RUM JS captures the experience of real users, including: * User sessions * Initial page loads * Single-page application route changes * Clicks and other user actions * Navigation paths * User-action response time > [accordion] Show all 11 > > * Browser and JavaScript errors > * Network requests > * Resource loading > * Browser, device, location, and application context > * Custom events and transactions Telemetry can be segmented by: * Application and environment * Route or view * User or role * Browser and device * Region * Application release * Business process * Error or performance condition ## Session Replay Session Replay reconstructs captured user activity so teams can investigate what occurred before an error, slow interaction, failed transaction, or abandoned workflow. Replay can help identify: * Navigation and usability problems * Repeated actions * Dead or ineffective clicks * Application errors * Slow requests * Forms or workflows that users cannot complete * Confusing application behavior * Issues associated with user feedback Session Replay is a reconstruction of captured browser activity, not a video. Its completeness depends on the application structure, monitoring scope, privacy configuration, and data captured during the session. ## Angular Route Monitoring Angular applications commonly update content without loading a new HTML document. GermainUX can monitor configured route and view changes within a single-page application. Route monitoring helps measure: * Route usage * Route-change duration * Entry and exit routes * Navigation paths * Errors by route * Slow requests by route * Business-process progression * Abandonment and drop-off Use stable route templates instead of complete URLs containing record IDs or other dynamic values. For example, group `/customer/12345` and `/customer/67890` under a route such as `/customer/:id`. ## User Actions and Feature Adoption GermainUX can capture interactions with links, buttons, forms, menus, and other browser controls. This data helps analyze: * Active and unique users * Features used * Features rarely or never used * Usage frequency * Navigation patterns * Repeated or inefficient actions * Adoption by team, role, region, or release * Changes following training or application updates Custom events can represent Angular-specific features or business actions that cannot be identified reliably from generic browser interaction alone. ## Performance Monitoring GermainUX measures performance from the user’s browser, including: * Page and route load time * User-action duration * Browser rendering and resource activity * Network-request duration * Failed or slow resources * JavaScript execution problems * Custom transaction duration * Business-process and step duration Analyze averages together with percentiles and affected-user counts. Averages can hide severe delays experienced by a smaller population. ### Transaction Performance Comparison When analyzing a slow or failed Angular application transaction, use Comparison to compare its performance with another execution of the same transaction, such as the fastest, slowest, most recent, first seen, or last seen. Comparison can reveal: * Differences in execution time for the same Angular operation * Which routes, components, or API calls caused the slowdown * Performance differences between successful and failed Angular transactions * Errors or bottlenecks affecting business processes * Potential root causes of transaction performance degradation This helps pinpoint why an Angular transaction is slower or failing, identify the underlying bottlenecks, and accelerate resolution to improve application performance and user productivity. More details on [**Transaction Performance Comparison**](https://docs.germainux.com/main/4-analysis-dashboard.md#comparison-of-bad-vs-good). ## JavaScript Error Monitoring GermainUX can capture browser-side errors such as: * Uncaught JavaScript exceptions * Unhandled promise rejections * Console errors * Resource-load failures * Network failures * HTTP errors * Application errors explicitly reported through custom instrumentation Angular errors handled internally by the application may not reach the browser’s global error handlers. Report important caught or handled failures explicitly when they must be analyzed in GermainUX. Errors can be ranked by: * Affected users * Affected sessions * Frequency * First and last occurrence * Route or feature * Application version * Browser and device * Business-process impact ## JavaScript Profiling The GermainUX JS Profiler provides deeper browser-side JavaScript performance analysis when supported and enabled. It can help identify: * JavaScript functions consuming significant execution time * Long-running browser activity * Expensive call paths * Code associated with slow interactions * Release-specific JavaScript regressions Profiling depends on browser capabilities, application security policies, and the configured profiling method. Angular component rendering is not automatically equivalent to a GermainUX transaction. Use custom instrumentation when a specific component lifecycle or rendering operation must be measured independently. ## Network and API Monitoring GermainUX can monitor browser requests made through supported APIs such as `fetch` and `XMLHttpRequest`. Analysis can include: * Request count * Endpoint * Duration * HTTP status * Success and failure rate * Timeouts > [accordion] Show all 9 > > * Related route or user action > * Affected sessions > * Application release Normalize URLs containing dynamic values so requests to the same logical endpoint are analyzed together. An HTTP `200` response does not always indicate a successful business outcome. Configure custom error detection when an API returns a functional failure inside a successful HTTP response. ## Business-Process Monitoring GermainUX can reconstruct business processes using routes, user actions, custom events, network requests, and transactions. Examples include: * Login * Customer onboarding * Search * Form completion * Order creation * Checkout > [accordion] Show all 9 > > * Case management > * Approval workflows > * Custom employee processes For each process, GermainUX can analyze: * Processes started * Processes completed * Failure and abandonment rates * End-to-end duration * Step duration * Repeated steps > [accordion] Show all 9 > > * Unexpected navigation > * Process overrun > * Lost productivity A page or route visit does not always prove that a business step completed. Use a custom event or transaction when the outcome must be confirmed. ## Heatmaps and Behavior Analysis For supported pages and elements, GermainUX can provide behavioral analysis such as: * Click heatmaps * Error-click heatmaps * Rage-click heatmaps * Dead-click heatmaps * Mouse-movement heatmaps * Scroll heatmaps Heatmaps aggregate captured behavior across users and help identify usability problems at scale. Dynamic Angular elements require stable identification and appropriate grouping for meaningful analysis. ## User Feedback GermainUX can collect feedback from users and associate it with: * Application and route * User session * Session Replay * User actions * Errors * Performance * Business-process context * Browser and device This helps determine whether negative feedback is caused by a software failure, slow performance, confusing workflow, missing functionality, or another experience issue. ## Synthetic Monitoring GermainUX RPA bots can execute Angular user scenarios on a schedule to detect problems before users report them. Synthetic scenarios can validate: * Application availability * Authentication * Route navigation * Search * Form submission * Record creation or update > [accordion] Show all 9 > > * Checkout > * Critical business workflows > * Expected page content and outcomes GermainUX can measure scenario availability, total duration, step duration, validation failures, and application errors. Use dedicated test accounts and controlled test data. ## Backend and Infrastructure Correlation The GermainUX Engine can monitor accessible backend resources supporting the Angular application, including: * APIs * Application logs * Services and processes * Hosts * Databases * Containers * Integration platforms * HTTP endpoints For supported customer-controlled backend runtimes, GermainUX Code Profiler can provide code-level transaction visibility. End-to-end correlation requires compatible timestamps and shared identifiers such as request, trace, transaction, or correlation IDs. ## Deployment Options ### RUM JS Deploy GermainUX RUM JS in the main HTML document or common application template. This is the preferred method when the application source and deployment process are controlled by the organization. For Angular single-page applications, load RUM JS early so it can capture initial page activity and subsequent route changes. ### RUM Browser Extension Use the GermainUX RUM Browser Extension when: * The application’s top-level document cannot be modified. * Monitoring is required for selected users during a proof of concept. * Browser policy or application ownership requires extension-based deployment. For production, distribute and configure the extension through the organization’s approved browser-management platform. ### RPA Bot Recorder and Engine Use the RPA Bot Recorder to create synthetic Angular scenarios and the Engine to execute them on a schedule. ## Dashboards and Analysis Angular dashboards can provide: | Dashboard Item | | | | - | - | - | | Active users and sessions | | | | Route and feature adoption | | | | User-action performance | | | | JavaScript and browser errors | | | | Network-request performance | | | | Business-process completion and abandonment | | | | Session Replay | | | | Heatmaps | | | | User feedback | | | | Synthetic availability | | | | Backend and infrastructure context | | | | Release comparison | | | Teams can drill down from aggregated KPIs to affected routes, users, sessions, errors, requests, transactions, and replays. ## Alerts, Reports, and Automation Configure alerts for conditions such as: * Application unavailable * Increased JavaScript errors * Slow routes or user actions * API failures * Business-process failures or abandonment * Synthetic transaction failures * New release regression * Negative user feedback GermainUX can send alerts and scheduled reports or initiate approved actions through the Engine, including webhooks, HTTP requests, scripts, database operations, and ticketing integrations. Automated actions must be explicitly configured, authorized, and tested. ## Privacy and Security Before production deployment: * Mask passwords and sensitive form fields. * Exclude confidential pages and elements. * Remove authentication tokens from URLs and headers. * Normalize URLs containing record or user identifiers. * Restrict access to Session Replay and user-level data. * Configure sampling and retention. > [accordion] Show all 9 > > * Use pseudonymous user identifiers where possible. > * Review custom events, errors, and transaction attributes. > * Validate privacy rules after every major application change. ## Additional Resources > [card] [Deploy](https://docs.germainux.com/main/deploy-monitoring-for-angular.md) > > Monitoring or automation for Angular > [card] [AI](https://docs.germainux.com/main/ai-driven-insights.md) > > Insights & Recommendations > [card] [Analytics](https://docs.germainux.com/main/analytics.md) > > More Analytics Features > [card] [Automation](https://docs.germainux.com/main/automation.md) > > More Automation Features > [card] [Dashboards](https://docs.germainux.com/main/dashboard-and-report.md) > > Dashboards and reports overview > [card] [Reports](https://docs.germainux.com/main/reporting-automatic.md) > > Automatic and scheduled reports ## Get Help > [card] [Contact GermainUX Support](https://docs.germainux.com/main/support.md) > > The GermainUX team helps you get up and running faster, empower your team, turn data into actionable insights, and optimize performance to deliver measurable business outcomes. > [card] Can't find what you need? > > Search all GermainUX docs with **Ctrl + K**, or use the feedback buttons at the bottom of this page to tell us what is missing. The content of this document is proprietary to GERMAIN SOFTWARE. This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.