Deploy Monitoring for HTML/JQuery

🚀 Deploy Monitoring for HTML and jQuery

GermainUX can monitor HTML and jQuery applications through several complementary components. For most customer-controlled web applications, deploy GermainUX RUM JS first. Add the RUM Extension, JS Profiler, Engine, or synthetic monitoring only when the corresponding monitoring depth is required.

🧰 Choose the deployment components

Not every HTML or jQuery deployment requires every component.

🔖 Prerequisites

Before deployment, confirm that:

• GermainUX Cloud or on-premises is available.

• The monitored application and GermainUX endpoints are reachable from user browsers.

• HTTPS is used in production.

• Content Security Policy permits the required GermainUX scripts and connections.

• Proxy and firewall rules allow communication with GermainUX.

• The application domains and environments to monitor are known.

• Privacy, consent, masking, exclusion, and retention requirements have been approved.

• A non-production application or controlled pilot group is available for validation.

Deploy GermainUX RUM JS

Use RUM JS when you control the HTML application and can add JavaScript to its pages.

Create the application configuration

1. Sign in to GermainUX Workspace.

2. Go to Wizards.

3. Open the HTML/jQuery wizard.
   

   

4. Enter or select the monitored application.

5. Enter the application name and URL.

6. Select or create the appropriate UX Monitoring Profile.
   

   

7. Review the generated deployment options.

8. Finish the wizard.

The wizard creates the standard application and monitoring configuration. Most browser KPIs and insights are preconfigured; additional customization is necessary only when the application requires custom events, privacy rules, workflows, or analytical logic.

Select the RUM JS deployment method

The wizard can provide deployment instructions appropriate for the application.

Use the deployment code generated for the specific GermainUX environment and UX Monitoring Profile. Do not copy configuration values between environments unless they intentionally share the same GermainUX destination and monitoring policy.

Add RUM JS to the application

For direct script deployment:

1. Add the generated GermainUX script to the common HTML template or application shell.

2. Load it on every page included in the monitoring scope.

3. Place it according to the installation instructions generated by the wizard.

4. Preserve the generated application and profile identifiers.

5. Deploy the application through the normal release process.

6. Clear or refresh relevant application, CDN, and browser caches when necessary.

7. Reload the application and generate a controlled test session.

For applications with several independently rendered pages, verify that the script is present on every page that must be monitored.

Content Security Policy

If the application uses Content Security Policy, allow only the GermainUX origins required by the deployment.

Depending on the configuration, review directives governing:

• Script loading

• Network connections

• WebSocket connections

• Frames or workers

• Images and other resources

Use the exact GermainUX URLs generated for the environment. Avoid broad wildcards or unsafe policy changes merely to enable monitoring.

Deploy the RUM Extension

Use the GermainUX RUM Extension when RUM JS cannot be added directly or monitoring must be centrally managed at the browser level.

Configure the monitored application

1. Sign in to GermainUX Workspace.

2. Go to Wizards.

3. Open Browser Extension Agent.

4. Select Add.

5. Select or create the host and monitored application.

6. Enter a descriptive configuration label.

7. Select the appropriate UX Monitoring Profile.

8. Enter the application URL and scheme.
   

   

9. Review the configuration and select Finish.

Deploy the extension

The extension can be installed:

• Manually for evaluation or troubleshooting

• Through Microsoft Group Policy

• Through Microsoft Intune

• Through Google Admin Console

• Through another enterprise browser-management platform

• Through an approved internal extension store

For production, use managed browser policies so the organization can control installation, permissions, configuration, and updates.

Deploy RUM JS or the RUM Extension according to the application architecture. Avoid collecting duplicate sessions by enabling both methods for the same users and page context unless GermainUX has specifically configured them to work together.

Configure privacy before production

HTML forms and pages may contain personal, payment, authentication, health, or confidential business information.

Before enabling production monitoring:

1. Identify sensitive pages, fields, and data values.

2. Mask, anonymize, or exclude sensitive content.

3. Exclude passwords, security answers, authentication tokens, and secrets.

4. Review URL parameters, request headers, and request bodies.

5. Restrict monitoring to the approved domains and environments.

6. Configure consent behavior where required.

7. Define retention and deletion policies.

8. Restrict access to Session Replay and monitoring data.

9. Test privacy rules using representative application scenarios.

See Data Privacy.

Validate Real User Monitoring

After deploying RUM JS or the RUM Extension:

1. Open the monitored application.

2. Navigate through several representative pages.

3. Click buttons, links, menus, and jQuery-driven controls.

4. Submit a non-sensitive test form.

5. Generate an approved validation message or test error.

6. Complete a representative business workflow.

7. Sign in to GermainUX Workspace.

