DEV Community: Aymane

Waitlist Benchmarks: Conversion, Referral & Email Rates (2026)

Aymane — Fri, 09 Oct 2026 07:30:12 +0000

"How many signups should my waitlist get?" is the wrong question until you know what good looks like. This page collects the formulas behind the numbers and the benchmark ranges to aim for — so you can set targets that hold up instead of guessing.

Disclaimer: figures below come from public benchmark reports and vendor studies, cited inline. Your results will depend on your audience and page. Use these as orientation, not guarantees. The formulas are exact; plug in your own data.

Waitlist conversion rate: the formula

Conversion rate = signups ÷ unique visitors × 100.

This is the number to watch first. It isolates whether your page and offer connect, separate from how much traffic you send. If you drive 1,000 visitors and get 30 signups, your conversion rate is 3%.

What is a good range?

Conversion rate	What it usually means
Under 5%	The page, offer, or traffic is off — fix these before scaling
5–10%	Typical for an average landing page
10%+	Strong; a well-run waitlist
20%+	Excellent, usually with warm or targeted traffic

For context, Unbounce's conversion benchmark report — analyzing roughly 57 million conversions across more than 41,000 landing pages — puts the median landing page conversion rate at about 6.6%. Waitlister's analysis of thousands of waitlists reports a median waitlist conversion rate around 11%, suggesting a focused waitlist page out-converts a generic landing page. Treat both as directional, not targets to beat.

If your traffic is cold (ads, broad social), expect the lower end; if it is warm (your followers, a community, referrals), expect higher.

Referral k-factor (viral coefficient)

k = i × c, where:

i = average invites sent per subscriber
c = conversion rate of those invites (invites that become signups)

Worked example: if 100 subscribers each send 3 invites on average (i = 3) and 15% of invites convert (c = 0.15), then k = 3 × 0.15 = 0.45. Those 100 subscribers bring in about 45 more. Growth still depends on new traffic — the loop slows down.

To get k above 1 (self-sustaining growth), you need the product of the two numbers above 1. For example, 4 invites per subscriber at 25% conversion gives k = 1.0; 5 invites at 25% gives k = 1.25.

Two levers raise k: make sharing easier (more invites) and make the reward compelling (higher conversion). Only about 7% of waitlists run a referral program at all, per Waitlister's analysis — so simply turning on referrals puts you ahead of most.

Referral rate and referral conversion

Two different metrics are often confused:

Referral rate = subscribers who referred at least one person ÷ total subscribers. This measures how many people share at all. A healthy program gets a meaningful share of subscribers to refer; if almost nobody shares, the reward or the friction is the problem.
Referral conversion rate = signups from referral links ÷ clicks on referral links. This measures the quality of referred traffic. Referred visitors often convert better than cold traffic because the recommendation comes from a friend.

Track both. A high referral rate with low conversion means people are sharing to a cold audience; a low referral rate with high conversion means the reward is good but hard to find.

Email open and click rates

Once you can email your list, three formulas matter:

Open rate = opens ÷ emails delivered.
Click rate = clicks ÷ emails delivered.
Click-to-open rate (CTOR) = clicks ÷ opens. This tells you whether the people who opened found the content worth clicking.

Email benchmarks vary widely by list, industry, and send frequency. For an engaged pre-launch list, open rates are often reported in the 20–40% range, with click rates of a few percent. A dropping open rate is the earliest warning that your audience is losing interest — tighten your sending, and email only when you have something worth saying.

Related: Waitlist Email Sequence Guide.

Launch-day conversion

Launch conversion = paying customers ÷ waitlist size.

This is the number people brag about, and the one with the widest spread. It depends almost entirely on product, price, and how warm the waitlist is — not on the waitlist tool. Expect a range rather than a fixed target, and watch the trend across launches rather than one data point.

Related: Launch Day Playbook.

How to set targets that hold up

Start with your conversion rate. If it is under 5%, do not scale traffic yet — improve the page.
Add a referral loop. Even a simple milestone ("invite 3 friends for early access") raises your referral rate from zero, and word-of-mouth remains the most trusted channel (Nielsen puts word-of-mouth trust around 88%).
Protect deliverability. Double opt-in and a clean list keep your launch email out of spam.
Compare against yourself. Your own last 30 days are a better benchmark than any industry average.

