2024年,Web开发新趋势!

在这里插入图片描述

随着我们迈入新的一年,现在正是审视2024年网页开发领域开始流行哪些趋势的绝佳时机。回顾2023年的一系列更新,以下是来年一些热门话题的概览。

自主托管有回归的趋势

近些年,自主托管一直是网页开发者和公司托管其应用程序的默认方式。开发者不得不深入研究IIS、Nginx或类似工具以便更好地托管他们的Web应用程序。

随着发展,云服务的出现使开发者得部署变得更加轻松便捷了,与自己手动部署的方法相比,简直就是傻瓜式操作。不再有服务器维护的噩梦,对吧?

云部署以其经济性和便利性,快速地取代了传统的自主托管解决方案。与自主托管相比,后者需要你拥有和维护服务器,包括更新系统、修复安全漏洞等繁琐任务。
Docker技术的兴起,正在逐步解决一个长期存在的问题——即应用在开发者的本地环境中运行良好,但在生产环境中却出现问题。随着Docker的普及,这种“在我电脑上可以,但在生产环境中不行”的现象开始减少。
尽管如此,云部署的便利性仍然具有其独特的吸引力,特别是对于那些不希望深入了解网络、管理和虚拟机处理知识的人来说。

此外,随着家用服务器价格的下降,以及网络附加存储(NAS)的广泛应用,个人和小型企业现在更容易处理自己的托管需求。我们现在有像Proxmox和Portainer这样的工具,也使得个人用户能够轻松地托管和管理自己的Docker容器。

值得注意的是,一些公司,例如由Ruby on Rails的创造者之一DHH运营的公司,已经完全转向了自主托管模型。这一转变引发了业界的广泛讨论,这也表明在云服务和自主托管之间,企业正在根据自己的需求和偏好做出选择。

SSR 服务器端渲染:提升用户体验的新趋势

在这里插入图片描述

在React生态中,服务器端渲染(SSR)正成为一个越来越受欢迎的趋势,这主要得益于Next.js的推动。尽管React Server Components是一项新兴技术,但它已经在开发者社区中引起了广泛的讨论。
这些技术正在改变开发格局,一些开发者认为它们具有革命性,而另一些则认为它们并没有带来太多创新,只是在重复已有的解决方案。
不过,它们的共同目标是提供更快的页面加载速度、减少客户端代码量,并提升开发体验。
React Server Components的一个显著优势在于,它允许开发者在服务器上执行和渲染React代码,这预期会带来以下好处:

更快的页面加载时间:由于页面内容在服务器上预先渲染,用户可以更快地看到页面的首屏内容。
减少客户端代码:服务器端渲染减少了需要发送到客户端的代码量,从而减轻了客户端的负担。
改善开发体验:开发者可以直接从React组件安全地访问数据库,而无需通过API,这简化了数据获取和操作的过程。

此外,HTMX是一个因其服务器优先的数据渲染方法而受到欢迎的库。与React Server Components相比,HTMX提供了一种更简洁的方法来吸引开发者,它通过使用HTML和XML的扩展来实现无刷新的网页交互,从而简化了服务器端渲染的实现。
这种方法使得开发者可以更容易地采用服务器端渲染,而无需深入了解复杂的前端框架。

回归单页应用(SPA)

在这里插入图片描述

等等,这不是有点矛盾吗?虽然服务器端渲染(SSR)逐渐成为主流,但单页应用(SPA)依然有其坚定的支持者。他们可能认为我们在追求服务器优先的道路上走得太远,以至于忽略了一个事实——并非所有应用都适合在服务器端运行。
有些应用可能非常动态,涉及复杂的客户端验证,或者你只是想要将现有的Create-React-App架构迁移到Vite。

如果你想知道SPA是什么,或者好奇我为何要在拥抱React Server Components的同时还使用它,我在这里简单解释一下。SPA是一种Web应用,它最初只加载一个Web页面,随后动态更新内容,而无需重新加载整个页面。它通过在用户交互中重写现有网页,而非从服务器加载新页面来实现。
Remix SPA模式就是这种新方法的一个代表。它结合了Vite和React Router,以及Remix特有的功能,比如基于文件的路由。

Wasp是另一个利用Vite为用户带来SPA体验的React框架。这个为React和Node.js设计的全栈框架,大大减少了代码量。尽管是全栈,Wasp专注于以一种标准化的方式部署客户端React应用和Node.js服务器,以实现最大程度的便携性。
这样,你可以在几乎任何地方部署你的应用,也可以选择自行托管,正好印证了最开始提到的自主托管回归趋势。

为了快速开始,Wasp还提供了Open SaaS——一个功能丰富的开源SaaS软件模板平台。你只需克隆它,就能立即获得一个具备身份验证、计费、Open AI API、用户仪表等功能的应用程序。

