前后端通讯(React vs Next.js)

前后端通讯(React vs Next.js)
React vs Next.js

一、Next.js 面试追问(SSR / SSG / ISR 深挖)

1️⃣ 面试官:SSR、SSG、ISR 本质区别?

❌ 初级回答

一个服务端渲染,一个静态生成

✅ 中高级标准回答(一定按这个结构)

本质区别在于 HTML 生成的时机不同

渲染方式

生成时机

前后端通讯(React vs Next.js)

适合场景

SSR

每次请求

个性化数据

SSG

构建时

内容稳定

ISR

构建后增量

内容半实时


面试官追问:

ISR 是怎么做到“不重新构建”的?

✅ 你要答:

  • 第一次访问 → 用旧 HTML
  • 到期后 → 后台重新生成
  • 下次访问 → 新 HTML

关键词一定要说:

stale-while-revalidate


2️⃣ 面试官:SSR 会不会拖慢服务器?

❌ 错误回答

会,很慢

✅ 正确回答

会增加服务器压力,但可通过缓存、CDN 缓解

你要提 3 点:

  1. 页面缓存
  2. 数据缓存
  3. CDN

加一句秒杀:

“SSR 性能问题不是不能用,而是要配合缓存策略。”


3️⃣ 面试官:Next.js 13 App Router 和 Pages Router 区别?

核心一句话

App Router 是 以 Server Components 为核心的架构升级


对比重点(面试必考)


Pages Router

App Router

渲染模型

CSR/SSR

RSC

数据获取

getServerSideProps

fetch(服务端)

Layout

内置 Layout

Streaming

面试官爱听:

“App Router 减少 JS 体积,把计算前移到服务端。”


4️⃣ 面试官:Server Components 有什么优势?

你一定要说:

  • 不打包到客户端
  • 可直接访问数据库
  • 减少 JS 体积
  • 提升首屏性能

禁忌点(一定要说你知道):

Server Component 不能用 useState/useEffect


二、React vs Next.js 项目选型模拟题(必过)

5️⃣ 面试官:一个后台系统,你选 React 还是 Next.js?

❌ 错误

都可以

✅ 正确

纯 React

理由(说 3 点):

  1. 不需要 SEO
  2. 页面多、交互复杂
  3. SSR 成本高、收益低

6️⃣ 面试官:一个官网 / ToC 产品?

✅ 标准答案:

Next.js

理由:

  • SEO
  • 首屏
  • 分享预览
  • 多终端访问

7️⃣ 面试官:一个混合项目怎么选?

高级回答(很加分):

后台:React
官网 / 营销页:Next.js
共享组件 & 设计体系

体现你有架构思维


三、把你项目包装成 Next.js 面试亮点(直接可用)

下面我给你 “项目亮点 → 面试问题 → 标准答案”


亮点 1:SSR + SEO 优化

面试官:你为什么用 SSR?

✅ 回答模板:

我们首页和内容页对 SEO 要求高,用 SSR 输出完整 HTML,提高首屏和收录。


亮点 2:ISR 提升构建效率

面试官:为什么不用纯 SSG?

✅ 回答模板:

内容更新频繁,纯 SSG 构建成本高,用 ISR 实现增量更新。


亮点 3:Server Components 减少 JS 体积

面试官:RSC 带来了什么收益?

✅ 回答模板:

减少客户端 JS,首屏加载明显改善,复杂计算放在服务端。


亮点 4:API Routes / Server Actions

面试官:为什么不用单独后端?

✅ 回答模板:

作为 BFF 层,减少前后端通信复杂度,适合轻业务。


亮点 5:性能优化(必说)

你可以说你做了:

  • Image Optimization
  • Dynamic Import
  • Streaming
  • Prefetch

面试官爱听一句:

“Next.js 默认优化,但我们会针对业务再调优。”


四、面试最后总结(你直接背)

React 更适合复杂交互和后台系统,
Next.js 更适合首屏、SEO、对外产品。
技术选型一定是围绕 业务目标和成本


下一步我可以继续直接帮你做

1️⃣ Next.js + React 模拟一小时面试(全追问)
2️⃣ 把你真实项目改成 Next.js 面试话术
3️⃣ 深圳 13–20k 岗位面试套路拆解


文章版权声明:除非注明,否则均为边学边练网络文章,版权归原作者所有

相关阅读

最新文章

热门文章

本栏目文章