前端已死?AI 如何重塑前端开发?

简介: 前端已死?AI 如何重塑前端开发?

因果关系


前端已死这个舆论的浪潮差不多要结束了。

趁着还有一点热度,我也来浪费俩小时写篇文章,好好聊一下这个话题。

虽然我早已经不再是一个专职的前端开发人员。但在过去的将近 10 年里,我一直陆陆续续写着各种 UI,我也曾开过前端培训公司,帮助很多人进入了这个行业。即使是现在,我仍然会有机会写一些前端代码。我始终和前端有着千丝万缕的关系,这也是我要聊这个话题的原因。

我有一个不怎么活跃的前端群,最近和群里的一些老粉丝深入1对1聊了聊,在他们眼里,为什么会有前端已死的论调?

我总结的原因主要有两点:

  1. 工作难找。
  2. GPT 太强。

关于第一点,经济不好是大趋势,不是唯前端独有。

我主要来聊聊第二点。

因为社区里面只有前端已死的论调,没有其他岗位的技术员已死的论调,后端、DB、运维、连原生开发都好好的。

这一点看似很奇怪,但其实合乎天理。


前端很难吗?


这是一个比较尖锐的问题。

因为一旦回答不好就会被一群前端开发人员群起而攻之。

好在我技术栈比较广泛,Java、Spring、Python、django、PHP、laravel、ruby on rails、Go、Rust、Solidity、erlang、Nodejs、React、Vue 等等这些编程语言和框架都曾经深度使用过。

开发过的项目,底层架构、上层应用、开源产品,不计其数。

所以我可能会比大多数人更能客观的回答这个问题。

直接说吧,前端不难。

当然一定会有人说,前端很难,只是你没接触到而已。

那前端难在哪儿呢?

WebGL?AR?VR?Serverless?跨端编译?WASM?微前端?

我们不得不承认,前端的技术范围很广。

但上面提到的这些技术,不是 90% 的前端开发人员的日常。

我们提到的前端已死,其实默认是代指那 90% 天天写业务的人。

所以没必要拿一些小众现象来反驳事实。

除了上面那一堆酷炫的名词儿,我再来列一些实在的东西:

  • 性能优化:分析页面加载速度、渲染性能和资源使用。理解浏览器的渲染机制、缓存策略、网络传输。
  • 响应式设计
  • 跨浏览器兼容性
  • 安全:跨站脚本攻击(XSS)、跨站请求伪造(CSRF)、点击劫持等。
  • 测试:单元测试、集成测试、端到端测试。
  • 无障碍
  • 工程化
  • 组件化

上面这几点是前端非常基础的技术,但是我相信仍然有 50% 以上的前端对这些基础的东西不怎么了解。包括很多 5 年+ 的同学。

然而这些东西并不算难啊,真的不难。

我再举例一些后端的基础能力:

  • 架构设计:设计模式、高并发、高可用、可扩展
  • 数据库设计和优化:关系型数据库(如MySQL、PostgreSQL等)和非关系型数据库(如MongoDB、Redis等)
  • 缓存策略:本地缓存、分布式缓存(如Memcached、Redis等)
  • 分布式:数据一致性、分布式事务、分布式锁等。CAP定理、分布式一致性算法(如Paxos、Raft等)等
  • 微服务
  • 安全:SQL注入、身份认证和授权、数据加密等
  • 负载均衡:多线程、进程、异步编程、负载均衡算法
  • 容器化:Docker、CICD

到底哪些技术更难?可以自己去判断。

总的来说,前端不难,体现在以下几个方面:

  1. 技术栈:前端开发主要使用HTML、CSS和JavaScript等技术,基于这些语言有一些框架,比如React、Vue。这些技术相对容易学习和入门。而后端开发涉及到更多的编程语言,如Java、Python、Ruby、PHP、Go等,以及更多的框架和库,如Spring、Django、Ruby on Rails、Laravel、Node.js等。相比之下,前端开发的技术栈要简单一些。
  2. 学习曲线:前端开发的学习曲线较为平缓,新手可以很快地掌握基本的前端技能。而后端开发需要更多的时间和精力去学习和掌握,因为它涉及到数据库、网络、安全等方面的知识。
  3. 问题复杂性:前端开发主要处理用户界面和交互,问题的复杂性相对较低。而后端开发需要处理业务逻辑、数据存储、服务器资源等,问题的复杂性较高。
  4. 负责范围:前端开发只需关注浏览器端的展示和交互,负责范围相对较小。后端开发则需要负责整个系统的运行,包括服务器端的业务逻辑、数据库、网络、安全等方面。
  5. 错误影响:前端开发出现错误时,通常只影响用户界面和交互,后果相对较小。而后端开发出现错误可能导致整个系统无法正常运行,影响较大。