The point of benchmarks is not to hit a number — it is to know which number to fix next.

FAQ

What is a good waitlist conversion rate?

A median landing page converts around 6.6% (Unbounce's benchmark report), while waitlist-specific analyses report a median closer to 11%. Anything above 10% is strong; under 5% usually signals a page or traffic problem worth fixing first.

What is the formula for the viral coefficient (k-factor)?

k = i × c, where i is the average number of invites per subscriber and c is the conversion rate of those invites. k above 1 means self-sustaining growth; below 1 means growth relies on new traffic.

How many people on a waitlist actually refer?

Only about 7% of waitlists run a referral program, according to Waitlister's analysis, so a large share of list owners never measure this. Among those that do, referral rate (percent of subscribers who refer at least one person) is the metric to track.

What email open rate should I expect?

For an engaged pre-launch list, open rates commonly fall in the 20–40% range, with click rates of a few percent. Both vary by list and send frequency, so watch your own trend over time.

Where do these benchmark numbers come from?

The conversion figures are cited from Unbounce's conversion benchmark report and Waitlister's published waitlist analysis. The formulas are standard. All figures are directional — use your own data for decisions.

Related guides

Waitlist Glossary: 16 Terms Every Founder Should Know — plain-English definitions for every term here
Pre-Launch Referral Program Guide — raising your referral rate and k-factor
Waitlist Copywriting that Converts — lifting your conversion rate
Waitlist Email Sequence Guide — the emails behind the open and click rates

The simple, affordable waitlist tool for founders and makers. Start free in 5 minutes — no credit card required. Try GetWaitly free →

How to Add a Waitlist to React & Next.js

Aymane — Thu, 08 Oct 2026 08:53:11 +0000

If you are building your pre-launch site in React or Next.js, you do not need a waitlist SDK or npm package. GetWaitly ships a single script tag and a container element — the same embed that works on any site. Here is how to wire it into a React or Next.js app cleanly.

The short answer

Load https://getwaitly.com/widget.js once in your root layout, then render a <div className="gw-widget" data-waitlist-id="YOUR_WAITLIST_ID" /> wherever the form should appear. For a popup, render a <button className="gw-trigger" data-waitlist-id="YOUR_WAITLIST_ID">. Use the waitlist's public ID, not its slug. Total time: 5 minutes.

What you need

A GetWaitly account with a waitlist created (free plan covers 100 subscribers).
Your waitlist's public ID from the Widget/Embed section of the dashboard.
A React or Next.js app. The widget is plain JavaScript — it does not care which framework you use.

The embed, in framework terms

The GetWaitly widget is two parts: a script that defines the <div class="gw-widget"> behavior, and the div itself. In JSX:

<div className="gw-widget" data-waitlist-id="YOUR_WAITLIST_ID" />

The script must load once per page. In Next.js that is next/script; in plain React you can put it in index.html or inject it in an effect. The widget finds the .gw-widget element and renders the form into it, styled with your waitlist branding.

Next.js (App Router)

Load the script in your root layout so it is present on every route, and render the widget on the page that needs it.

app/layout.tsx

import Script from "next/script";

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script
          src="https://getwaitly.com/widget.js"
          strategy="afterInteractive"
        />
      </body>
    </html>
  );
}

app/page.tsx (or any page)

export default function Home() {
  return (
    <main>
      <h1>Something great is coming.</h1>
      <div className="gw-widget" data-waitlist-id="YOUR_WAITLIST_ID" />
    </main>
  );
}

strategy="afterInteractive" loads the script after the page becomes interactive, so it does not block your render.

Next.js (Pages Router)

Use _app.tsx to load the script once, and place the div in your page:

pages/_app.tsx

import Script from "next/script";
import type { AppProps } from "next/app";

export default function App({ Component, pageProps }: AppProps) {
  return (
    <>
      <Component {...pageProps} />
      <Script
        src="https://getwaitly.com/widget.js"
        strategy="afterInteractive"
      />
    </>
  );
}