低级语言的崛起

我们注意到一些低级语言逐渐成为主流,特别是在JavaScript工具的开发中。这一趋势自过去几年开始,并预计会持续至2024年及未来。随着JavaScript生态系统的蓬勃发展,许多优秀的工具都是用JavaScript构建的,这不仅让开发者更容易为其贡献代码,也方便他们根据自己的需求定制和创建插件。

这些工具之所以令人兴奋,是因为它们相较于基于JavaScript的工具,为开发者提供了更高的性能。例如,SWC(Speedy Web Compiler)和Turbopack(Vercel声称其为Webpack的后继者)都是使用Rust语言开发的。此外,Bun是一个用Zig语言构建的多功能JavaScript工具包,它不仅支持作为JavaScript的默认运行环境,还能作为打包工具、测试运行器以及兼容Node.js的包管理器。值得称赞的是,许多新工具在设计时保留了与现有概念的兼容性,这使得从旧工具向新工具的过渡变得相对容易。### 结论

像对待所有事物一样,我们应该对所有预测和潜在趋势持谨慎态度。被今天不断涌现的新技术和工具的炒作冲昏头脑是很容易的。如果你仔细阅读了这篇文章,你可能会自问“这里的AI在哪里?”。我故意没有包括任何基于AI的预测,以提高人们对行业中被忽视的其他酷炫发展和趋势的认识。

你对这些趋势有什么看法?你注意到它们了吗?或者更好的是,你自己也在做这些事情吗?在下面的评论区让我们知道,并分享你的意见!

总结

我们应该对所有预测和潜在趋势持谨慎态度。有时候我们很容易被不断出现的新技术和工具的炒作所冲昏头脑。如果你仔细阅读这篇文章,你可能会想“好吧,人工智能在哪里呢?”。我故意不包括任何基于人工智能的预测及探讨,以提高人们对该行业其他被忽视的新发展和趋势的认识。
你认为这些趋势如何呢?不知道大家注意到了吗?或者是有小伙伴正在,自己做一些这样的事情?可以分享一下你的意见!

参考文章:https://mp.weixin.qq.com/s?__biz=MzU3NzgzMzM1MA==&mid=2247484138&idx=1&sn=f403774965f25a9ea1272b42b0d6a6a0&chksm=fd7fd203ca085b15b74cb40dabb4e2a8247e2dbc120ef3dc07afab40258b29b86fb0905cc7ad#rd

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

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

相关文章

绿盟之旅——一段安全实习结束

去年,因为着急找实习,拿着简历就开始海投,当时想的是有人让我去就谢天谢地了,第一个约我面试的就是绿盟,也很顺利的通过了面试,当时让我选择在上海还是北京,我选择的是上海,因为学校…

体验GM CHM Reader Pro,享受高效阅读

还在为CHM文档的阅读而烦恼吗?试试GM CHM Reader Pro for Mac吧!它拥有强大的功能和出色的性能,能够让你轻松打开和阅读CHM文件,享受高效、舒适的阅读体验。无论是学习、工作还是娱乐,GM CHM Reader Pro都能成为你的得…

探索数据结构(让数据结构不再成为幻想)

目录 什么是数据结构 数据与结构 什么是算法 复杂度分析 时间复杂度与空间复杂度 时间复杂度 思考: 空间复杂度 常数阶O(1) 对数阶O(logn) 线性阶O(n) 以下为空间复杂度为O(n) 线性对数阶O(nlogn) 平方阶O(n) 指数阶O(2^n) 什么是数据结构 数据结构…

OpenCompass 大模型评测实战学习笔记

大模型开源开放评测体系 “司南” (OpenCompass2.0),用于为大语言模型、多模态模型等提供一站式评测服务。其主要特点如下: 开源可复现:提供公平、公开、可复现的大模型评测方案 全面的能力维度:五大维度设计,提供 70…

AR系列路由器配置VLAN间通信

AR路由器是华为公司推出的企业级路由器产品系列,具有高可靠性、高性能和易管理等特点。AR 系列路由器提供的功能包括路由转发、安全接入、语音、视频、无线等多种业务,支持各种接入方式和协议,并且可以方便地进行扩展和升级。 实验拓扑图&…

动态路由-链路状态路由协议ospf案例

实验拓扑和要求如图 ospf实验 1.设置各个接口地址 2.测试ar5到ar6的连通性 3.配置ospf协议,routerid,area, 详细的网络信息,等待网络收敛后, 查看ospf信息,路由表信息,再次测试连通性 注意区域…

React 第二十七章 Hook useCallback

useCallback 是 React 提供的一个 Hook 函数,用于优化性能。它的作用是返回一个记忆化的函数,当依赖发生变化时,才会重新创建并返回新的函数。 在 React 中,当一个组件重新渲染时,所有的函数都会被重新创建。这可能会…

