2天时间,聊今年最热的 Agent、上下文工程、AI 产品创新等话题。2025 年最后一场~ 了解详情
写点什么

前端策略:使用框架还是纯 JavaScript?

  • 2024-09-04
    北京
  • 本文字数:1975 字

    阅读完需:约 6 分钟

大小:990.50K时长:05:38
前端策略:使用框架还是纯JavaScript?

有大量的前端框架都是用 JavaScript 编程语言实现的。然而,有时很难确定应该将哪种框架应用于新项目。或者 Web 平台的状态就是这样的,我们根本不需要使用任何框架。


框架为网页设计师提供了必要的基本功能。同样,在某些情况下,设计师也可以只使用 JavaScript 即可解决问题。


前端框架是一个代码包,用于解决常见的问题,比如数据绑定和检索、路由、代码组织以及当代应用程序所使用的其他功能。一般来说,前端框架是快速实现和 Web 开发的重要工具。


前端框架有助于构建和控制代码,它可以处理一个合理的应用程序在客户端所需的一切。


何时使用前端框架


要确定我们是否需要使用某个框架,请问问自己:“在没有这个框架,我们是否可以构建它?”如果任务相当简单,并不需要使用数据获取、绑定或复杂的路由,那么可能就不需要框架了。


在这个程序中,一些开发人员打开一个空白 HTML 文件,并通过绘制板对整个项目进行编码。这样的项目适用于个人网站或作品集,此时,不使用框架可能会是一个好主意,因为在这种情况下,没有特定的需求,并且结果也会相当快。


然而,在某些情况下,使用框架将会带来巨大的收益。


前端 JavaScript 框架的优势

下面将介绍使用 JavaScript 框架进行前端开发以提高网页设计技能的优势。

简化的语法和结构

JavaScript 框架将开发模式定义为使用已编写好的代码使语法更简单。这种结构为开发人员提供了一种采用框架并构建应用程序的简单方法,而无需编写构成主框架之外的很多额外代码。Angular、React 和 Vue.js 等库提供了许多规则和建议,可以使工作更加高效,并能最大限度地减少团队新成员研究代码所需的时间。

模块化的代码组织

框架通过将应用程序划分为小而可互换的部分,使编写模块化的代码变得更加容易。这种模块化有助于开发人员编写良好的结构化代码,并有助于团队成员之间顺利地进行协作。由于每个组件都可以单独构建、测试和维护,因此可以为维护提供更干净的代码库。

可重用的组件

JavaScript 前端框架还可以帮助我们开发模块——这是另一个优势。这些组件可以在一个应用程序中重复使用,甚至可以用于另外的其他项目。这种可重用性减少了项目开发所需的时间,标准化了编写的代码主体,并消除了冗余。

丰富的生态系统和库

JavaScript 框架已经开发展成了复杂的生态环境,其中充斥着能与框架一起使用的库、工具和插件。上述资源能为开发人员提供非常重要的帮助,因为他们可以使用现成的特性和功能来增强他们的应用程序。例如,在 React 中,没有标准的方法来管理状态、路由应用程序或处理表单。然而,有很多三方库可以解决这些问题,并能很容易地将这些解决方案合并到应用程序中。

虚拟 DOM 与高效的渲染

Preact、Next.js 和 Vue.js 等库使用虚拟文档对象模型(DOM)来提高渲染速度。虚拟 DOM 是实际 DOM 之上的一层,很少直接操纵应用程序的 DOM。这种方法减少了昂贵的 DOM 操作次数,使更新在处理增强和动态应用程序时更快、更高效。

代码拆分和延迟加载

JavaScript 框架支持更复杂的策略,比如代码拆分和延迟加载,从而提高了应用程序的效率。代码拆分有助于将应用程序代码分解为可以按需加载的片段,这反过来又有助于最大限度地减少加载时间。延迟加载还可以通过仅在需要时加载所需的组件和资源来提高工作效率,从而增强了应用程序的可用性。

标准化开发实践

应用 JavaScript 框架通过实现一组特定的标准可以帮助整个团队做好准备工作。这些框架附带了一些规则和标准,并推荐了对特定项目进行编码和结构化的方式或方法。到开发后期需要查看代码时,能使代码对开发人员来说更易于阅读和维护。

对不同规模项目的适应性

JavaScript 框架是为了实现多功能性而开发的,既可以用于大型企业,也可以用于复杂程度相当的小型企业。这些框架适用于任何应用程序——只有一个页面的简单应用程序或具有多级复杂性的大型企业的应用程序。对于开发人员来说,可以简单地开始并逐步扩展应用程序,而无需经历巨大的架构转换。

与现代开发工具的集成