另一个,可以从教育的角度去看。

几乎所有的高校中,都有后端、数据库相关的课程,而没有专门的前端课程。

我总结有如下几个方面:

  1. 基础理论:后端和数据库课程通常涉及更多的计算机科学基础理论,如数据结构、算法、操作系统、计算机网络等。这些基础理论是计算机科学教育的核心内容,有助于培养学生的计算思维和问题解决能力。
  2. 抽象程度:相较于前端开发,后端开发和数据库设计往往具有更高的抽象程度,更能体现计算机科学的思想。大学课程可能更倾向于教授这些抽象和理论性较强的内容。
  3. 实际应用:虽然前端开发在现实应用中非常重要,但许多大学课程侧重于培养学生在多个领域的技能,而不仅限于Web开发。后端和数据库相关的知识在许多其他领域(如桌面应用、嵌入式系统等)中也具有广泛的应用。
  4. 前端技术更新迅速:前端技术的发展非常迅速,框架和工具的更新换代很快。大学课程可能难以跟上这种快速变化的趋势,而后端和数据库相关的知识相对稳定,更适合作为教学内容。
  5. 教育资源:大学的教育资源有限,可能需要在课程设置上做出取舍。后端和数据库相关的课程可能被认为更具基础性和普适性,因此在课程设置中被优先考虑。

基于以上论述,客观的说,前端不算难,也不算最重要的。

一个行业中最先死的,往往都是那些不算难,也不算核心的领域。


我的观点


我有在某课网的前端开发课程,仍然有一些收入。如果前端开发岗位死掉的话,对我有一些弊端。

所以我不太希望前端开发的岗位会死掉。

但我不能因为利弊而对事实产生偏见。

前端确实没死,但在走下坡路。


前端始末与低代码


前端、frontend,这个词其实出现的挺晚。所以我一直更喜欢用 Web 开发来称呼这个岗位,因为它更贴切。

而 Web 开发的起源,或者说是奇点,是从 1996 年 CSS 在 IE3 中受到支持开始的。

从 Web 技术传入到国内的那一刻,中国和世界的 Web 开发就开始走向两条路。

中国人由于某些原因特别勤奋,喜欢从头构建一些东西,各种造轮子。

而世界的 Web 更喜欢用一些通用技术来减轻整个行业的成本。

比如 1996 年的 Homestead 和 Microsoft FrontPage、1997年的 Adobe Dreamweaver、1999 年的 Appian、2001 年的 OutSystems、2004 年的 Squarespace、2005 年的 Mendix、2006 年的 Wix 和 Weebly、2013 年的 Pinegrow、2014 年的 Pinegrow、2015 年的 Mobirise 等等。

这些网站构建工具、低代码平台,其实目的都是为了取代 Web 开发人员。

使用这些工具,我们可以只需要支付几十美金,就可以取代一个月数千美金报酬的 Web 开发人员从头构建的工作。

低代码类的工具确实是 Web 开发岗位的杀手之一,但它们还不够强,还不足以真正对 Web 开发人员造成巨大的杀伤力。


AI 与 GPT4


可直到上个月 GPT4 发布之后,我们看到了一个令人印象深刻的演示:GPT4 可以通过网站的手绘草稿生成出功能齐全的网站,甚至附带了 JS 的功能。

image.png

image.png

从那时候我意识到,这次或许会不一样了。

AI 的能力将会比过去发展了 20 多年的低代码类工具更强。它足以杀死一些 Web 开发人员。


GPT4 很强吗?


GPT4 算是 AI 能力的一个分水岭。

其实从 GPT3 就可以算了。

在此之前的 AI 确实营销成分大于实用成分。

但这次不一样了。

有人认为 GPT 只是个玩具,只是在吹嘘。

但它到底是不是个玩具呢?

我们拉出来遛遛就知道了。

我可以通过 AI 来完成非常多复杂的工作。

比如一个词云组件。我先告诉它我的需求:

image.png

它会把详细的代码提供出来,并附带说明。

image.png

最后我发现它提供的代码有一些纰漏,我会反馈给它。让它继续修改。

image.png

它很聪明,立马修复了问题。

image.png

当我发现需要增加一些需求的时候,我继续告诉它。它会继续帮我工作。

image.png

最后就可以得到一个词云的效果。

image.png

整个过程只花了一两个小时而已。

我为什么需要开发这个功能呢?

是因为同样一个工作四五年的前端开发人员从零开发一个这种组件需要 5 倍以上的时间。

而且这不仅仅是时间成本的问题,还有金钱成本。Web 开发人员真的很昂贵。

