2024 年前端技术发展大趋势一览

随着技术的不断演进,前端开发领域也在不断变化和发展。AI、Vue、Web3等都是当前前端开发的新趋势,它们为开发者提供了更多的机会和挑战。今天这篇文章,咱们就来聊一聊,最新前端技术趋势。

1.AI

微信截图_20230601135933.png

年初的 ChatGPT 火爆全网,随之而来的就是大量的国内 AI 项目。阿里的【通义千问】,百度的【文心一言】都是在这个时间段推出的。

同时大量的 AIGC 公司开始出现,也就是所谓的国内 GPT。

现在干啥都想和AI挂点边,好像AI能对产业有翻天覆地的帮助一样。

那么在这样的一种环境之下 AI大模型 想不火都难。

2.行业云平台

image.png

行业云平台(ICP)是专为特定行业量身定制的云方案,可进一步满足企业机构的需求。ICP通过可组合功能将底层SaaS、PaaS和IaaS服务整合成全套产品,推动与行业相关的业务成果。这些功能通常包括行业数据编织、打包业务功能库、组合工具和其他平台创新功能。

• IT领导者可以利用这些平台的可组合性来获得适应性和敏捷性,以应对组织所在行业中不断加速的混乱;

• 技术和IT领导者可以利用ICPs采取的可组合方法,通过(重新)组合与众不同的主张,为其客户和合作伙伴生态系统创造全行业的能力。

Gartner预测,到2027年,将有超过70%的企业使用行业云平台(ICP)加速其业务计划,而2023年的这一比例还不到15%。

3.Vue & React

image.png

Vue 和 React 算是前端的常青树,目前也是国内最火的两个框架。

上一次的时候,我提到 Angular,并且建议大家不要再学习 Angular 了。有很多同学不认同这个观点,并且提出了很多 Angular 的好处。但是我在这里非常负责任的告诉大家,如果你想要学习前端,并且找到一份工作的话,那么真的不要去选择 Angular。

Vue 的话,建议大家直接从 Vue3 开始学起,不需要 学习 setup函数,直接从 <script setup> 搞起就可以。

React 的话,建议至少从 16.8 以上学习,直接学习 函数式组件与 Hooks 即可

4.webpack & vite

image.png

虽说 vite 是为了颠覆 webpack 而存在的,同时 vite 也确实提供了 10 倍以上的构建速度。但是 webpack 足够丰富的生态,所以 vite 想要彻底颠覆 webpack 短时间之内并不现实。

这就导致,webpack 和 vite 我们需要一起进行学习。从现实的角度来看 vite 非但没有带来取代 webpack,反而增加了打包工具的学习成本(毕竟之前只需要学一个,现在需要学两个......)

5.低代码 & 无代码 平台

image.png

低代码和无代码平台在 3 年前开始被大规模的应用,发展到现在已经逐渐成熟起来了。最初的低代码平台旨在:通过可拖拽、可配置的方式,实现不需要手写代码就可以搭建一个应用。

主要还是不想重复再重复去造轮子,很浪费时间。针对这类问题,低代码把某些重复出现的场景、流程,具象化成一个个组件、api、数据库接口,避免了重复造轮子。极大的提高了程序员的生产效率。

介绍一款程序员都应该知道的软件 JNPF 快速开发平台,很多人都尝试用过它,它是功能的集大成者,任何信息化系统都可以基于它开发出来。营销页面、大屏可视化、后台管理系统 都开始出现了低代码构建的影子。

这是一个基于 Java Boot/.Net Core 构建的简单、跨平台快速开发框架。前后端封装了上千个常用类,方便扩展;集成了代码生成器,支持前后端业务代码生成,实现快速开发,提升工作效率;框架集成了表单、报表、图表、大屏等各种常用的 Demo 方便直接使用;后端框架支持 Vue2、Vue3。

应用体验: https://www.jnpfsoft.com/?juejinxue,如果你有闲暇时间,可以做个知识拓展。

虽然现在低代码平台可以做的东西还比较少,但是基于目前的场景来看,未来低代码的应用会越来越多。

6.Turbopack

Turbopack 是 webpack 作者使用 Rust 开发的新的打包工具,其目的就是为了对抗 vite 。

目前,国内企业使用 Turbopack 这应该是值得我们庆幸的一个事情,否则我们就又要多学习一个新的打包工具了 😭。

7.Rust

image.png

Stack Overflow 的开发者调研显示只有 7% 的开发者在使用 Rust,对比 JavaScript、Python 等语言,使用 Rust 的开发者占比并不高;但从 2016 年开始,Rust 每年都是开发者最爱的编程语言。

最近可是火的不行啊!在今年的 ViteConf 中尤雨溪宣布 Vite 的底层即将用 Rust 重写,即开发一个基于 Rust 的打包工具 Rolldown,以此替换掉原有的 Esbuild 和 Rollup。