当前的 JavaScript 框架非常灵活,可以很容易地集成到不同的开发工具和开发生命周期中。它们可以支持构建工具和包管理器,比如 npm 和 Yarn。它们还可以通过消除繁琐的活动、协调依赖关系以及编排构建过程来丰富开发过程,从而提高工作效率。

结论

JavaScript 是 Web 开发的未来。一切都取决于所选的框架以及云托管的专门功能和选项。JavaScript 可用于客户端脚本和服务器端或游戏服务器脚本的编写或套接字编程。然而,由于浏览器只支持一种语言,因此 JavaScript 已经赢得了它的普及,广受欢迎。


作者介绍:Jordan Smith 是俄克拉荷马州塔尔萨的一位资深网页设计师,在设计和开发网站方面拥有超过 10 年的经验。他建立了数百个专门针对每个客户的品牌和目标量身定制的网站。


原文链接:

https://thenewstack.io/frontend-strategies-frameworks-or-pure-javascript

声明:本文由 InfoQ 翻译,未经许可禁止转载。

2024-09-04 17:528884

评论

发布
暂无评论
发现更多内容

linux使用udev配置U盘自动挂载

happlyfox

Linux 28天写作 udev 自动挂载

上过云么?一行代码秒上云体验过么?

华为云开发者联盟

华为云 云服务器 devcloud 代码托管

区块链赋能电子合同!构建互联网可信生态整体解决方案

源中瑞-龙先生

Redis最佳实践:7个维度+43条使用规范,带你彻底玩转Redis | 附最佳实践清单

Kaito

数据库 redis 后端

元素XPATH定位点击为什么老失败?

小小娃爱吃甜食

Python 自动化 测试 selenium

有图有真相:带你实现现流行的权限验证

华为云开发者联盟

安全 session 权限 JWT 认证

大话 Python:python 操作 excel 系列 -- 数据的提取与筛选

老王说编程

Python Excel 数据提取与筛选

徐烨:这20年,我与应用系统的“云化”之路

华为云开发者联盟

架构 服务器 华为云 企业上云 应用系统

话说 wait、notify 、 notifyAll

木子的昼夜

Java 通信 Wait notify notifyAll

git 教程 --git reset命令

生之欢愉,时间同行

git git reset

B站专栏内页数据如何抓取,Web Scraper 学习在进一步,无编码学爬虫之五

梦想橡皮擦

Python 28天写作 3月日更

【LeetCode】俄罗斯套娃信封问题Java题解

Albert

算法 LeetCode 28天写作

大话 Python:python 操作 excel 系列 -- 怎样读取 excel 文件?

老王说编程

Python Excel 数据读取

大话 Python:python 操作 excel 系列 -- 数据处理

老王说编程

数据处理 python excel

智汇华云 | 深入理解Istio中的证书管理

华云数据

failure: repodata/repomd.xml from cloudera-manager: [Errno 256] No more mirrors to try

wjchenge

大话 Python:python 操作 excel 系列 -- pandas 读取、分析、保存

老王说编程

Python Excel pandas

大话 Python:python 操作 excel 系列 -- excel 数据分析

老王说编程

Python 数据分析 Excel

DevOps敏捷60问,一定有你想了解的问题

华为云开发者联盟

DevOps 运维 敏捷 工具链 华为云

简述Electron的发展和应用

anyRTC开发者

WebRTC 跨平台 Electron RTC sdk

大话 Python:python 操作 excel 系列 -- 数据清洗

老王说编程

Python Excel 数据清洗

大话 Python:python 操作 excel 系列 -- 数据汇总与统计

老王说编程

Python Excel 数据统计

浪潮肖雪:用工业互联网解决企业痛点问题

工业互联网

从小厂逆袭快手,我是如何准备面试的

haxianhe

通过AWS EMR降低集群计算成本

行者AI

AWS 计算

Volcano社区正式发布v1.2.0版本

华为云原生团队

人工智能 开源 AI 云原生

上云三问 | 京东云这次的大促有哪些“不一样”?

京东科技开发者

云主机 云安全

3 月日更挑战|春日胜景,记录暖心每一天

InfoQ写作社区官方

七日更 3月日更 热门活动

量化交易马特机器人(币掌柜/小树/小喜/瓦力)系统开发策略搭建

薇電13242772558

数字货币 量化策略

Spring Boot+Maven实现车牌训练、识别系统

不脱发的程序猿

maven Spring Boot 图像处理 28天写作 车牌训练、识别系统

如何使用Excel表格精准分析PT100温度阻值关系?

不脱发的程序猿

28天写作 PT100 温度采集算法 Excel数据分析 传感器采集

前端策略:使用框架还是纯JavaScript?_架构/框架_Jordan Smith_InfoQ精选文章