Plain React (Vite / Create React App)

There is no next/script, so add the script tag to index.html before the closing </body>, and render the div in a component:

index.html

<body>
  <div id="root"></div>
  <script src="https://getwaitly.com/widget.js" defer></script>
</body>

src/App.tsx

export default function App() {
  return (
    <main>
      <h1>Join the waitlist</h1>
      <div className="gw-widget" data-waitlist-id="YOUR_WAITLIST_ID" />
    </main>
  );
}

If you cannot edit index.html, inject the script in an effect instead:

import { useEffect } from "react";

useEffect(() => {
  if (document.querySelector('script[src="https://getwaitly.com/widget.js"]')) return;
  const s = document.createElement("script");
  s.src = "https://getwaitly.com/widget.js";
  s.defer = true;
  document.body.appendChild(s);
}, []);

The popup variant

For a button that opens the form in a modal, load the script once (above) and render a trigger button:

<button className="gw-trigger" data-waitlist-id="YOUR_WAITLIST_ID">
  Join waitlist
</button>

TypeScript and custom fields

data-waitlist-id is a valid data-* attribute on a div and button in JSX, no type changes needed. Enable name, phone, or custom fields in your GetWaitly widget settings and the form renders them automatically.

Single-page apps: one caveat

The widget script initializes on page load. In a single-page app the script loads once and does not re-run on client-side navigation. In practice this is fine because the widget renders into the .gw-widget div wherever it appears. If you mount the div conditionally after the script has loaded, the widget may miss it on the first client-side transition — a full page load fixes it. If that matters for your flow, keep the container div mounted, or drive the form yourself with the no-JavaScript form action below.

Full control: post to the join endpoint

If you would rather build your own React form (for custom validation or styling), skip the widget script and POST to your waitlist's join endpoint:

<form action="https://getwaitly.com/api/join/YOUR_WAITLIST_ID" method="post">
  <input type="email" name="email" required placeholder="Your email" />
  <button type="submit">Join the waitlist</button>
</form>

The browser posts the signup and redirects to your thank-you page. You lose the inline success animation and the automatic branding, but you keep full control of the markup.

Testing

Run your app, open the page, and submit a test email. Confirm the success message appears and the subscriber lands in your GetWaitly dashboard. If the form does not render, check the browser console for a blocked script (ad blockers and strict CSP can block third-party scripts) and verify the data-waitlist-id exactly matches your waitlist.

FAQ

Is there an npm package for the GetWaitly widget?

No. You inject one script tag (https://getwaitly.com/widget.js) and render a container div. There is nothing to install.

Does GetWaitly work with Next.js Server Components?

Yes — the script loads via next/script in your layout, and the container div is a plain element you can render from a Server Component. If you add the script in an effect, put that in a Client Component.

Why does the widget not render after client-side navigation?

The script initializes on load and does not re-run on route changes. Keep the .gw-widget div mounted, or use the form action to POST to /api/join yourself. A hard refresh always re-initializes.

Can I use the popup trigger in React?

Yes. Render a <button className="gw-trigger" data-waitlist-id="YOUR_WAITLIST_ID">. Load the script once and any trigger on the page opens the modal.

Does it work with Vite, Remix, or Astro?

Yes. Anywhere you can add a <script> tag and render a div, the widget works. For server-rendered frameworks, load the script with whatever mechanism the framework recommends (or a plain defer tag).

How do I collect custom fields?

Configure them in your GetWaitly widget settings. The inline widget renders the fields you enable. For a fully custom form, use cf_0, cf_1, … inputs matched to your custom field order and post to /api/join.

Related guides

How to Add a Waitlist to Any Website — the generic HTML embed
How to Add a Waitlist to Framer — the Embed component method
Which Form Builder for a Waitlist? — form builders vs a dedicated waitlist tool
7 Best Waitlist Tools for Solo Founders in 2026 — the full comparison

The simple, affordable waitlist tool for founders and makers. Start free in 5 minutes — no credit card required. Try GetWaitly free →