当这个消息传出后,不少前端开发者开始关注起了 Rust,很多同学也开始问我:作为一个前端,我有必要学 Rust 吗?其实,真的是没有必要的。

那么对于咱们这些本就已经被卷弄得生不如死的程序员,在 Rust 无法带来直接的收入增加时,就没有必要去凑这个热闹了。

8.NestJS

NestJS 是一个基于 Node 开发服务端的框架,结合了 OOP (面向对象编程)、FP (函数式编程)和 FRP (函数响应式编程)。很多同学把它比作前端的 Spring 框架。

在目前互联网行业这么卷的情况下,很多 java 的同学开始卷前端,而前端的同学如果想要卷后端的话,那么除了直接学习 Spring 之外,NestJS 也是一个可以快速从前端切入到后端的框架。

特别是针对一些想要自己接项目开发的同学,NestJS 的学习成本相对于 Spring 更低,是一个不错的选择。

写在最后

现在的互联网行业越来越卷,卷技术、卷加班、卷年龄。很多同学也反馈:“被裁员、找工作难”。如果大家也遇到了这样的情况,或者想要跳槽、涨薪、进阶学习,成为 offer 收割机,那么可以随时私聊我。

最后祝大家都能入职心仪的公司,拿到满意的 offer。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/226331.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

MongoDB的连接数据库,创建、删除数据库,创建、删除集合命令

本文主要介绍MongoDB的连接数据库&#xff0c;创建、删除数据库&#xff0c;创建、删除集合命令。 目录 MongoDB连接数据库连接到本地 MongoDB 实例连接到远程 MongoDB 实例 MongoDB创建和删除数据库MongoDB创建和删除集合创建集合删除集合 MongoDB连接数据库 连接 MongoDB 数…

SuperMap iObject.NET三维场景拖拽框选实现详解及完整源代码(一)——环境准备及项目配置

作者&#xff1a;超图研究院技术支持中心-于丁1 SuperMap iObject.NET三维场景拖拽框选实现详解及完整源代码&#xff08;一&#xff09;——环境准备及项目配置   三维场景框选是一种在三维空间中进行选择和操作的功能&#xff0c;它可以让使用者通过鼠标拖动来创建一个矩形…

kafka C++实现消费者

文章目录 1 Kafka 消费者的逻辑2 Kafka 的C API2.1 RdKafka::Conf2.2 RdKafka::Event2.3 RdKafka::EventCb2.4 RdKafka::TopicPartition2.5 RdKafka::RebalanceCb2.6 RdKafka::Message2.7 RdKafka::KafkaConsumer&#xff08;核心&#xff09; 3 Kafka 消费者客户端开发3.1 必要…

springboot监听器模式源码精讲

1.前言 很多时候我们看源码的时候看不下去&#xff0c;其中一个原因是系统往往使用了许多设计模式&#xff0c;如果你不清楚这些设计模式&#xff0c;这无疑增加了你阅读源码的难度。 springboot中就大量使用了设计模式&#xff0c;本文主要介绍其中的一种监听器模式&#xf…

谈谈 .NET8 平台中对 LiteDB 的 CRUD 操作

哪个啥&#xff01;纯 C# 编写的 LiteDB 你还不会操作&#xff1f; LiteDB 简介LiteDB 安装1、同步版 LiteDB2、异步版 LiteDB.Async LiteDB StudioLiteDB CRUD 操作举例1、.net cli 命令创建项目2、项目添加相关 nuget 包3、改造项目结构4、改造项目代码 LiteDB vs SQLite 对比…

泳道图绘制全攻略,一图胜千言,快速上手

泳道图是一种流程图的形式&#xff0c;通过在不同的泳道中展示不同的参与者&#xff0c;帮助我们更好地理解和分析流程。它是一种非常有用的工具&#xff0c;可以帮助我们在团队协作、流程管理和问题解决等方面取得更好的效果。 1. 泳道图的定义 泳道图是一种以泳道为基础的流程…

postgresql从入门到精通 - 第37讲:postgres物理备份和恢复概述

PostgreSQL从小白到专家&#xff0c;是从入门逐渐能力提升的一个系列教程&#xff0c;内容包括对PG基础的认知、包括安装使用、包括角色权限、包括维护管理、、等内容&#xff0c;希望对热爱PG、学习PG的同学们有帮助&#xff0c;欢迎持续关注CUUG PG技术大讲堂。 第37讲&#…

提高工厂能源效率的关键:工厂能耗监测平台

工业做为能源消耗的重要场所&#xff0c;所以节能减排对工业来讲是一个亟需解决的问题。除了对设备进行更新换代外&#xff0c;还需要能源管理消耗监测平台&#xff0c;帮助企业实现节能减排的目标。 工厂能源消费量非常庞大&#xff0c;能源比较难以监测与控制。传统能源的管…

