Performance & Compatibility
How Tailor works with your existing stack. Core Web Vitals, SPAs, CDNs, iframes, and more.
Core Web Vitals & Page Speed
Tailor is designed to have minimal impact on page performance. The script is lightweight, non-blocking, and loads asynchronously when the async attribute is present on the script tag (which is the recommended and default installation method).
What to Expect
- Script typically loads in under 100ms
- Core Web Vitals (LCP, CLS, INP) are generally unaffected with async loading
- No render-blocking behavior
- Search engines see the original page structure unchanged
We recommend testing with Google PageSpeed Insights before and after installation to confirm there's no measurable impact on your specific site.
Single-Page Apps (React, Next.js)
Tailor works on single-page applications with no special SPA configuration needed. The script supports client-side navigation and re-evaluates targeting rules when the route changes.
SPA Considerations
- Tailored pages must be attached to the correct route/path in Tailor
- If your app re-renders components after Tailor applies changes, the re-render may override the tailored content
- If you experience override issues, reach out to support@tailorhq.ai for guidance on your specific framework
CDN & Caching (Cloudflare, Fastly)
Tailor operates entirely client-side and requires no CDN configuration changes. Here's how it works with your caching layer:
- 1Your original HTML is cached and served from the CDN as usual
- 2The page loads in the browser normally
- 3The Tailor script reads the visitor's assignment and modifies the DOM client-side
No CDN purging, cache-busting, or edge rules are needed. If you see unexpected behavior after deploying Tailor, clear your browser cache and test again to rule out stale content.
iFrames & Embedded Widgets
Tailor can personalize content inside an iframe only if the Tailor tag is installed on the page loaded inside the iframe. The parent page's Tailor tag cannot reach into a cross-origin iframe's DOM due to browser security restrictions.
Cross-Origin iFrames
For cross-origin iframes (embedded forms, booking widgets, etc.), install the Tailor tag on the iframe's source page itself. If the iframe source is a third-party service you don't control, iframe personalization isn't possible. Contact support@tailorhq.ai for complex setups.
Flash of Original Content (FOUC)
Since Tailor applies changes client-side after the page renders, there's a brief window where the original content is visible before the tailored version appears. This flash is typically under 100ms and usually imperceptible.
Factors That Increase Flash Visibility
- Slow network connections
- Heavy pages with many resources to load
- Complex DOM modifications (large sections of content being swapped)
If the flash is noticeable to visitors on your site, reach out to support@tailorhq.ai and we can work on optimizations specific to your setup.
