0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

React、Preact和Inferno谁才是真正优秀的JavaScript框架?

如意 来源:读芯术微信公众号 作者:读芯术微信公众号 2020-10-13 16:12 次阅读
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

JavaScript中有许多框架,且各有千秋。在过去的几个月中,笔者一直在研究各种JavaScript框架及其差异。本文中,笔者将选择三个框架,并讨论构建快速Web应用程序的优秀框架。

笔者选择了React、Preact和Inferno,它们是非常有名的框架。本文将讨论这些框架的功能(能够开发快速的Web应用程序)、优缺点、统计数据以及其他一些有趣的特点,这些特点将帮助你为项目选择优秀的框架。

Preact

Preact声称是最轻量级的框架之一,大小为3kB。体积小并没有限制其性能。它被认为是一个非常强大的框架,并且是React的有力竞争对手。

将Preact与React进行比较时,可以发现它们之间存在一些相似之处。但由于Preact的功能主要基于速度和性能,因此它们还有更多重要的区别。以下是Preact的一些主要功能,这些功能使其比React更快:

首先,Precat压缩后大小约为3Kb。React压缩后约为42KB。

尽管React拥有自己的综合事件系统,该系统具有多种优点,但却被认为非常繁重。Preact仅使用DOM API来实现合成事件系统的功能。

Preact比React-lite(React的简化版本)具有更多功能。

Preact明显比React快。笔者发现了这个很棒的速度比较机制,该机制在GitHub站点上托管。它可以通过添加、完成和删除100个项目来比较框架速度。因此,笔者从中进行了基准测试,结果表明Preact比React快四倍。

React、Preact和Inferno谁才是真正优秀的JavaScript框架?

另外,如果熟悉React,与Preact一起使用会非常容易,因为它与React很大程度上兼容。除此之外,使用Preact还有几个重要的优点:

它支持ES6 API(与React相同)。

强大的CLI支持快速的项目设置

包含React独有的其他高级功能。

Preact处于迅速增长中,出现了许多示例、大量文档、不断增长的社区等。

尽管Preact包含许多功能,但也有一些缺点。但如果需要构建基于性能的小型应用程序,那么Preact仍然是比React更好的选择。

Inferno

Inferno是另一个JavaScript UI库,类似于React。与Preact相似,Inferno也使用与React相同的API构建,但是Inferno的主要目的是变得快速、轻便。尽管Inferno基于React,但与React 和Preact相比,它包含一些重要的功能/差异:

与React相比,Inferno的体积非常小。压缩后约为8KB,比Preact稍大。

Inferno不单独包含DOM。Inferno的DOM内置于其核心中。

Inferno-compact可以帮助您使用各种React库。

Inferno在功能组件上使用生命周期方法。

由于本文主要基于比较速度和性能,因此来看一下Inferno自身提供的关于一些JS框架的基准比较。

React、Preact和Inferno谁才是真正优秀的JavaScript框架?

如图所示,Inferno对于典型应用程序操作的基准值高于Preact和React的基准值。它们几乎与Vanilla JS相似。可以在GitHub上找到有关此基准测试系统的更多详细信息。以下是使用Inferno的其他一些优点:

速度极快。

比React、Angular和Vue更轻便。

Inferno包含其自己的服务器端渲染和路由功能。

可以将常规样式属性与Inferno样式一起使用。

可以使用自己的体系结构来构建应用程序,而不是将其限制于其他人的设计。

另一方面,它也存在一些明显的缺点。由于与React相比,Inferno相对较新,因此其生态系统和社区仍在发展。从而需要大量时间来提供其他库、支持等。

同样,Inferno不对Hooks提供支持。尽管可以使用inferno-compact来使用React组件或包,但是这会使项目变慢并且变大。这样Inferno的优质体验感会打折扣。

本文主要目的是比较React、Preact和Inferno框架的速度。可以看到,Preact和Inferno的大多数功能基于React。但是在速度和性能方面,Preact居首位,而Inferno则位居第二。

因此,如果正在为需要闪电般性能的小型平台寻找类似React的框架,Preact或Inferno将是理想选择。但必须始终牢记, React是已经几乎取代了Angular的即成框架,因此无法将React与Preact或Inferno的功能完全匹配。

在功能和本机支持方面,React仍然位居榜首,而Preact和Inferno在速度方面具有优势,根据项目选你所需即可。
责编AJX

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • Web
    Web
    +关注

    关注

    2

    文章

    1302

    浏览量

    73618
  • javascript
    +关注

    关注

    0

    文章

    525

    浏览量

    55983
  • reactjs
    +关注

    关注

    0

    文章

    4

    浏览量

    4708
