How Embedding WeGive in an iFrame Affects Load Times

If you've noticed slower load times for your WeGive donation forms, the way you've embedded WeGive on your website may be a contributing factor. This article explains how iframes impact performance and what you can do to optimize your donors' giving experience.

Understanding the Issue

When WeGive is embedded in an iframe on your website, donors must wait for:

1. Your website to load completely - All of your site's resources (images, scripts, stylesheets, etc.)
2. Then WeGive to load - The donation form loads only after your page is ready

This creates a sequential loading process where WeGive's performance is directly impacted by your website's efficiency.

Real-World Example

In a recent case, we observed:

• 196 requests required to load the parent website
• 5+ seconds total load time for the embedded donation form
• The browser showed "stalled" status, waiting for available network connection slots

While WeGive loaded in approximately 5 seconds when accessed standalone, the embedded version appeared much slower due to the parent site's resource load.

Why This Happens

Browser Connection Limits

Browsers limit the number of simultaneous connections to any domain. When your website makes many requests (scripts, images, fonts, tracking pixels, etc.), WeGive must wait in queue for available connection slots.

Cumulative Loading

Every element on your page—from social media widgets to analytics scripts—contributes to the total load time before your embedded donation form becomes interactive.

Solutions & Best Practices

Option 1: Link to Standalone WeGive Pages (Recommended)

Instead of embedding, link directly to your WeGive donation pages:

• Fastest loading experience for donors
• No dependency on your website's performance
• Optimal mobile experience
• Full-screen, distraction-free giving environment

Option 2: Use WeGive's Pop-Up Modal (Recommended for Embedded Solutions)

Instead of embedding in an iframe, use WeGive's pop-up option:

• Donation form opens in a modal overlay when donors click your "Give" button
• Bypasses the sequential loading issue of iframes
• Maintains donors on your website
• Faster, smoother experience than iframe embedding
• Easy to implement with WeGive's provided code snippet

Option 3: Optimize Your Website

If you must use iframe embedding, improve your site's performance:

• Audit your page weight: Use tools like GTmetrix or Google PageSpeed Insights
• Reduce HTTP requests: Minimize the number of scripts, images, and external resources
• Implement lazy loading: Load non-critical resources after the initial page render
• Optimize images: Compress and properly size all images
• Remove unused scripts: Audit third-party integrations and analytics tools
• Use a CDN: Serve static assets from a content delivery network

Key Takeaway

WeGive is optimized for fast loading, but when embedded in an iframe, performance is limited by your website's efficiency. If you're experiencing slow load times, the issue typically stems from the parent website's resource load rather than WeGive itself.

Need Help?

If you're unsure which approach is best for your organization or need assistance optimizing your donation page setup, contact our support team at support@wegive.com.

Remember: Every second of delay can impact donation conversion rates. A faster giving experience leads to happier donors and better results for your mission.