TanStack
自动

为什么选择 TanStack Start 和 Router?

作者:Tanner Linsley,于 2024 年 12 月 03 日。

TanStack Start and Router Blog Header

构建现代 Web 应用程序绝非易事。我们选择的框架和工具不仅会影响我们的开发者体验,还会影响我们构建的应用程序的成功。虽然市面上有很多优秀的框架,但我相信 TanStack RouterTanStack Start 之所以脱颖而出,是因为它们能够解决开发者今天面临的挑战,并为未来的发展做好准备。

这些不仅仅是另一套工具,它们代表着一种承诺,即以更少的摩擦和更多的乐趣构建更好的应用程序。这就是为什么我认为你会像我一样喜欢使用它们。

您可以信赖的类型安全

类型安全不仅仅是一个流行语,它是创建健壮、可维护应用程序的基础工具。 TanStack Router 超越了基础知识,提供了上下文类型安全,类型可以在应用程序的每个部分无缝流动。路由定义、参数、导航,甚至状态管理都与完全推断的类型协同工作。

这对您意味着什么?这意味着不再需要猜测您是否正确定义了参数,不再需要调试类型不匹配的问题,也不需要额外的插件或 AST 转换来填补空白。 TanStack Router 与 TypeScript 的原生架构协同工作,使体验流畅、可预测且令人愉快。

这种级别的类型安全不仅节省时间,还能建立信心。而且我相信其他框架将花费数年时间才能赶上。

释放 URL 状态管理的强大功能

Web 开发中最容易被忽视但功能强大的工具之一是 URL。它是最初的状态管理系统 - 快速、可共享且直观。然而,许多框架将 URL 视为事后才考虑的事情,仅提供用于读取和写入状态的基本实用程序。

TanStack Router 颠覆了这种局面。在 URL 中管理状态不仅受到支持,而且还受到鼓励。借助直观的 API,您可以验证、读取和更新搜索参数,并内置类型安全和运行时验证。想要创建深度嵌套的动态过滤系统或将应用程序的状态与 URL 同步吗?这毫不费力。

但这不仅仅是为了开发者的便利性,更是为了创造更好的用户体验。当您的应用程序状态存在于 URL 中时,用户可以共享它、将其添加到书签,并在上次离开的地方继续操作。 TanStack Router 使这一切变得理所当然地容易。

熟悉的模式,更高的灵活性

如果您使用过 Remix 或 Next.js,您会在 TanStack Start 中找到许多熟悉的概念。但熟悉并不意味着妥协。我们从这些框架中汲取了一些最好的想法,并进一步推进它们,摒弃了约束,引入了更高的灵活性。

例如,如果您来自像 Remix 这样的服务器优先框架,路由模式和服务器功能集成会感觉很自然,但它们的设计同样适用于传统的客户端 SPA。您不必选择任何一方 - 您可以获得两全其美的优势,并且权衡更少。

为未来构建(并已拥抱未来)

Web 正在快速变化。随着 React 服务端组件(RSC)的临近,React 19 引入了新的模式,流式传输成为数据交付的标准,框架需要做的不仅仅是跟上步伐,还需要引领潮流。

TanStack Start 已为未来做好准备。 RSC 被视为另一种服务端状态,具有强大的原语,用于缓存、使失效以及将它们组合到您的应用程序中。流式传输并非事后才考虑 - 它已融入 TanStack 的核心工作方式,为您提供工具以增量方式将数据和 HTML 发送到客户端,而无需额外的复杂性。

但我们不仅仅着眼于面向未来。 TanStack Start 还使这些高级功能在今天变得平易近人和可用。您无需等待“下一个重大事件”即可开始构建感觉像未来的应用程序。

SPA 并没有消亡(我们只是让它们变得更好)

现在有很多关于服务器优先架构的讨论,虽然它们令人兴奋,但这并不是全部。单页应用程序 (SPA) 仍然是构建快速、交互式应用程序的绝佳方式,尤其是在正确完成的情况下。

TanStack Start 不仅使 SPA 保持活力,还使它们变得更好。凭借简化的模式、强大的状态管理和深度集成,您可以构建性能更高、更易于维护且使用起来令人愉悦的 SPA。无论您是优先使用服务器、优先使用客户端,还是介于两者之间,TanStack 都能为您提供构建所需应用程序的工具。

无与伦比的数据集成

如果您使用过 TanStack Query,您已经知道它在简化数据获取方面有多么出色。但 TanStack Query 和 TanStack Router 之间的集成才是真正神奇之处。预取数据、缓存结果和流式更新都是无缝、直观且可扩展的。

例如,您可以在路由加载器中预取数据,将其流式传输到客户端,并按需进行水合 - 所有这些都只需一个 API。无论您是管理简单的博客还是复杂的仪表板,您都会发现自己花费更少的时间连接数据,而将更多的时间用于构建功能。

这不仅仅是一个集成,它是路由和数据获取之间的合作伙伴关系,相比之下,其他一切都显得笨拙。

可扩展的路由

路由不仅仅是一个实用程序,它是每个应用程序的支柱。然而,当事情变得复杂时,大多数路由器都会遇到困难。这就是 TanStack Router 的闪光点。它旨在处理从少量简单路由到数千个深度嵌套的路由的所有事情,而不会费力。

类型安全的导航、分层路由上下文和高级状态同步等功能使构建在规模和复杂性方面都能扩展的应用程序变得容易。而且由于 TanStack Router 原生支持 TypeScript,因此您可以在不牺牲性能或灵活性的情况下获得类型安全的所有优势。

始终在创新

TanStack 最让我兴奋的是,我们才刚刚开始。从同构服务器功能到强大的缓存原语和简化的 React 服务端组件支持,我们不断突破可能的界限。我们的目标不仅仅是构建出色的工具,而是构建能够帮助构建更好的应用程序的工具。

满足于“足够好”?

其他框架各有优势,但如果您正在寻找创新、灵活且深度集成的工具,那么 TanStack Router 和 Start 将是独一无二的。它们不仅解决了今天的问题,还在帮助您构建为明天做好准备的应用程序。

那么,为什么要等待呢?立即探索 TanStack RouterTanStack Start,看看应用程序开发可以变得多么美好。

让我们一起构建一些令人惊叹的东西吧!