收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    【选型建议】选Mesh还是LoRa?才是你的理想无线方案?

    技术,才是您项目真正需要的连接方案? 对比两者的网络架构、传输特性、功耗管理与应用适配性,一句话总结: “Mesh”适合近距互动, “LoRa”适合远距上报。 01、技术原理概述:两种“网”的不同思路 01无线 Mesh 自组网:节点互联、路径多样的“网状思
    的头像 发表于 11-19 17:51 503次阅读

    PLC vs 嵌入式:才是工业场景的“最优解”?

    PLC和嵌入式作为工业控制领域的常用方案,应该如何选择?才是工业场景的“最优解”?前言清晨7点的智能车间里,流水线的机械臂正以0.1毫米的精度抓取发动机零部件,传感器实时反馈的温度、压力数据在
    的头像 发表于 11-18 11:46 197次阅读
    PLC vs 嵌入式:<b class='flag-5'>谁</b><b class='flag-5'>才是</b>工业场景的“最优解”?

    VLA和世界模型,才是自动驾驶的最优解?

    Model)路线,这两种路径都为自动驾驶快速落地提供了可能,那才是最优解? 什么是VLA模型? VLA模型,即视觉—语言—行动模型,是将视觉感知、语言理解和动作生成串联起来的一套方法。它先是通过视觉编码器,将摄像头看到的画面转换成语
    的头像 发表于 11-05 08:55 473次阅读
    VLA和世界模型,<b class='flag-5'>谁</b><b class='flag-5'>才是</b>自动驾驶的最优解?

    淘宝 vs 京东电商 API 接口,才是数据王者?

    API进行客观比较,帮助您判断才是真正的“数据王者”。 1.API功能覆盖范围 API的功能范围决定了开发者能获取的数据类型。淘宝API通过阿里巴巴开放平台提供,覆盖商品、订单、用户、物流等多个模块。例如,商品API支持搜索、
    的头像 发表于 07-08 15:51 615次阅读
    淘宝 vs 京东电商 API 接口,<b class='flag-5'>谁</b><b class='flag-5'>才是</b>数据王者?

    tscircuit - 电路开发的 React 范式​ 用TypeScript、React和 AI工具构建电子产品

    用 TypeScript、React 和 AI 工具构建电子产品。
    的头像 发表于 04-30 18:18 1199次阅读
    tscircuit - 电路开发的 <b class='flag-5'>React</b> 范式​   用TypeScript、<b class='flag-5'>React</b>和 AI工具构建电子产品

    最讨厌AI的人选了特朗普

    魔幻的“川普美国”,只是果,选了特朗普,才是
    的头像 发表于 04-22 16:42 1081次阅读
    最讨厌AI的人选了特朗普

    一种实时多线程VSLAM框架vS-Graphs介绍

    ,vSGraphs优于当前最先进的VSLAM方法,在真实数据上平均降低3.38%的轨迹误差,最大降幅达9.58%。同时,所提出的框架还具有良好的可扩展性,能够处理大规模场景。此外,仅通过视觉特征,本框架实现的语义实体检测精度即可媲美基于激光雷达的精密
    的头像 发表于 04-19 14:07 715次阅读
    一种实时多线程VSLAM<b class='flag-5'>框架</b>vS-Graphs介绍

    AnyDesk vs. Raspberry Pi Connect,才是“远程霸主”?

    在树莓派的世界里,远程控制就像是一场魔法对决,而今天,我们的主角是两位远程控制界的“魔法师”——AnyDesk和RaspberryPiConnect。它们都声称自己是远程控制的最佳选择,那么,才是
    的头像 发表于 03-25 09:24 625次阅读
    AnyDesk vs. Raspberry Pi Connect,<b class='flag-5'>谁</b><b class='flag-5'>才是</b>“远程霸主”?

    DLP7000的光的入射角度是多少才是最佳的?

    有关DLP7000的光的入射角度是多少(垂直于芯片方向)才是最佳的?
    发表于 02-21 12:02

    JavaScript与Rust和WebAssembly集成

    偶然一次机会,接触了Rust的代码。当时想给团队小伙伴做演示,发现自己并不能在移动端按照文档生成演示demo。我就想,要是Rust代码能转化成JavaScript就好了。结果一搜,还真有。
    的头像 发表于 01-24 15:43 795次阅读
    <b class='flag-5'>JavaScript</b>与Rust和WebAssembly集成

    SciChart—高性能的JavaScript图表和图形库

    使用 SciChart 的 JavaScript 图表库为您的 JS 应用程序发现终极解决方案。 使用 WebGL 创建动态、高速的图表和图形,非常适合实时处理复杂的数据可视化。使用我们强大而灵活
    的头像 发表于 01-22 10:15 2525次阅读
    SciChart—高性能的<b class='flag-5'>JavaScript</b>图表和图形库

    热门前端框架:引领现代 Web 开发的潮流

    在当今快速发展的前端开发领域,热门前端框架React、Vue 和 Angular 等,成为了开发者构建高效、高性能 Web 应用的得力工具。它们各自具有独特的特点和优势,引领着现代 Web 开发
    的头像 发表于 01-22 10:08 925次阅读

    Spire.XLS for JavaScript——多功能JavaScript电子表格库(一)

    文件。借助此工具,开发人员能够高效地执行各种 Excel 编程任务,包括从模板生成新文档、更新现有文档或转换文件格式。 Spire.XLS for JavaScript 与 Vue、React
    的头像 发表于 01-21 09:29 793次阅读
    Spire.XLS for <b class='flag-5'>JavaScript</b>——多功能<b class='flag-5'>JavaScript</b>电子表格库(一)

    javascript:void(0) 是否影响SEO优化

    使用 javascript:void(0) 确实可能对SEO优化产生负面影响 。以下是关于 javascript:void(0) 对SEO影响的具体分析: 搜索引擎爬虫的理解问题 搜索引擎爬虫(如
    的头像 发表于 12-31 16:08 975次阅读

    javascript:void(0) 的作用是什么

    javascript:void(0) 在 HTML 和 JavaScript 中是一个常见的表达式,主要用来创建一个无操作的链接(通常是 标签)或者阻止默认事件处理。具体来说,它的作用有以下几点
    的头像 发表于 12-31 15:55 4043次阅读