Troubleshooting Userflow.js Performance

Prev Next

If Userflow.js is slowing down your application, this guide will help you identify and resolve the issue.

Step 1: Confirm Userflow is the cause

Check the Performance tab: Open your browser's DevTools (F12 or Cmd+Option+I), go to the Performance tab, and record a profile while loading your page. Look for userflow in the flame graph. If Userflow takes more than ~50ms during page load, it may be contributing to slowness.

Compare with and without Userflow: Temporarily remove Userflow.js from your page (comment out the script tag or the userflow.init() call). Reload and test performance. If the issue disappears, Userflow is likely the cause.

Check the Network tab: In DevTools → Network, filter by "userflow" and check the script load time. The Userflow.js script itself is small (~50KB gzipped) and should load in under 200ms on most connections. If it's taking seconds to load, the issue may be network-related, not Userflow itself.

Step 2: Common performance bottlenecks

Too many active flows: If you have multiple flows set to auto-start on the same page with overlapping conditions, Userflow evaluates all of them on page load. This can slow down initialization. Review your flows and disable or reschedule any that don't need to run immediately.

Heavy DOM manipulation: If your flows have many tooltips or modals that need to measure or reposition elements, this can cause layout thrashing. Reduce the number of steps per flow, or split complex flows into smaller ones that run sequentially.

Event tracker overload: If you have dozens of no-code event trackers watching for clicks, page views, or element visibility, Userflow has to monitor those continuously. Audit your event trackers in the Userflow dashboard and remove any that are no longer needed.

Script loading timing: If Userflow.js loads early in the page (in the <head>) and your page has a lot of synchronous scripts, Userflow might block rendering. Move the Userflow.js script tag to the bottom of the <body>, or use async or defer attributes if possible.

Step 3: Optimize your Userflow setup

Use lazy flows: Instead of auto-starting all flows on page load, trigger them only when needed. For example, start a feature tour only after the user clicks a "Help" button. This reduces the upfront performance cost.

Reduce tooltips per flow: Flows with 10+ tooltip steps can cause performance issues because each tooltip needs to find and measure its target element. Break long flows into smaller ones, or use modals instead of tooltips where possible.

Disable unused features: If you're not using checklists, announcements, or the Resource Center, you can disable them in Settings → Environments. This reduces the amount of JavaScript Userflow needs to initialize.

Check for integration conflicts: If you're using Userflow alongside other tools (Intercom, HubSpot, analytics scripts), conflicts can occur. Test with other tools temporarily disabled to see if performance improves. If so, adjust load order or reach out to support for guidance on integration best practices.

Step 4: When to contact support

If you've tried the steps above and Userflow is still causing performance issues, contact support at support@userflow.com with the following information:

  • Browser type and version (e.g., Chrome 120, Safari 17)

  • Your Userflow environment ID (found in Settings → Environments)

  • A Performance tab recording (export as JSON from DevTools and attach)

  • The number of active flows, event trackers, and other Userflow content in your environment

  • Whether the issue occurs in all browsers or only specific ones

This information helps the support team diagnose the issue quickly and provide targeted recommendations.