64 lines
2.4 KiB
TypeScript
64 lines
2.4 KiB
TypeScript
import { BarChart2Icon, CoinsIcon, GithubIcon, ServerIcon } from 'lucide-react';
|
|
import Link from 'next/link';
|
|
import { FeatureCard } from '@/components/feature-card';
|
|
import { GetStartedButton } from '@/components/get-started-button';
|
|
import { Section, SectionHeader } from '@/components/section';
|
|
import { Button } from '@/components/ui/button';
|
|
|
|
const reasons = [
|
|
{
|
|
icon: CoinsIcon,
|
|
title: 'Fraction of the cost',
|
|
description:
|
|
"Mixpanel's pricing scales to hundreds or thousands per month as your event volume grows. OpenPanel starts at $2.50/month — or self-host for free with no event limits.",
|
|
},
|
|
{
|
|
icon: BarChart2Icon,
|
|
title: 'The features you actually use',
|
|
description:
|
|
'Events, funnels, retention, cohorts, user profiles, custom dashboards, and A/B testing — all there. OpenPanel covers every core analytics workflow from Mixpanel without the learning curve.',
|
|
},
|
|
{
|
|
icon: ServerIcon,
|
|
title: 'Actually self-hostable',
|
|
description:
|
|
'Mixpanel is cloud-only. OpenPanel runs on your own infrastructure with a simple Docker setup. Full data ownership, zero vendor lock-in.',
|
|
},
|
|
{
|
|
icon: GithubIcon,
|
|
title: 'Open source & transparent',
|
|
description:
|
|
"Mixpanel is a black box. OpenPanel's code is public on GitHub — audit it, contribute to it, or fork it. No surprises, no hidden data processing.",
|
|
},
|
|
];
|
|
|
|
export function MixpanelAlternative() {
|
|
return (
|
|
<Section className="container">
|
|
<SectionHeader
|
|
description="OpenPanel covers the product analytics features teams actually use — events, funnels, retention, cohorts, and user profiles — without Mixpanel's pricing, privacy trade-offs, or vendor lock-in."
|
|
label="Mixpanel Alternative"
|
|
title="Why teams switch from Mixpanel to OpenPanel"
|
|
/>
|
|
<div className="mt-8 grid grid-cols-1 gap-4 md:grid-cols-2">
|
|
{reasons.map((reason) => (
|
|
<FeatureCard
|
|
description={reason.description}
|
|
icon={reason.icon}
|
|
key={reason.title}
|
|
title={reason.title}
|
|
/>
|
|
))}
|
|
</div>
|
|
<div className="row mt-8 gap-4">
|
|
<GetStartedButton />
|
|
<Button asChild className="px-6" size="lg" variant="outline">
|
|
<Link href="/compare/mixpanel-alternative">
|
|
OpenPanel vs Mixpanel →
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
</Section>
|
|
);
|
|
}
|