V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Carson089
V2EX  ›  程序员

LLM 大模型产品的前端架构选择 - React vs Vue?

  •  
  •   Carson089 · 70 天前 · 2117 次点击
    这是一个创建于 70 天前的主题,其中的信息可能已经有所发展或是发生改变。

    作为一名算法工程师,我最近开始学习 React 框架,目标是将大模型 LLM API 与前端框架对接。虽然平时主要与业务、产品和后端团队交流,但我意识到掌握前端技能对于独立开发 LLM 产品至关重要。

    我已经对大模型的微调和高效部署有了一定了解,现在想进一步学习前端架构。观察到目前国内外主流大模型(如 OpenAI 、Claude 、Gemini 、通义千问、智普 AI 等)都提供网页版和 APP 版工具。

    虽然大模型聊天页面的前端代码看似不复杂,但 HTML 布局设置仍然让我感到困惑。我特别好奇这些产品使用的是什么前端框架 - React? Vue? 还是其他?

    同时,我也想了解:

    这些框架在开发 LLM 产品时各有什么优势? 对于新手来说,哪个框架更容易上手? 有没有针对 LLM 产品开发的特定前端最佳实践? 作为一个正在学习前端的后端/算法工程师,非常感谢各位的建议和经验分享!

    24 条回复    2024-09-14 19:46:37 +08:00
    wunonglin
        1
    wunonglin  
       70 天前
    [我特别好奇这些产品使用的是什么前端框架 - React? Vue? 还是其他?]

    ChatGPT 是:


    [哪个框架更容易上手?]
    React
    xshell
        2
    xshell  
       70 天前
    同问·
    weixind
        3
    weixind  
       70 天前   ❤️ 3
    有其他编程语言基础的的一律推荐 React 。
    没有一点编程基础,想转行做前端的推荐 Vue 。
    java 狂热爱好者推荐 Angular 。
    Carson089
        4
    Carson089  
    OP
       70 天前
    图片看不到,chatgpt 使用的也是 react?
    woodytang
        5
    woodytang  
       70 天前
    LLM 也是前端页面,什么框架没啥差别,最多有个流式处理需要考虑,可以去 github 调研一下,主流大部分的都是 nextjs 开发的,如果要问 React vs Vue 哪个好,是送命题,会被骂死,但如果你那枪指着问我,我会选 react ,主要因为生态。但是 react 是这样,上手非常简单,精通有点陡峭,对新手来说,它是要你去适应它,而不是它来适应你。你不要期望一两天就可以用得心应手。
    如果你是要做生产环境的项目,那 React 和 Vue ,只是一小部分知识,前端还有无数坑需要需要踩,做 demo 没问题。

    我建议你简单的看一下 react ,弄懂基本原理,然后直接学 nextjs ,因为 nextjs 是一个框架,react 的话你还要配各种插件。
    vue 一站式,国内比较流行。

    等你有一定基础了,可以看看我的课程 https://www.01crafter.com/course/1 :)
    hackyuan
        6
    hackyuan  
       70 天前
    虽然我用 Vue 做大模型产品,但这取决于之前做低代码积累比较多的相关技术。
    没有积累的建议直接上 React ,可以直接抄 dify ,其他质量还可以的大模型产品基本是 React 。Vue 产品不错的也有,但不开源。
    horizon
        7
    horizon  
       70 天前
    react + tailwind
    可以用 https://v0.dev/chat 生成页面
    hackyuan
        8
    hackyuan  
       70 天前
    如果你只是想做 ChatGPT 这种对话类的产品,对话侧的 Markdown 支持、富文本支持、WebSocket 流式数据跟框架又无关,你上什么技术栈都行。
    Carson089
        9
    Carson089  
    OP
       70 天前
    @woodytang 流式这个,大模型部署框架一般都支持流式,对于前端请求我想处理应该不难吧?(不懂)。 其实我的想法是考虑,前后端分离这样的架构,大模型 API 封装好,写一个后端的程序,收到前端的问题后,结合各种 prompt 选择与拼接,RAG 向量数据召回,对轮对话等。 问题是前端布局感觉很难懂,一个小按钮、对话框,我看到需要比较多 html 代码,以及 js 请求 api 后需要相应的处理,这部分感觉复杂。
    Carson089
        10
    Carson089  
    OP
       70 天前
    @hackyuan 我也有自己部署开源项目,类似于大模型应用的 demo ,RAG 、Agent 这种。但是大部分都很重,整个框架很大,看不懂前端部分的内容。还有最近部署了一个简单一点的项目,里面是直接是 flask 读取 assert.py (里面包含 html 、js 等字符串内容),直接看懵了
    Carson089
        11
    Carson089  
    OP
       70 天前
    @horizon cursor 对吧,我上次使用要我付费,我再看看能不能用。。。
    mightybruce
        12
    mightybruce  
       70 天前
    实话是用这些前端框架都是错误的,
    我看到的很多产品原型都是用 python 写的,记住前端也是 python 写的
    可以看看 gradio 和 streamlit 这两个项目
    此外 数据和图表分析用这个 streamlit 有着天然的优势, 尤其是对 pandas 支持。
    mightybruce
        13
    mightybruce  
       70 天前
    Carson089
        14
    Carson089  
    OP
       70 天前
    @mightybruce 你说的也对。gradio 可以快速搭建出活,去做 demo 的话很合适。但是如果开发产品级应用,增加插件、功能等,感觉不好拓展。
    woodytang
        15
    woodytang  
       70 天前
    @Carson089 不难,但是流式数据一直在进行,还需要中断等等,有不少状态细节需要处理。从头撸聊天本身就蛮多细节的,等你做的时候就知道了。css 及其布局,这个我认为是最难的,内容很多,难度超过很多大型语音。当然我说的是精通,上手不难。你使用 react 和 vue 不会帮你解决 css 布局的问题,还是需要自己撸的。
    Tailwind 其实是一个非常好的解决方案和 学习方案,但是我有点怀疑 对新手来讲直接学会不会有问题~

    在动手之前,建议你思考 3 个问题,比如你写好了一个 PC 的网站,那手机怎么办,手机是怎么适配的,还是说写 2 套代码?
    黑白模式是怎么实现的,或者说主题切换是怎么实现的?
    多语言是怎么实现的?

    这个三个问题说简单也简单,说复杂可以很复杂。但如果能想明白,就有前端思维了,少走很多弯路,
    有不少程序员写了几年代码了,也没搞太清楚,或者没有很好的解决方案。
    GeekGao
        16
    GeekGao  
       70 天前
    没所谓。据我所知 OpenAI 用的是 React ,但是没所谓。
    ychost
        17
    ychost  
       70 天前
    建议 React ,这玩意生态十分繁荣,VUE 虽然也有生态但是维护的不好比如 Antd Modal 框关不掉的 BUG 现在都没解决
    jhdxr
        18
    jhdxr  
       70 天前
    无所谓+1.

    但如果非得选一个,那我来唱个反调,如果只是有简单的 python 经验我建议还是 vue ,相对来说容易上手的多。

    缺点是我认为生态还比不上 react 。并不是说 react 有的东西 vue 就没有对位的,而是 react 有时候有好几个选择(这既是优点也是缺点)但 vue 的生态里选择并没有那么广泛。就比如上面有人提到的 antd 的 vue 版相对 react 版落后了好几个版本(虽然本来 vue 版就算是移植的),而且维护跟不上。


    哦对了,无论选 react 还是 vue ,建议用 ts 而非 js 。
    chesha1
        19
    chesha1  
       70 天前
    从世界范围来看,react nextjs tailwindcss prisma trpc 这一套应该是最流行的
    gogogo1203
        20
    gogogo1203  
       70 天前   ❤️ 1
    当然有所谓了, 必选 React. 只因为一点,github 上开源的 React 项目大把大把的。 现在做前端, ts/tailwind 基本是绕不开的。 https://chat.vercel.ai/ https://novel.sh/ https://reactflow.dev/ 你能想到的交互方式都能找到设计优良的开源项目. 拔下来, 用 cursor 问答就完事了
    zhuoyan
        21
    zhuoyan  
       70 天前
    框架只是工具,自己用着顺手就行。新手肯定 vue 更容易上手。
    xslong
        22
    xslong  
       70 天前
    我很熟 Vue ,最近也在看 React 、Next.js
    GiantHard
        23
    GiantHard  
       70 天前
    > 但 HTML 布局设置仍然让我感到困惑

    你需要学习 CSS ,掌握 flexbox 相关的属性

    > 这些框架在开发 LLM 产品时各有什么优势? 对于新手来说,哪个框架更容易上手? 有没有针对 LLM 产品开发的特定前端最佳实践?

    不太用纠结 React/Vue ,因为这俩都是用来做 UI 数据绑定的,避免你手动根据业务逻辑拼接 HTML 字符串。有 LLM 帮忙写代码的话,Vue/Angular 更简单,因为依赖收集是全自动的,对 LLM 会更加友好一些;当然,React 也适合 LLM 写,因为公开的 React 代码库比较多。
    cosmicray
        24
    cosmicray  
       69 天前
    我最近也面临这个问题,问了一些有独立站点开发经验的人,给我的建议是:无论用什么工具,先借助 ai 把基本功能搭建起来把坑占上,然后再考虑技术栈的问题。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2907 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 08:01 · PVG 16:01 · LAX 00:01 · JFK 03:01
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.