所以 AI 的费用和人工比起来基本上算是超级廉价了。ChatGPT Plus 只需要一百多块钱一个月。等于我花一百多雇了一个 7*24 小时一直干活的技术员。

而且这个技术员的技术水平差不多等于我花 3 万块招个高级 Web 开发人员的水平。

有些人认为 AI 在过分吹嘘、营销。

大概率是他根本没有用过 GPT4,或者直接对着 GPT3.5 来一句:“帮我开发一个淘宝”,然后得到一个不满意的结果,自此认为 AI 不行。

这个道理就像你花5000买个直升机。可你不会开。所以你只能把它放那里接灰。甚至还不如给你辆自行车骑得舒服。

很多人的状态就是这样,自行车骑惯了。现在进入每个人开直升机的时代,反而用不明白。最后抱怨直升机不如自行车好骑。

GPT和普通技术员的能力对比,和洋人拿着枪炮对战大清朝各种武林高手、气功师的场景差不多。

我的主观感受就是这样,技术员一定会被AI严重威胁。不接受现实,还继续质疑AI的能力,那只能等着挨揍。

不分前端技术员还是后端技术员,甚至算法技术员,都是一样的。

不信的话你可以让 GPT4 来做一些很难的算法题。

测试题目是 LeetCode 23 号问题。难度是 Hard,通过率也是链表类问题中最低的。

image.png

我不知道你来做这题需要几个小时,但 GPT4 只需要 30 秒。

image.png

当然,GPT4 并不是完美的。

LLM 是一个超级强大的文本预测器,给它一个提示,它就会通过机器学习来找到最有可能符合提示的内容。

但是,答案并非绝对正确的。

正确率可能是 90%、95%,甚至 99%。

但无论如何,这终归是一个概率游戏。

我们需要认为去判断 AI 给出的内容哪些是对的,哪些是错误。针对错误的部分进行引导,让 AI 重新修复。

这就是 AI 的缺陷,并且以目前的技术手段来看,将会永远存在。

但这没有关系。

因为人类同样会写出来非常多的 Bug。甚至大多数人的代码质量远比 GPT4 写的代码质量低得多。


AI 对技术的影响是什么?


即使 AI 不足以直接杀死技术员。

但 AI 可以大幅度提效。

从我这几个月深度使用 GPT 来看,AI 提效可能不会是 5 倍、10 倍。但至少能达到 2 倍以上。

怎么定义深度呢?

每天使用时长 12 小时以上,为了打破 GPT4 3 个小时 25 条的限制,我甚至开通了 3 个 ChatGPT Plus。

借助 GPT,我目前的研发效率,大于等于 3 个月薪 2 万 的中级前端加 1 个 月薪 5 万的前端 Lead。

对,一个人绝对可以顶替一个小型前端团队。

不仅仅前端,我还会让 AI 来做一些后端、文案、PPT 的工作。

我原来在的 B 站自媒体账号制作一条视频,做 PPT 需要半天时间。但是用 beautiful ai,我只需要一两个小时。

我还会让 GPT4 帮我优化 SQL,帮我的系统做缓存设计。

我还会让 GPT4 帮我检查智能合约中是否存在漏洞。

我对 AI 是抱有乐观态度的。

毕竟物竞天择、适者生存。

蒸汽时代来了,车夫还在。

电动时代来了,木匠还在。

数码相机出现了,摄影师还在。

只是市场需要的人数变少了,待遇可能也降低了。

这就是我的预测和推断。

AI 杀不死前端,但前端一定没有以前好过了。

希望时间能够证明我是错的,这样还能给大家留一口饭吃。


对初学者的一些话


我相信仍然有很多前端初学者在看这篇文章。

文章中的内容似乎都是负面倾向。但这是我基于事实推理出来的观点。相对来说不算偏激,比较中肯。因为所有观点我都有事实依据,而不是和某些无良博主一样纯粹臆想、误人子弟。

现在学习前端技术的性价比大不如以前了。

听上去可能有些令人沮丧,但并不意味着我鼓励你停止学习。

因为即使前端开发这个岗位半死不活,仍然比大多数普通岗位更有优势。

去拥抱新时代吧,成为一个带着 AI Buff 的技术员!

如果你还没有用上 ChatGPT,那么我推荐一个比官方更好用的产品:www.ichati.cn/