使用 PXE+Kickstart 批量网络自动装机

前言: 正常安装系统的话使用u盘一个一个安装会非常慢,所以批量安装的技术就出来了。 一、 概念 PXE (Preboot eXecute Environment,预启动执行环境)是由 Intel 公司开发的技术,可以让计算机通过网络来启动…

Scoop国内安装、国内源配置

安装配置源可参考gitee上的大佬仓库,里面的步骤、代码都很详细,实测速度也很好 glsnames/scoop-installer 也可以结合其它bucket使用 使用Github加速网站,也可以换做其他代理方式,自行测试 例如:https://mirror.ghprox…

【pkuseg】由于网络策略组织下载请求,因此直接在github中下载细分领域模型medicine

【pkuseg】由于网络策略组织下载请求,因此直接在github中下载细分领域模型medicine 写在最前面解决方案pkuseg是什么?报错原因报错详情 🌈你好呀!我是 是Yu欸 🌌 2024每日百字篆刻时光,感谢你的陪伴与支持…

OFDM802.11a的FPGA实现(十三)加窗(含verilog和matlab代码)

原文链接(相关文章合集):OFDM 802.11a的xilinx FPGA实现 1.前言 添加循环前缀后,对数据还要进行加窗(Windowing)操作。加窗操作可以使OFDM 符号在带宽之外的功率谱密度下降得更快。 2.加窗 对OFDM符号“加窗”意味着令符号周期边缘的幅度…

分形视角观察Linux世界一切皆文件的设计哲学

一切皆文件 我们知道在Linux的世界里,一切皆文件。 而在前面的博客也说过,Linux世界里对文件进行读写、或进行输入/输出,很好地模拟了图灵机模型,所以,它的描述能力是非常强的! 图例 常见文件 一切皆…

外观模式详解

外观模式 1 概述 有些人可能炒过股票,但其实大部分人都不太懂,这种没有足够了解证券知识的情况下做股票是很容易亏钱的,刚开始炒股肯定都会想,如果有个懂行的帮帮手就好,其实基金就是个好帮手,支付宝里就…

商场学习之微服务

前言 寒假前在新电脑上配置了java环境,maven仓库,node,js,navicat,MySQL,linux,vmware等环境,创建了6个mysql数据库,77张表。 如此多的表,字段,去手写基础…

2024年天津市静海区教师招聘报名流程(建议电脑)

2024年天津市静海区教师招聘报名流程(建议电脑) #报名 #教师招聘 #教师招聘考试 #教招 #天津教师招聘 #天津教师招聘考试 #24年天津教师招聘 #24年天津市教师招聘考试 #天津市静海区教师招聘 #静海区教师招聘考试 #静海区教师编 #静海区#

1065: 无向图的连通分量计算

解法&#xff1a; dfs求连通性 1.设节点表vis[] 2.遍历节点表dfs标记&#xff0c;每次得到一个连通分量 #include<iostream> #include<vector> using namespace std; int arr[100][100]; void dfs(vector<bool>& vis, int v) {//不用终止条件&#x…

Vellum for Mac v3.7.2激活版:一键创建,轻松出版

还在为繁琐的电子书制作流程而烦恼吗&#xff1f;Vellum for Mac&#xff0c;让您的电子书创作变得轻松简单&#xff01;支持多种格式导入&#xff0c;自动构建书籍内容&#xff0c;无需担心排版和格式问题。丰富的编辑和排版功能&#xff0c;让您的书籍更加精美。一键导出多种…

WHAT - CSS Animationtion 动画系列(三)- 动画卡顿分析

目录 一、背景二、动画卡顿具体分析三、具体优化方法3.1 JavaScript:优化 JavaScript 代码1. requestAnimationFrame 优化2. Web Worker3.2 Style:减少 DOM 操作3.3 Layout:避免频繁触发布局的动画3.4 避免强制同步布局事件3.5 Paint&Composite:GPU加速一、背景 自 HT…

十一、Redis持久化-RDB、AOF

Redis提供了两种持久化数据的方式。一种是RDB快照&#xff0c;另一种是AOF日志。RDB快照是一次全量备份&#xff0c;AOF日志是连续的增量备份。RDB快照是以二进制的方式存放Redis中的数据&#xff0c;在存储上比较紧凑&#xff1b;AOF日志记录的是对内存数据修改的指令文本记录…

c++ 入门2

目录 五. 函数重载 1、参数类型不同 2、参数个数不同 3、参数类型顺序不同 C支持函数重载的原理--名字修饰(name Mangling&#xff09; 为什么C支持函数重载&#xff0c;而C语言不支持函数重载呢&#xff1f; 六. 引用 6.1 概念 6.2 引用特性 6.3 常引用 6.4 使用场景 …