Skip to content

docs: Add comparison page back #5503

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
tannerlinsley merged 3 commits into from
Oct 17, 2025
Merged

docs: Add comparison page back #5503

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
ae14bac
add comparison page back in
LadyBluenotes Oct 17, 2025
9940112
rm unneeded section in overview
LadyBluenotes Oct 17, 2025
e405b14
comparison page via config
LadyBluenotes Oct 17, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions docs/router/config.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,10 @@
"label": "LLM Assistance Support",
"to": "framework/react/llm-support"
},
{
"label": "Comparison",
"to": "framework/react/comparison"
},
{
"label": "Frequently Asked Questions",
"to": "framework/react/faq"
Expand Down
96 changes: 96 additions & 0 deletions docs/router/framework/react/comparison.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,96 @@
---
title: Comparison | TanStack Router & TanStack Start vs Next.js vs React Router / Remix
toc: false
---

Choosing a routing solution? This side‑by‑side comparison highlights key features, trade‑offs, and common use cases to help you quickly evaluate how each option fits your project’s needs.

While we aim to provide an accurate and fair comparison, please note that this table may not capture every nuance or recent update of each library. We recommend reviewing the official documentation and trying out each solution to make the most informed decision for your specific use case.

If you find any discrepancies or have suggestions for improvement, please don't hesitate to contribute via the "Edit this page on GitHub" link at the bottom of this page or open an issue in the [TanStack Router GitHub repository](https://github.com/TanStack/router).

Feature/Capability Key:

- ✅ 1st-class, built-in, and ready to use with no added configuration or code
- 🟡 Partial Support (on a scale of 5)
- 🟠 Supported via addon/community package
- 🔶 Possible, but requires custom code/implementation/casting
- 🛑 Not officially supported

| | TanStack Router / Start | React Router DOM [_(Website)_][router] | Next.JS [_(Website)_][nextjs] |
| ---------------------------------------------- | ------------------------------------------------ | ----------------------------------------------------- | ----------------------------------------------------- |
| Github Repo / Stars | [![][stars-tanstack-router]][gh-tanstack-router] | [![][stars-router]][gh-router] | [![][stars-nextjs]][gh-nextjs] |
Copy link
Contributor

@coderabbitai coderabbitai bot Oct 17, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Fix capitalization: "Github" → "GitHub".

The table header uses "Github" but the official branding is "GitHub".

-| Github Repo / Stars                            | [![][stars-tanstack-router]][gh-tanstack-router] | [![][stars-router]][gh-router]                        | [![][stars-nextjs]][gh-nextjs]                        |
+| GitHub Repo / Stars                            | [![][stars-tanstack-router]][gh-tanstack-router] | [![][stars-router]][gh-router]                        | [![][stars-nextjs]][gh-nextjs]                        |
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
| Github Repo / Stars | [![][stars-tanstack-router]][gh-tanstack-router] | [![][stars-router]][gh-router] | [![][stars-nextjs]][gh-nextjs] |
| GitHub Repo / Stars | [![][stars-tanstack-router]][gh-tanstack-router] | [![][stars-router]][gh-router] | [![][stars-nextjs]][gh-nextjs] |
🧰 Tools
🪛 LanguageTool

[uncategorized] ~22-~22: The official name of this software platform is spelled with a capital “H”.
Context: ...----------------------------------- | | Github Repo / Stars ...

(GITHUB)

🪛 markdownlint-cli2 (0.18.1)

22-22: Images should have alternate text (alt text)

(MD045, no-alt-text)

22-22: Images should have alternate text (alt text)

(MD045, no-alt-text)

22-22: Images should have alternate text (alt text)

(MD045, no-alt-text)

🤖 Prompt for AI Agents 
In docs/router/framework/react/comparison.md around line 22, the table header
uses incorrect capitalization "Github" — change it to the official branding
"GitHub" by replacing "Github" with "GitHub" in that header cell so the
documentation follows correct product naming.

| Bundle Size | [![][bp-tanstack-router]][bpl-tanstack-router] | [![][bp-router]][bpl-router] | ❓ |
| History, Memory & Hash Routers | ✅ | ✅ | 🛑 |
| Nested / Layout Routes | ✅ | ✅ | 🟡 |
| Suspense-like Route Transitions | ✅ | ✅ | ✅ |
| Typesafe Routes | ✅ | 🟡 (1/5) | 🟡 |
| Code-based Routes | ✅ | ✅ | 🛑 |
| File-based Routes | ✅ | ✅ | ✅ |
| Virtual/Programmatic File-based Routes | ✅ | ✅ | 🛑 |
| Router Loaders | ✅ | ✅ | ✅ |
| SWR Loader Caching | ✅ | 🛑 | ✅ |
| Route Prefetching | ✅ | ✅ | ✅ |
| Auto Route Prefetching | ✅ | ✅ | ✅ |
| Route Prefetching Delay | ✅ | 🔶 | 🛑 |
| Path Params | ✅ | ✅ | ✅ |
| Typesafe Path Params | ✅ | ✅ | 🛑 |
| Typesafe Route Context | ✅ | 🛑 | 🛑 |
| Path Param Validation | ✅ | 🛑 | 🛑 |
| Custom Path Param Parsing/Serialization | ✅ | 🛑 | 🛑 |
| Ranked Routes | ✅ | ✅ | ✅ |
| Active Link Customization | ✅ | ✅ | ✅ |
| Optimistic UI | ✅ | ✅ | 🔶 |
| Typesafe Absolute + Relative Navigation | ✅ | 🟡 (1/5 via `buildHref` util) | 🟠 (IDE plugin) |
| Route Mount/Transition/Unmount Events | ✅ | 🛑 | 🛑 |
| Devtools | ✅ | 🟠 | 🛑 |
| Basic Search Params | ✅ | ✅ | ✅ |
| Search Param Hooks | ✅ | ✅ | ✅ |
| `<Link/>`/`useNavigate` Search Param API | ✅ | 🟡 (search-string only via the `to`/`search` options) | 🟡 (search-string only via the `to`/`search` options) |
| JSON Search Params | ✅ | 🔶 | 🔶 |
| TypeSafe Search Params | ✅ | 🛑 | 🛑 |
| Search Param Schema Validation | ✅ | 🛑 | 🛑 |
| Search Param Immutability + Structural Sharing | ✅ | 🔶 | 🛑 |
| Custom Search Param parsing/serialization | ✅ | 🔶 | 🛑 |
| Search Param Middleware | ✅ | 🛑 | 🛑 |
| Suspense Route Elements | ✅ | ✅ | ✅ |
| Route Error Elements | ✅ | ✅ | ✅ |
| Route Pending Elements | ✅ | ✅ | ✅ |
| `<Block>`/`useBlocker` | ✅ | 🔶 (no hard reloads or cross-origin navigation) | 🛑 |
| Deferred Primitives | ✅ | ✅ | ✅ |
| Navigation Scroll Restoration | ✅ | ✅ | ❓ |
| ElementScroll Restoration | ✅ | 🛑 | 🛑 |
| Async Scroll Restoration | ✅ | 🛑 | 🛑 |
| Router Invalidation | ✅ | ✅ | ✅ |
| Runtime Route Manipulation (Fog of War) | 🛑 | ✅ | ✅ |
| Parallel Routes | 🛑 | 🛑 | ✅ |
| -- | -- | -- | -- |
| **Full Stack** | -- | -- | -- |
| SSR | ✅ | ✅ | ✅ |
| Streaming SSR | ✅ | ✅ | ✅ |
| Generic RPCs | ✅ | 🛑 | 🛑 |
| Generic RPC Middleware | ✅ | 🛑 | 🛑 |
| React Server Functions | ✅ | 🛑 | ✅ |
| React Server Function Middleware | ✅ | 🛑 | 🛑 |
| API Routes | ✅ | ✅ | ✅ |
| API Middleware | ✅ | ✅ | ✅ |
| React Server Components | 🛑 | 🟡 (Experimental) | ✅ |
| `<Form>` API | 🛑 | ✅ | ✅ |

[bp-tanstack-router]: https://badgen.net/bundlephobia/minzip/@tanstack/react-router
[bpl-tanstack-router]: https://bundlephobia.com/result?p=@tanstack/react-router
[gh-tanstack-router]: https://github.com/tanstack/router
[stars-tanstack-router]: https://img.shields.io/github/stars/tanstack/router?label=%F0%9F%8C%9F
[_]: _
[router]: https://github.com/remix-run/react-router
[bp-router]: https://badgen.net/bundlephobia/minzip/react-router
[gh-router]: https://github.com/remix-run/react-router
[stars-router]: https://img.shields.io/github/stars/remix-run/react-router?label=%F0%9F%8C%9F
[bpl-router]: https://bundlephobia.com/result?p=react-router
[bpl-history]: https://bundlephobia.com/result?p=history
[_]: _
[nextjs]: https://nextjs.org/docs/routing/introduction
[bp-nextjs]: https://badgen.net/bundlephobia/minzip/next.js?label=All
[gh-nextjs]: https://github.com/vercel/next.js
[stars-nextjs]: https://img.shields.io/github/stars/vercel/next.js?label=%F0%9F%8C%9F
[bpl-nextjs]: https://bundlephobia.com/result?p=next
Comment on lines +80 to +96
Copy link
Contributor

@coderabbitai coderabbitai bot Oct 17, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Remove unused reference definitions.

Several reference link definitions are defined but never used in the document. Remove the unused entries to clean up the file:

 [bp-tanstack-router]: https://badgen.net/bundlephobia/minzip/@tanstack/react-router
 [bpl-tanstack-router]: https://bundlephobia.com/result?p=@tanstack/react-router
 [gh-tanstack-router]: https://github.com/tanstack/router
 [stars-tanstack-router]: https://img.shields.io/github/stars/tanstack/router?label=%F0%9F%8C%9F
-[_]: _
 [router]: https://github.com/remix-run/react-router
 [bp-router]: https://badgen.net/bundlephobia/minzip/react-router
 [gh-router]: https://github.com/remix-run/react-router
 [stars-router]: https://img.shields.io/github/stars/remix-run/react-router?label=%F0%9F%8C%9F
 [bpl-router]: https://bundlephobia.com/result?p=react-router
-[bpl-history]: https://bundlephobia.com/result?p=history
-[_]: _
 [nextjs]: https://nextjs.org/docs/routing/introduction
-[bp-nextjs]: https://badgen.net/bundlephobia/minzip/next.js?label=All
 [gh-nextjs]: https://github.com/vercel/next.js
 [stars-nextjs]: https://img.shields.io/github/stars/vercel/next.js?label=%F0%9F%8C%9F
-[bpl-nextjs]: https://bundlephobia.com/result?p=next
🧰 Tools
🪛 markdownlint-cli2 (0.18.1)

84-84: Link and image reference definitions should be needed
Unused link or image reference definition: "_"

(MD053, link-image-reference-definitions)

90-90: Link and image reference definitions should be needed
Unused link or image reference definition: "bpl-history"

(MD053, link-image-reference-definitions)

91-91: Link and image reference definitions should be needed
Duplicate link or image reference definition: "_"

(MD053, link-image-reference-definitions)

93-93: Link and image reference definitions should be needed
Unused link or image reference definition: "bp-nextjs"

(MD053, link-image-reference-definitions)

96-96: Link and image reference definitions should be needed
Unused link or image reference definition: "bpl-nextjs"

(MD053, link-image-reference-definitions)

🤖 Prompt for AI Agents 
In docs/router/framework/react/comparison.md around lines 80 to 96, several
markdown reference link definitions (e.g., bp-tanstack-router,
bpl-tanstack-router, gh-tanstack-router, stars-tanstack-router, _, router,
bp-router, gh-router, stars-router, bpl-router, bpl-history, nextjs, bp-nextjs,
gh-nextjs, stars-nextjs, bpl-nextjs) are declared but not referenced anywhere in
the document; remove the unused reference definitions and leave only the
reference links that are actually referenced elsewhere in the file (or
consolidate duplicates like repeated [_] entries), ensuring the remaining
references are correct and the file still builds.

21 changes: 0 additions & 21 deletions docs/router/framework/react/overview.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,27 +25,6 @@ To get started quickly, head to the next page. For a more lengthy explanation, b

Using a router to build applications is widely regarded as a must-have and is usually one of the first choices you’ll make in your tech stack.

[//]: # 'WhyChooseTanStackRouter'

**So, why should you choose TanStack Router over another router?**

To answer this question, we need to look at the other options in the space. There are many if you look hard enough, but in my experience, only a couple are worth exploring seriously:

- **Next.js** - Widely regarded as the de facto framework for starting a new React project, it’s laser focused on performance, workflow, and bleeding edge technology. Its APIs and abstractions are powerful, but can sometimes come across as non-standard. Its extremely fast growth and adoption in the industry has resulted in a featured packed experience, but at the expense of feeling overwhelming and sometimes bloated.
- **Remix / React Router** - A full-stack framework based on the historically successful React Router offers a similarly powerful developer and user experience, with APIs and vision based firmly on web standards like Request/Response and a focus on running anywhere JS can run. Many of its APIs and abstractions are wonderfully designed and were inspiration for more than a few TanStack Router APIs. That said, its rigid design, bolted-on type safety and sometimes strict over-adherence to platform APIs can leave some developers wanting more.

Both of these frameworks (and their routers) are great, and I can personally attest that both are very good solutions for building React applications. My experience has also taught me that these solutions could also be much better, especially around the actual routing APIs that are available to developers to make their apps faster, easier, and more enjoyable to work with.

It's probably no surprise at this point that picking a router is so important that it is often tied 1-to-1 with your choice of framework, since most frameworks rely on a specific router.

[//]: # 'WhyChooseTanStackRouter'

**Does this mean that TanStack Router is a framework?**

TanStack Router itself is not a "framework" in the traditional sense, since it doesn't address a few other common full-stack concerns. However TanStack Router has been designed to be upgradable to a full-stack framework when used in conjunction with other tools that address bundling, deployments, and server-side-specific functionality. This is why we are currently developing [TanStack Start](https://tanstack.com/start), a full-stack framework that is built on top of TanStack Router and Vite.

For a deeper dive on the history of TanStack Router, feel free to read [TanStack Router's History](../decisions-on-dx.md#tanstack-routers-origin-story).

## Why TanStack Router?

TanStack Router delivers on the same fundamental expectations as other routers that you’ve come to expect:
Expand Down
3 changes: 0 additions & 3 deletions docs/router/framework/solid/overview.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,3 @@
title: Overview
ref: docs/router/framework/react/overview.md
---

[//]: # 'WhyChooseTanStackRouter'
[//]: # 'WhyChooseTanStackRouter'
Loading