路径规划之RRT算法

系列文章目录 路径规划之Dijkstra算法 路径规划之Best-First Search算法 路径规划之A *算法 路径规划之D *算法 路径规划之PRM算法 路径规划之RRT算法 路径规划之RRT算法 系列文章目录前言一、RRT算法1.起源2.流程3. 优缺点3.1 优点3.2 缺点 4. 实际效果 前言 PRM方法相比于传…

正则表达式(3):入门

正则表达式&#xff08;3&#xff09;&#xff1a;入门 小结 本博文转载自 从这篇文章开始&#xff0c;我们将介绍怎样在Linux中使用”正则表达式”&#xff0c;如果你想要学习怎样在Linux中使用正则表达式&#xff0c;这些文章就是你所需要的。 在认识”正则表达式”之前&am…

图像处理之把模糊的图片变清晰

1.图片如果是有雾化效果的对图像产生影响的,要先进行图形增强,Retinex是基于深度神经网络了,我在之前图形处理的文章一路从神经网络(概率统计)—>积卷神经网络(对区域进行概率统计,对图片进行切割多个识别对象)–>深度积卷神经网络(RetinexNet也是模拟人脑的处理过程,增加…

挑选分支中某一个提交进行合并

复制提交的哈希(sha-1)值 挑选提交 git cherry-pick 复制过来的哈希值 若有冲突&#xff0c;解决冲突&#xff0c;没有冲突&#xff0c;即合并完成

C语言普里姆(Prim)算法实现计算国家建设高铁运输网最低造价的建设方案

背景&#xff1a; 描述&#xff1a;为促进全球更好互联互通&#xff0c;亚投行拟在一带一路沿线国家建设高铁运输网&#xff0c;请查阅相关资料 画出沿线国家首都或某些代表性城市的连通图&#xff0c;为其设计长度最短或造价最低的高铁建设方案。 要求&#xff1a;抽象出的图…

Linux-进程之间的通信

目录 ​编辑 一.什么是进程之间的通信 二.进程之间的通信所访问的数据 三.进程之间的通信是如何做到的 四.基于内存文件级别的通信方式——管道 1.什么是管道 2.管道的建立过程——匿名管道 a.什么是匿名管道 b.匿名管道特点&#xff1a; c.使用匿名管道的…

Peter算法小课堂—贪心算法

课前思考&#xff1a;贪心是什么&#xff1f;贪心如何“贪”&#xff1f; 课前小视频&#xff1a;什么是贪心算法 - 知乎 (zhihu.com) 贪心 贪心是一种寻找最优解问题的常用方法。 贪心一般将求解过程分拆成若干个步骤&#xff0c;自顶向下&#xff0c;解决问题 太戈编程第…

邮政单号查询,邮政快递物流查询,并进行提前签收分析

批量查询邮政快递单号的物流信息&#xff0c;并将提前签收件分析筛选出来。 所需工具&#xff1a; 一个【快递批量查询高手】软件 邮政快递单号若干 操作步骤&#xff1a; 步骤1&#xff1a;运行【快递批量查询高手】软件&#xff0c;第一次使用的朋友记得先注册&#xff0c…

关于svn如何上传一个完整的项目

注意&#xff1a;请一定要按照该步骤进行操作&#xff0c;请上传新项目时将项目名称进行规范命名 例如原始文件是arrange_v2 将此项目需要注入新的医院 则命名为 arrange_某医院名称_门诊或者医技或者药房_v2 重新命名文件夹名称快捷键 &#xff08;F12&#xff09; 一 &…

【Linux】公网远程访问AMH服务器管理面板

目录 1. Linux 安装AMH 面板2. 本地访问AMH 面板3. Linux安装Cpolar4. 配置AMH面板公网地址5. 远程访问AMH面板6. 固定AMH面板公网地址 AMH 是一款基于 Linux 系统的服务器管理面板&#xff0c;它提供了一系列的功能&#xff0c;包括网站管理、FTP 管理、数据库管理、DNS 管理、…

UI自动化测试工具的定义及重要性

UI自动化测试工具在现代软件开发中起着不可或缺的作用。它们能够提高测试效率、减少人为错误、提供全面的测试覆盖&#xff0c;并支持持续集成。通过有效使用UI自动化测试工具&#xff0c;开发团队可以提高软件质量&#xff0c;提供更可靠的应用程序&#xff0c;满足用户的需求…

Jsoup爬取HTTPS页面数据资源,并导入数据库(Java)

一、实现思路 示例页面&#xff1a; 2020年12月中华人民共和国县以上行政区划代码 忽略https请求的SSL证书通过Jsoup获取页面标签遍历行标签&#xff0c;分别获取每个行标签的第二个和第三个列标签将获取到的行政代码和单位名称分别插入sql语句占位符执行sql语句&#xff0c…