V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
lalalaXxx
V2EX  ›  前端开发

前端众多技术栈中,当今主流的技术框架究竟该怎么选?

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

    前言

    我是一名特别热爱前端的后端仔,自己平时就是学习前端技术,目前可以写 vue,ts,js ,wx,最近在学 react ,学习 react 的时候,发现很多好用的框架, 如 nextui, next.js ,Framer Motion 等....  感觉 react 跟 vue 差别还是挺大的;
    

    需求

    在自己学习前端的时候 感觉自己还是比较喜欢 css ,可以按照自己的想法来实现一些样式及效果,我发现自己很热爱,工作之余我都会写一些稀奇古怪的页面,就是心里面有自己的设计方案,然后用 css/ html 或者 ts js 来构建出来,但是学习的东西越多,感觉前端东西真的好杂, 就不像后端,java 一个 jdk 一个 spring 统治了..
    
    像我目前所了解的前端的技术栈中 如 
    node.js
    next.js
    nuxt.js
    nest.js
    vite
    webpack
    npm
    pnpm
    yarm
    vue
    react
    ts
    js
    css
    sass
    
    哇 我写到这里我已经头都大了,而且前端的技术栈更新太快了,v1 和 v2 版本完全不兼容,甚至语法糖都变了。
    

    最后

    因为我喜欢写稀奇古怪的页面,最近我都会用 next.js 去写,他的路由模式 包括页面写法,都挺适合我的,但是我觉得他还是比 vue 要难理解的多,所以到现在我写代码还需要去看着官方文档去研究... 所以我发现一个问题, 以 Next.js 和 java 对比的话 是否可以理解为以下的关系?
    
    node.js = jdk
    react = java
    next.js = spring
    是这个逻辑吗,还有一种情况,我想写一个 react 项目,我使用 next.js 去编写,当然我又希望他效率能高一些,我又会选择 vite ,因为网络 我有会使用 pnpm 来装依赖, 就会产生各种而样的问题,我真的很头大,所以我想问问,针对我这种,就是纯对前端的热爱,喜欢最新的技术,而且喜欢写一些设计感的页面,大家推荐我学的主方向是什么?
    
    39 条回复    2024-03-15 17:50:58 +08:00
    estk
        1
    estk  
       247 天前 via iPhone   ❤️ 1
    nextui.org 一把梭
    BeiChuanAlex
        2
    BeiChuanAlex  
       247 天前
    前端搞来搞去其实底子还是:js 、css 、html 三剑客。
    MorningStar0
        3
    MorningStar0  
       247 天前
    有一说一,如果你对 SEO 没有要求的话,nextjs 可以不太关注。
    你可以只用 react 然后用 nginx 来启动一个 static source server 。
    vite 和 webpack 真的会为开发体验带来很多优化么?我觉不一定,尤其 vite 的 build 和 dev 是两种不同的路线,如果你想在 complie 阶段搞点花活,可能还需要额外的关注兼容问题。
    ck65
        4
    ck65  
       247 天前   ❤️ 1
    目前转向了 remix + vite + tailwind 的技术栈,开发体验很不错,部署也非常轻松,不挑运行时想部署在哪很自由
    rabbbit
        5
    rabbbit  
       247 天前
    我自己是觉得 Webpack Vite Rollup 这种东西都是工具,指不定啥时候就淘汰了(例如曾经的 Gulp Grunt 。选一个拿来用就好,用的时候翻翻文档。
    也懒得去研究底层原理,又不是大厂手脚架开发。
    自己写小项目就 Vite ,开发 package 就 Vite 、Rollup ,公司里就 Webpack 。
    还有 npm yarn pnpm 也没感觉有啥区别,换个国内的镜像速度都差不多。就 npm 还不用担心某些包不兼容。

    个人还是觉得研究不会过时的东西性价比更高,例如 CSS JavaScript 算法 图形学 WASM
    rabbbit
        6
    rabbbit  
       247 天前
    前端很多页面一年的能写、三年的也能写,很轻易的就被替代了。
    所以我现在就喜欢学那些不容易上手学习曲线陡峭的,例如 GLSL 、RxJs 、WASM 。
    jin5354
        7
    jin5354  
       247 天前
    @rabbbit 你搁那研究 glsl ,rxjs 有啥用,前端没几个落地应用
    讲个笑话,我毕业前三年就是做 webgl 的,后来找不到工作转传统前端,还是切图写营销页面。
    rxjs 更搞,我们团队现在用的就是某前端知名轮子哥手撸的 rxjs 数据流状态管理工具,因为太他妈难用了今年全部下线换成标准的 zustand valtio 那一套。不过轮子哥已经趁这个刷了一波简历跳槽出去当 CTO 了
    rabbbit
        8
    rabbbit  
       247 天前
    @jin5354 我这里公司用啊,Web 3D 模型啥的用 Shader 写动画,部分组件或者页面内部用 Rxjs ,例如上传文件点击取消的时候中断某些操作很方便。
    全局 Rxjs 管理数据状态是什么鬼?纯折腾人吧。
    rabbbit
        9
    rabbbit  
       247 天前
    @jin5354
    除了 AngularJS ,前端项目全部用 RxJs 那一套就是折腾人。谁建议的啊?不拉出去打一顿。
    rabbbit
        10
    rabbbit  
       247 天前
    @jin5354
    翻了下帖子,美团出来的找不到工作?现在经济这么差吗?
    huijiewei
        11
    huijiewei  
       247 天前   ❤️ 2
    remix + vite + tailwindcss + shadcn ui 最大灵活性
    rabbbit
        12
    rabbbit  
       247 天前
    @jin5354
    看了下 Github ,原来是大佬。失敬失敬。想必找不到应该是指找不到大厂 30+ 的 WebGL 工作。
    咱都是中小公司混口饭吃的,偶尔项目需要用点 Three.js 啥的,远够不上 WebGL 开发,更称不上研究 GLSL ,确实没用。
    如有得罪,还望您大人不计小人过,宰相肚里能撑船。在此向您道歉。
    connection
        13
    connection  
       247 天前
    @jin5354 绝大情况下,为了面试
    SayHelloHi
        14
    SayHelloHi  
       247 天前   ❤️ 1
    Next.js + tailwindcss + shadcn/ui
    orzorzorzorz
        15
    orzorzorzorz  
       247 天前   ❤️ 1
    提一嘴 angular ,填空式开发。五六年前我也在前端圈的三座大山前陷入囹圄,后来懒得折腾了,发现 angular 就是我想要的。那之后我可以去研究要用各类前端、后端库做的那个东西的来源了。
    你要爱折腾,可以去把精力花在 webgl 这种,代表是 three.js 。搞来搞去,什么 ts(x)、nxxx.js ,最后都会转化成“你需要做什么”、“怎么做协作效率最高”的问题。到那时候回过头来看,当初争什么 react 、vue ,空格缩进的一万种 lint ,性能的虚空靶,都是浮云,最后还是可能还是要回到 java 跟 js 这种生态圈比较丰富的语言上,然后再在这上面挑。
    如果我回到刚入行那会,我只会劝自己学好看文档和 debug 的能力,并用空余时间学好乐理,以保证自己平和稳定的情绪。
    最后回到正题。图酷炫的东西可以去看看阮老师的周报,http://www.ruanyifeng.com/blog/atom.xml ,我个人觉得挺开阔视野的。
    jin5354
        16
    jin5354  
       247 天前   ❤️ 2
    @rabbbit 你本身就在 webgl 行业那精进一下挺好的。我是不推荐新人花力气研究这几项,没啥性价比。我最早在酷家乐入行,后来想跳槽出来发现头部厂子 webgl 项目就那么几个,招人很少( echart ,antv ,XX 地图,还有美团无人机这种奇怪的部门),web3D 行业太小了,去美团就不搞 3d 了,只搞钱。Rxjs 也是,过重了,99.9%的前端项目都用不到。说到面试,不是垂类的话,面试官也不懂这些,也不好判断你的水平高低。我现在连欧拉角四元数啥的都忘光了,我是废物。
    rabbbit
        17
    rabbbit  
       247 天前
    @jin5354
    确实,WebGL 行业岗位很少,而且都是大厂。估计比起只懂一点 Threejs 前端,他们更喜欢招会 OpenGL 图形学的来写 WebGL 。
    大部分公司都是用 Three.js 做数字孪生,说不好听一点就是加载了一堆模型然后加上点酷炫的动画和交互。
    其实国外 Webgl 在网页 UI 、交互方面用的也挺多的,例如很多酷炫的网页动效都是用的 Shader ,例如: https://hape.io/

    我个人是希望往这种类似于前端的“游戏行业技术美术”的方向发展,不过国内貌似这种岗位也挺少的,希望以后能有发展吧,权当是技术储备了。
    chuck1in
        18
    chuck1in  
       247 天前
    @jin5354
    @rabbbit
    两位大佬,请问下 threejs 用的很少吗?
    怎么听说有些小公司对这个还是有需求哦,比如弄一个模型放在网上用来给客户展示,这种难道没有需求吗?
    rabbbit
        19
    rabbbit  
       247 天前
    @chuck1in
    会用 Three.js 和 WebGL 开发是两回事,Three.js 是一个封装度很高的 3D 库,而 WebGL 是底层的 API 。粗略的比较可以说 WebgGL 开发就是开发针对某特定行业、需求的 Three.js 。
    很多做传统制造业、toG 业务的公都司有 3D 可视化的需求,这些需求大部分都可以用 Three.js 完成,不需要都太多的图形学知识。
    subframe75361
        20
    subframe75361  
       247 天前
    同样的情况,有一条心得:自己怎么舒服怎么来

    从来不写 js ,脚本都是用 esno 启动的,vite/vitest/solid.js/unocss/kysely ,只用 eslint 不用 prettier ,原理啥的感兴趣的看一看,dom 操作全靠框架,没有轮子就造一个,主打一个开心就好
    chuck1in
        21
    chuck1in  
       247 天前
    @rabbbit 明白了。我就是想问这个问题,也就是说如果这种传统行业如果有 3d 可视化的需求的话,只需要直接上手学 three.js 就可以了,不用再去 webgGL 了吧(如果自身没有深入需求,只需要完成业务功能)
    chuck1in
        22
    chuck1in  
       247 天前
    @rabbbit 另外请教一下两位大佬现在 2D 动画还有必要学吗。不是 css 动画,是指 js 动画,canvas 那一套。单纯只讨论哪种国内的普通的公司,对这个是否还有需求,仅仅完成业务需求。不谈深入和精通。
    rabbbit
        23
    rabbbit  
       247 天前   ❤️ 1
    @chuck1in
    我不是大佬
    初级前端 WebgGL 没必要去学,这个涉及的知识内容其实都不能算前端了。
    Three.js 需不需要学也不好说,个人感觉这玩意跟一般的前端库没啥区别,有业务需求翻翻文档、谷歌啥的参考别人写的基本都能实现,可能就是 Shader 麻烦点,这玩意语法类似 C 不好调试,写起来像在做数学题。
    普通的 UI 动效没啥难度,找个 js 动效库例如 GSAP 看文档都能写。
    至于高级点的涉及 shader 的动效、canvas 啥的,这种要求会的公司也少。
    感觉初级的时候还是应该打好基础,HTML CSS JavaScript Vue 和 React 选一个学习。
    courtier
        24
    courtier  
       247 天前
    我感觉只要不是打算拿去面试,只是单纯的自己研究自己玩,随便选一个技术栈学下去都能用上好几年吧,没必要强求追新,面试除外...可能会问各种东西的原理源码之类
    wpzz
        25
    wpzz  
       247 天前
    专注后端吧,职业厚度比前端好
    cdlnls
        26
    cdlnls  
       247 天前
    我觉得可以看看 Flutter ,兼容所有前端,ios android windows macos web 一步到位。
    正好你也是后端,再写写接口,嘿嘿
    jin5354
        27
    jin5354  
       247 天前   ❤️ 1
    @chuck1in 2D 动画业务上现在用 lottie 的很多,不咋需要自己写。lottie 是设计师的工具直接导出来的,你直接调用就行,没难度(只要公司还有正经设计师,不是啥都让前端自己想着做)。3D 中小厂有需求,大厂需求比较少。
    Immortal
        28
    Immortal  
       247 天前
    自己项目我都是 sveltekit 写得爽
    公司的一般都是 React/NextJS 和 Vue/NuxtJS 多,毕竟生态好
    wm5d8b
        29
    wm5d8b  
       246 天前 via Android   ❤️ 1
    如果只是热爱前端,不想拿起饭碗的话,我觉得还是学学前端框架的设计思想吧,对后端的借鉴意义蛮大的
    node.js = jre
    html 、js 、css = java
    react 、vue = 语法糖
    cocong
        30
    cocong  
       246 天前
    不要期待一次选对,选错就重来,问题不大,没什么好纠结。
    theprimone
        31
    theprimone  
       246 天前
    @huijiewei #11 SSR 呢?
    zhhbstudio
        32
    zhhbstudio  
       246 天前
    喜欢 vue 想用 nextjs => nuxtjs
    hesetiema
        33
    hesetiema  
       245 天前
    3D 动画业务上现在也有用 spline 的,不过它刚出来那时候性能不怎么样,不知道现在优化得怎么样。
    chuck1in
        34
    chuck1in  
       244 天前
    @Immortal 用过 sveltekit ,别的没用过。不过想问下这个和 NuxtJS 相比哪个便利性更强呢?目前一直用的 svelte ,国内似乎用这个的很少。
    Immortal
        35
    Immortal  
       244 天前
    @chuck1in #34
    理论数据上是 Svelte,体感上差异不大.具体数据来自: https://krausest.github.io/js-framework-benchmark/
    国内用 Vue 多我的理解是一些原因:
    1. 简单好上手,所以很多培训机构主推.
    2. 国人开发,对中文文档的支持较好,不像 React 那些虽然有中文站,但是有时候会落后一些版本
    3. 生态丰富,和 React 可以有一拼
    chuck1in
        36
    chuck1in  
       243 天前
    @Immortal 感谢。不过 svelte 我理解应该也很好简单上手,估计国内用 vue 多就是因为中文文档支持的很好。
    不知道现在前端今后发展的趋势是什么? react 真的有点不想学了,同样只是为了把页面做出来,同样也能实现工程化,react 那么重的思维负担是不是有点本末倒置了。
    Immortal
        37
    Immortal  
       242 天前
    @chuck1in #36
    Svelte 和 Vue 有点像,都挺好上手的,但是单文件组件不如 React 那样灵活,我还在观察 SolidJs.
    前端趋势还是和之前 1-2 年差不多,并没有像前几年那么一天一个样了.主流还是 Vue 和 React.如果你是做前端的,React 是避不开的,也没必要太抵触.
    而且我的理解上 React 更好做工程化一些.虽然现在 NextJS 到处被吐槽,但也出了个 Astro+React/Svelte 的组合以及 Remix 来替代.
    React 在国外的前端圈子我感觉比重还是很大的,油管上能找到很多 React 模仿项目的视频,Vue 相对少一些.
    Immortal
        38
    Immortal  
       242 天前
    @Immortal #37
    补充说明下,推特上很多国内的开发者都是做前端的,看看他们交流基本就能对前端环境感觉个 7788.
    chuck1in
        39
    chuck1in  
       242 天前
    @Immortal 感谢,非常详细的回复。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1048 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 19:46 · PVG 03:46 · LAX 11:46 · JFK 14:46
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.