8. Confirm that the user session and browser telemetry appear.

9. Open the Session Replay.

10. Verify that navigation, interactions, errors, performance, and network activity are captured as expected.

11. Confirm that sensitive values are masked or excluded.

12. Check that application, environment, URL, browser, and session metadata are correct.

See User Session Monitoring and Replay.

Configure application-specific monitoring

Standard HTML and browser monitoring is preconfigured. Customize it only when additional application-specific requirements exist.

Possible customizations include:

• Application and environment metadata

• User or organizational attributes

• Custom business events

• Conversion and workflow milestones

• Business-process start, step, completion, and abandonment events

• Custom performance marks and measures

• Application-specific errors and validation messages

• Additional privacy rules

• URL inclusions and exclusions

• Custom KPIs, SLAs, alerts, dashboards, and reports

Use the Browser Monitoring APIs when important application activity cannot be detected reliably from standard browser telemetry.

Deploy the JS Profiler

The GermainUX JS Profiler is optional and complements RUM.

Use it when deeper evidence is required for:

• Slow JavaScript functions

• Browser freezes and long-running tasks

• Slow user interactions

• Excessive rendering or DOM activity

• JavaScript errors and stack traces

• Network-related frontend delays

• Problems that are difficult to reproduce

Before enabling it:

1. Deploy and validate RUM for the application.

2. Define the users, URLs, sessions, or conditions to profile.

3. Install or centrally deploy the supported JS Profiler browser extension.

4. Generate a controlled test interaction.

5. Confirm that profiler evidence is associated with the correct RUM session.

Advanced profiling can generate additional data and browser overhead. Enable it for the smallest scope necessary and expand only after validating its impact.

Deploy backend monitoring

HTML and jQuery provide browser-side visibility. Backend monitoring requires access to the technologies supporting the application.

Deploy the GermainUX Engine when GermainUX must monitor:

• REST or SOAP APIs

• Application and web-server logs

• Databases and queries

• Integration services

• Servers, containers, or cloud infrastructure

• Scheduled jobs and background processes

• Application-health endpoints

Configure compatible identifiers and metadata when browser activity must be correlated or traced to backend transactions.

Deploy synthetic monitoring

Use the GermainUX RPA Bot Recorder to record critical user scenarios such as:

• Application availability

• Login

• Search and navigation

• Form submission

• Checkout or payment

• Case or request creation

• Critical employee workflows

The GermainUX Engine executes recorded scenarios on a schedule and can trigger alerts when availability, performance, or expected outcomes deviate from the configured conditions.

Use dedicated test accounts and test data. Do not embed production credentials directly in scripts or recordings.

Production rollout

Use a controlled rollout:

1. Deploy to a non-production environment.

2. Validate connectivity and collected telemetry.

3. Test masking, exclusion, consent, and retention.

4. Confirm that browser performance remains acceptable.

5. Deploy to a limited production pilot group.

6. Validate sessions, insights, errors, and performance data.

7. Review data volume and quality.

8. Expand the deployment gradually.

9. Monitor incoming telemetry after each rollout stage.

Troubleshooting

No monitoring data appears

Verify that:

• The RUM script or extension is installed and enabled.

• The current URL matches the configured application scope.

• The correct GermainUX environment and UX Monitoring Profile are used.

• The browser can reach GermainUX.

• Proxy, firewall, ad-blocking, or privacy tools are not blocking requests.

• Content Security Policy permits the required script and connections.

• Monitoring is enabled.

• The browser loaded the current application release.

Only some pages are monitored

Check for:

• Pages using a different template

• Additional application domains or subdomains

• Single-page application routes not covered by the configuration

• Cross-origin frames

• Authentication or redirect domains

• URL definitions that are too restrictive

• Pages on which the RUM script is absent

Duplicate sessions appear

Confirm that the same page is not being monitored simultaneously by:

• Multiple RUM script installations

• Both RUM JS and the RUM Extension

• A direct script and a tag-manager deployment

• Duplicate application initialization code

Session Replay is missing content

Review:

• Privacy exclusions

• Unsupported or cross-origin frames

• Dynamically rendered elements

• Application URL scope

• RUM or extension version

• Browser permissions

• Content Security Policy

• Whether the required pages loaded before monitoring initialized

Browser performance changes

Confirm whether the issue is associated with:

• Deep JS Profiler collection

• Duplicate monitoring deployment

• Excessive custom events

• Large request or console payloads

• Overly broad DOM or network capture

• Monitoring unsupported application contexts

Reduce optional diagnostic collection and revalidate before expanding the rollout.

Deployment and configuration

ℹ️ Get Help

The Germain Team can help you set this up. Contact GermainUX Support.