Compare
vs next-seo
| Dimension | next-seo | @better-seo |
|---|---|---|
| Core model | Component + props | Single SEO document + merge |
| Runtime deps | React + own deps | 0 (core) |
| Bundle size | ~15KB+ | ~5KB gzip |
| JSON-LD | Manual | serializeJSONLD — single hardened path |
| Next App Router | Patterns vary | seo(), prepareNextSeo, NextJsonLd |
| OG images | External | assets + CLI og command |
| Route rules | None | Glob-based SEORule engine |
| Plugins | None | beforeMerge, afterMerge, onRenderTags |
| Multi-framework | Next only | Next, React, Remix, Astro, Nuxt |
| CLI | None | og, icons, doctor, scan, fix, crawl |
Migration: fromNextSeo() maps common props. CLI:
npx better-seo migrate from-next-seo.
When to Switch
- You use or plan to use Next.js App Router
- You need JSON-LD for rich results
- You want OG images without manual setup
- You need route-based rules
- You want a single source of truth
vs Next.js Metadata API
Next.js Metadata is the rendering layer — it maps config to
<head> tags. better-seo.js is the document model +
pipeline that sits on top. They're complementary.
| Feature | Next.js Metadata | + better-seo.js |
|---|---|---|
| Basic meta tags | ✅ | ✅ |
| Open Graph | ✅ | ✅ + fallback bridging |
| JSON-LD | ⚠️ Manual via other |
✅ Helpers + safe serialization |
| Merge strategy | ❌ Opaque | ✅ Deterministic mergeSEO |
| Validation | ❌ | ✅ validateSEO (dev) |
| Route rules | ❌ | ✅ Glob-based rules |
| OG generation | ❌ | ✅ CLI + library |
| Cross-framework | ❌ Next only | ✅ Adapters |
You don't choose between them. You use better-seo.js to get correct Next.js Metadata.
vs React Helmet
React Helmet is tag injection — you pass JSX, it renders to
<head>. No model, no merge strategy, no validation.
@better-seo/react maps the unified SEO document to Helmet props.
| Feature | react-helmet | @better-seo/react |
|---|---|---|
| Model | Props on component | Unified SEO document → Helmet props |
| JSON-LD | Manual <script> | serializeJSONLD + helpers |
| Fallbacks | None | Title templates, OG → Twitter bridging |
| Merge | Last-mounted wins | Explicit mergeSEO with rules |
| Validation | None | validateSEO with dev warnings |
| Cross-framework | React only | Core + adapters |
They work together. Helmet is the mechanism; better-seo.js is the document model that feeds it.