V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
MorningStar0
V2EX  ›  程序员

说几点个人使用 nextjs 的感受

  •  
  •   MorningStar0 · 6 小时 24 分钟前 · 2054 次点击

    网页: https://freezer-home.ashesborn.cloud/ 仓库: https://github.com/sadofriod/freezer-home

    部署角度

    目前体验基本满分。结合 vercel 基本不用任何配置,就能快速部署。并且使用 cloudflare 的域名后,也可以实现让国内访问。

    开发体验角度

    无法在 server component 里直接使用 hooks ,ref 和 react 的事件收集( onChange 这类)的功能,所以有些动画需要原生实现,失去了 react 的很多便利性。

    SEO 角度

    由于可以将大部分内容直接通过静态页面返回,所以确实带来了巨大的提升。但是官方文档对于 robots ,sitemap ,meta 标签的 keywords 之类的常见功能没有提供一个比较好的解决方案(目前还是采用字符串模版拼接的方式,或者是我没仔细看),理想的情况下希望能提供几个函数来收集每个路由下的信息来解决这个问题。

    监控工具的集成角度

    目前我集成了 google analytics 、tag manager 、google 站长工具。官方提供了一个集成的 component 配置比较简单。

    server 负载角度

    对于大部分网页访问量不高的情况不会有问题,但虽然提供了 server component 的渲染缓存,但对于接入数据的变动 server component 来说,还是存在部分 CPU 密集型的计算在 nodejs 的 server 中,在访问量比较大的时候,还是需要考虑。

    总结

    总的来说,对于我个人来讲,如果没有强烈的 SEO 需求,对于一般项目的话不会采用 nextjs 。server component 和 client component 的分离,迫使我在状态管理上要做更多思考和操作。而且对于首屏的渲染在现在协商缓存的基础下,也只有用户收到新版本的网页的时候会有差距,其他大部分情况下差距不大。

    30 条回复    2024-12-20 18:33:26 +08:00
    tpxcer
        1
    tpxcer  
       6 小时 21 分钟前
    那你的描述似乎 NUXT 比较舒服些。
    zsj1029
        2
    zsj1029  
       6 小时 19 分钟前 via iPhone
    Astro 试试
    lavard
        3
    lavard  
       6 小时 15 分钟前   ❤️ 1
    生态为王,nextjs + tailwindcss + shadcn/ui 这套太能打了,太适合目前的 AI 时代了,很多产品只要描述下就能生成。就是 React 19 大改了, 很多第三方库还没跟上,用 next15 又上 React 19 又有点尴尬 , 开发体验还没那么快升上去,等周边生态吧。
    MorningStar0
        4
    MorningStar0  
    OP
       6 小时 14 分钟前
    @tpxcer 因为一直是 react 生态 nuxt 还没体验过
    MorningStar0
        5
    MorningStar0  
    OP
       6 小时 14 分钟前
    @zsj1029 之前用过,怎么说呢,感觉开发体验有点原始
    MorningStar0
        6
    MorningStar0  
    OP
       6 小时 12 分钟前
    @lavard 我是使用 MUI( https://mui.com/)这个库了,而且总感觉 css in js 比 tailwindcss 更适合 JSX 这种情况😂
    snowlee
        7
    snowlee  
       5 小时 31 分钟前
    开发体验确实不太行,热更新慢而且老报错

    如果不是考虑 SSR 还是用 Vite 开发舒服,生态完全可以自己选择,Vite + tailwindcss + shadcn/u,

    或者 Vite + mui or antd+ styled-compoents 都不错
    MorningStar0
        8
    MorningStar0  
    OP
       5 小时 23 分钟前
    @snowlee 我用 v15 ,现在在创建项目的时候可选 turbopack 了,所以热更新还挺快的。
    snowlee
        9
    snowlee  
       5 小时 16 分钟前
    @MorningStar0 #8 15 确实没太了解。https://www.snowlee.site/ 我的博客是 13 搭建的,基本加个新页面就要重新启动,然后热更新真的比 vite 慢好多好多
    Frankcox
        10
    Frankcox  
       5 小时 3 分钟前
    我是 SRE ,目前也刚刚开始自学 React 和 Next.js ,现在有个问题想请教下,React Next.js 开发时是需要明确区分服务端组件还是客户端组件吗?这些一般都是在设计的时候根据数据情况来进行区分吗?
    MorningStar0
        11
    MorningStar0  
    OP
       4 小时 55 分钟前
    @Frankcox 是的,在 server component 中是无法使用 useEffect 和 useState 这些常用 hook 的。如果当前组件是 client component 需要在文件最顶部声明。
    jun0205
        12
    jun0205  
       4 小时 53 分钟前
    觉得 nextjs 除了 api 比较好用,其它的算是把前端开发都变复杂了,然后开发环境是真慢,用 nextjs 主要还是为了使用 vercel
    cwliang
        13
    cwliang  
       4 小时 43 分钟前
    用过一段时间,体验不是很舒服,如果不考虑 SEO ,我是不会用这玩意的。
    13=>14=>15 每个版本变动很大,需要重新看文档。文档比较杂,同一个东西能看到好几种使用姿势。还有那个 NextAuth ,简直就是一坨。跑起来很吃内存,如果有内存泄漏问题,需要很强的 node.js 功底去排查,用起来成本挺高的
    9ki
        14
    9ki  
       4 小时 18 分钟前
    不喜欢 next.js 的一个重要原因是它的脚手架又重又难用, 和基于 vite 的一堆 ssr 框架相比体验差太远了
    witcan
        15
    witcan  
       4 小时 12 分钟前
    为什么我用最新版的 nextjs ,什么都不改,构建生产文件就报错,不知道是不是姿势不对
    fescover
        16
    fescover  
       4 小时 10 分钟前
    试试 react-router v7, 一个框架集齐 spa, ssr, ssg
    https://reactrouter.com/home

    搭配 trpc, 全栈开发体验丝滑
    https://github.com/SteveSuv/remix-t3-stack
    monkeyWie
        17
    monkeyWie  
       4 小时 2 分钟前
    我用 nextjs 不用它的 SSR ,我还是前后端分离,build 出来的静态文件放 CDN ,这样感觉最完美
    zhengfan2016
        18
    zhengfan2016  
       4 小时 1 分钟前
    公司主用框架就是 nextjs ,实话说我觉得 op 对 nextjs 很大概率仅存于业余上的使用或者就不是专业的 react 前端,才能得出 server component 不好用的结论。server 组件优势就是可以把一些内容移到水合前就填充进白纸 html 里,加快首屏渲染速度。至于 hooks ,你完全可以分离拆组件,而且 nextjs 允许你客户端和服务端组件相互嵌套,你只要不通过 props 传递 JSX 就可以,其实是有一丢丢像 astro 的岛,每个客户端组件就是一个岛

    推荐阅读国外其他前端 er 对 react 服务端的帖子: https://www.joshwcomeau.com/react/server-components/

    我是工作经验 1.5 年的 react 前端,如果你工作年限比我大,那么你说得对😁
    MorningStar0
        19
    MorningStar0  
    OP
       3 小时 33 分钟前
    @zhengfan2016 不好评价 可以看看我 blog
    zhwithsweet
        20
    zhwithsweet  
       3 小时 33 分钟前
    无所谓,我全都要 https://github.com/fisand/f3-app
    zhwithsweet
        21
    zhwithsweet  
       3 小时 32 分钟前
    MorningStar0
        22
    MorningStar0  
    OP
       3 小时 32 分钟前
    luvsic
        23
    luvsic  
       2 小时 53 分钟前
    @zhengfan2016 #18
    我也觉得 Next.js App router 的心智负担大,https://qwik.dev/ 的代码更好理解
    Plumbiu
        24
    Plumbiu  
       1 小时 22 分钟前
    @zhengfan2016 我觉得你也有误解,客户端和服务端是不能传递函数,不是不能传递 JSX ,你话说的范围缩小了
    yeluowjz
        25
    yeluowjz  
       1 小时 0 分钟前
    @cwliang 解析富文本的 json 数据,递归生成节点树的时候,图片类型用了 Image 组件,结果就内存泄漏了
    zhengfan2016
        26
    zhengfan2016  
       32 分钟前
    @Plumbiu 你说得对,确实是不能传递函数,这个我打错了
    ZZ74
        27
    ZZ74  
       26 分钟前 via Android
    @zhengfan2016 和 jsp 一样的.... 好不好用看项目。但是 jsp 被淘汰也是值得吸取的教训
    fyxtc
        28
    fyxtc  
       21 分钟前
    我去年用 13 写了个项目,然后今年又用 15 写了个项目,重新看 app router 概念,刚看的那时觉得很恶心,为什么变化这么大,用过了其实就还好。还有就是 server 里用 client hooks 很容易,直接把变化的部分抽成 client 就好了。整体来说新版适应后还是更舒服,数据交互写起来爽很多,不用像 13 一样到处都是 swr 和判断 loading ,直接在 server 里 db 出来就好了,用过了就回不去了
    zhjrcc
        29
    zhjrcc  
       18 分钟前
    感觉 OP 这种贴真挺好的,有经验的前辈可以讨论,然后我们有一些在学习的也能从你们的讨论中得到一些知识~~
    SkywalkerJi
        30
    SkywalkerJi  
       2 分钟前 via Android
    @lavard 现在对 ai 适配最好的就是 next 吗
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3290 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 21ms · UTC 10:35 · PVG 18:35 · LAX 02:35 · JFK 05:35
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.