相关文章
|
1月前
|
监控 前端开发 JavaScript
前端工程化和传统前端开发的区别是什么?
前端工程化相比传统前端开发,在开发模式、代码组织与管理、构建与部署流程、团队协作、性能优化以及技术选型等方面都有了显著的改进和提升,能够更好地应对现代前端应用开发的复杂性和高要求。
|
2天前
|
人工智能 移动开发 前端开发
WeaveFox:蚂蚁集团推出 AI 前端智能研发平台,能够根据设计图直接生成源代码,支持多种客户端和技术栈
蚂蚁团队推出的AI前端研发平台WeaveFox,能够根据设计图直接生成前端源代码,支持多种应用类型和技术栈,提升开发效率和质量。本文将详细介绍WeaveFox的功能、技术原理及应用场景。
131 66
WeaveFox:蚂蚁集团推出 AI 前端智能研发平台,能够根据设计图直接生成源代码,支持多种客户端和技术栈
|
4月前
|
前端开发 JavaScript API
解锁高效应用构建:Vuex与后端交互的前端状态同步策略,让数据流动如行云流水,紧跟前端开发的热点趋势
【8月更文挑战第27天】本文深入探讨了Vue框架下的前端状态管理库Vuex与后端服务交互时的状态同步策略。通过剖析Vuex的核心机制——状态(State)、变异(Mutation)、动作(Action)及模块(Module),文章展示了如何优雅地将后端数据加载并更新至前端状态中。特别地,借助示例代码解释了Action处理API调用、Mutation更新状态的过程,并介绍了如何通过模块化和命名空间提高状态管理的准确性和时效性。此外,还讨论了组件如何利用`mapState`和`mapActions`简化状态访问与操作的方法。遵循这些策略,开发者可以在构建复杂应用时显著提升性能与用户体验。
56 0
|
20天前
|
人工智能 自然语言处理 前端开发
【AI系统】LLVM 前端和优化层
本文介绍了 LLVM 编译器的核心概念——LLVM IR,并详细讲解了 LLVM 的前端 Clang 如何将 C、C++ 等高级语言代码转换为 LLVM IR。文章还探讨了编译过程中的词法分析、语法分析和语义分析三个关键步骤,以及 LLVM 优化层的 Pass 机制,包括分析 Pass 和转换 Pass 的作用及依赖关系。
24 3
|
4月前
|
前端开发 UED
中后台前端开发问题之中后台前端开发中的复杂交互问题如何解决
中后台前端开发问题之中后台前端开发中的复杂交互问题如何解决
41 0
|
1月前
|
前端开发 JavaScript 开发者
前端小白逆袭记:从零开始,如何快速掌握前端开发精髓?
本文从一个前端小白的视角,分享了快速掌握前端开发核心技能的逆袭之路。通过学习HTML、CSS和JavaScript,逐步接触前端框架如Bootstrap、Vue.js和React,克服挑战,最终实现从入门到精通的蜕变。
30 4
|
2月前
|
人工智能 资源调度 数据可视化
【AI应用落地实战】智能文档处理本地部署——可视化文档解析前端TextIn ParseX实践
2024长沙·中国1024程序员节以“智能应用新生态”为主题,吸引了众多技术大咖。合合信息展示了“智能文档处理百宝箱”的三大工具:可视化文档解析前端TextIn ParseX、向量化acge-embedding模型和文档解析测评工具markdown_tester,助力智能文档处理与知识管理。
|
2月前
|
人工智能 前端开发 JavaScript
拿下奇怪的前端报错(一):报错信息是一个看不懂的数字数组Buffer(475) [Uint8Array],让AI大模型帮忙解析
本文介绍了前端开发中遇到的奇怪报错问题,特别是当错误信息不明确时的处理方法。作者分享了自己通过还原代码、试错等方式解决问题的经验,并以一个Vue3+TypeScript项目的构建失败为例,详细解析了如何从错误信息中定位问题,最终通过解读错误信息中的ASCII码找到了具体的错误文件。文章强调了基础知识的重要性,并鼓励读者遇到类似问题时不要慌张,耐心分析。
|
2月前
|
人工智能 前端开发 测试技术
探索前端与 AI 的结合:如何用 GPT-4 助力开发效率
本文介绍了 GPT-4 如何成为前端开发者的“神队友”,让开发变得更加高效愉快。无论是需求到代码的自动生成、快速调试和性能优化,还是自动化测试和技术选型,GPT-4 都能提供极大的帮助。通过智能生成代码、捕捉 BUG、优化性能、自动化测试生成以及技术支持,GPT-4 成为开发者不可或缺的工具,帮助他们从繁重的手动任务中解脱出来,专注于创新和创意。GPT-4 正在彻底改变开发流程,让开发者从“辛苦码农”转变为“效率王者”。
53 0
探索前端与 AI 的结合:如何用 GPT-4 助力开发效率
|
3月前
|
缓存 人工智能 前端开发
前端技术博客:探索现代前端开发的奥秘
前端技术博客:探索现代前端开发的奥秘
44 11