想象一下：您是一名 React 开发人员，在 Next.js 的世界中游刃有余，享受服务器端渲染 (SSR)、静态站点生成 (SSG)、API 路由以及所有随之而来的功能。 Next.js 已成为您值得信赖的伴侣，指导您应对现代 Web 开发的复杂性。
但是，在你的眼角，你看到了Remix。它看起来像是另一个试图加入不断增长的 React 生态系统的框架。但是等等——这是由React Router背后的同一团队创建的。这难道不值得关注吗？
你情不自禁地问自己，“Remix 只是另一个流行词，还是还有什么东西值得我认真考虑？”
让我立即消除这个疑问：Remix 不仅仅是 Next.js 的替代方案 - 它是构建 Web 应用程序的一种新的、更优越的方法。是时候抛开 Next.js 的限制，用 Remix 拥抱下一代 Web 开发了。
在这篇博客中，我将详细解释为什么 Remix 应该成为您的首选框架，为什么开发人员放弃 Next.js，以及为什么这可能是您一直在等待的框架。
没有绒毛。没有炒作。只是事实。 让我们深入探讨。
我们来谈谈大家在选择框架时最想知道的一点：性能。毕竟，您正在为速度至关重要的现实世界构建应用程序 - 对于用户、搜索引擎以及最终您的业务。
在Next.js中，您可以使用getServerSideProps、getStaticProps，甚至getInitialProps来管理数据获取。但事情是这样的：它们都会在数据和组件之间造成脱节。这就像为您的组件和数据拥有一条单独的装配线，迫使它们稍后同步。
输入 Remix 及其 Loaders。加载器模式是天才，因为它将数据获取过程直接与路由联系起来。每个路由的加载器都可以在渲染组件之前获取数据，为您提供更流畅、更高效的加载体验。这种方法消除了不必要的复杂性，并最大限度地减少 JavaScript 执行，使您的应用程序更快。
混音示例：
// app/routes/products.jsx
import { useLoaderData } from "remix";
export function loader() {
return fetch('/api/products').then(res => res.json());
}
export default function Products() {
const products = useLoaderData();
return (
<div>
{products.map(product => (
<div key={product.id}>{product.name}</div>
))}
</div>
);
}
在 Next.js 中（实现相同的目的）：
// pages/products.js
export async function getServerSideProps() {
const res = await fetch('/api/products');
const products = await res.json();
return { props: { products } };
}
export default function Products({ products }) {
return (
<div>
{products.map(product => (
<div key={product.id}>{product.name}</div>
))}
</div>
);
}
注意到区别了吗？在 Remix 中，所有内容都整齐地封装在加载器中，使您的组件更简单，样板代码更少。
Remix 不会预先加载不必要的 JavaScript，这直接导致更快的加载时间。 Next.js 可能会在页面交互之前使用巨大的 JS 包来填充整个应用程序，但 Remix 可确保仅在客户端加载必要的内容。
这种渐进式水合作用方法确保用户可以几乎立即开始与页面交互，而无需等待整个应用程序加载。想一想：当您的用户准备好时，您的应用程序就准备好了。
Next.js 面临的最大挑战之一是处理客户端水合作用和渲染——尤其是当您拥有包含动态内容的大页面时。 Remix 通过优化从服务器到客户端的渲染流程来消除这一问题，确保更少的重新渲染和更少的数据获取发生在客户端，这会导致页面加载速度更快。
底线？ Remix 页面加载速度更快并且不需要太多繁重的客户端 JavaScript，这会带来更好的性能和搜索引擎优化。
既然我们已经解决了性能问题，那么我们来谈谈开发者体验。如果您像我一样，您想要的框架不仅仅是“完成工作”，而且让您的生活更轻松，让您能够完成工作而无需与样板代码或无休止的斗争配置.
这就是Remix真正闪耀的地方。
Remix 最强大的功能之一是嵌套路线。这意味着您可以直接在路由配置中精细地定义布局和组件，并跨页面共享它们而不会使您的应用程序膨胀
。Remix 中的路由系统非常直观。它本质上是增强版的React Router。 Remix 不是在页面中嵌套组件并处理道具钻取，而是为您提供嵌套布局
，其中每个页面都是独立但无缝连接的。Next.js 为您提供错误边界，但 Remix 使它们成为一等公民。不再到处抛出 try-catch 块或编写复杂的错误处理逻辑。借助 Remix，每条路线都会自动包含在错误边界中，这使得处理错误变得干净而简单。
那么，Remix 真的是货真价实的吗？准备好生产了吗？绝对的。
让我们看看一些已经转向Remix的公司：
OpenAI 将其生产系统迁移到 Remix，以提高性能并减少对客户端渲染的依赖。他们的网站现在加载速度更快，只需向客户端发送最少的 JavaScript，使其快速流畅。
Shopify 的自定义网络应用程序改用 Remix 来处理需要强大的服务器端渲染和更快的数据获取的大型应用程序。结果呢？应用程序可扩展性、性能和用户体验大幅提升。
如果您仍然对 Remix 持观望态度，以下是底线：
Next.js 为我们提供了很好的服务，但时代已经变了。 Remix 提供了一种更干净、更快、更高效的方式来构建现代 React 应用程序。这就像从轿车升级为高性能跑车。当然，轿车可以带您从 A 点到达 B 点，但有了 Remix，您将更快地到达目的地，拥有更多控制力，并且一路上享受更多乐趣。
如果您准备好拥抱未来，请切换到 Remix。以后你会感谢自己的。
立即开始使用 Remix 进行构建，查看他们的官方文档 — 是时候将 Next.js 留在后视镜中了。
需要速度吗？ 准备好掌控一切了吗？ 加入混音革命。
以上是停止运行 Next.js — Remix 是 React 的未来，这就是你错过的原因的详细内容。更多信息请关注PHP中文网其他相关文章！
