0
  • 聊天消息
  • 系統(tǒng)消息
  • 評論與回復
登錄后你可以
  • 下載海量資料
  • 學習在線課程
  • 觀看技術視頻
  • 寫文章/發(fā)帖/加入社區(qū)
會員中心
創(chuàng)作中心

完善資料讓更多小伙伴認識你,還能領取20積分哦,立即完善>

3天內不再提示

React、Preact和Inferno誰才是真正優(yōu)秀的JavaScript框架?

如意 ? 來源:讀芯術微信公眾號 ? 作者:讀芯術微信公眾號 ? 2020-10-13 16:12 ? 次閱讀

JavaScript中有許多框架,且各有千秋。在過去的幾個月中,筆者一直在研究各種JavaScript框架及其差異。本文中,筆者將選擇三個框架,并討論構建快速Web應用程序的優(yōu)秀框架。

筆者選擇了React、Preact和Inferno,它們是非常有名的框架。本文將討論這些框架的功能(能夠開發(fā)快速的Web應用程序)、優(yōu)缺點、統(tǒng)計數(shù)據(jù)以及其他一些有趣的特點,這些特點將幫助你為項目選擇優(yōu)秀的框架。

Preact

Preact聲稱是最輕量級的框架之一,大小為3kB。體積小并沒有限制其性能。它被認為是一個非常強大的框架,并且是React的有力競爭對手。

將Preact與React進行比較時,可以發(fā)現(xiàn)它們之間存在一些相似之處。但由于Preact的功能主要基于速度和性能,因此它們還有更多重要的區(qū)別。以下是Preact的一些主要功能,這些功能使其比React更快:

首先,Precat壓縮后大小約為3Kb。React壓縮后約為42KB。

盡管React擁有自己的綜合事件系統(tǒng),該系統(tǒng)具有多種優(yōu)點,但卻被認為非常繁重。Preact僅使用DOM API來實現(xiàn)合成事件系統(tǒng)的功能。

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

Preact明顯比React快。筆者發(fā)現(xiàn)了這個很棒的速度比較機制,該機制在GitHub站點上托管。它可以通過添加、完成和刪除100個項目來比較框架速度。因此,筆者從中進行了基準測試,結果表明Preact比React快四倍。

React、Preact和Inferno誰才是真正優(yōu)秀的JavaScript框架?

另外,如果熟悉React,與Preact一起使用會非常容易,因為它與React很大程度上兼容。除此之外,使用Preact還有幾個重要的優(yōu)點:

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

強大的CLI支持快速的項目設置

包含React獨有的其他高級功能。

Preact處于迅速增長中,出現(xiàn)了許多示例、大量文檔、不斷增長的社區(qū)等。

盡管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誰才是真正優(yōu)秀的JavaScript框架?

如圖所示,Inferno對于典型應用程序操作的基準值高于Preact和React的基準值。它們幾乎與Vanilla JS相似??梢栽贕itHub上找到有關此基準測試系統(tǒng)的更多詳細信息。以下是使用Inferno的其他一些優(yōu)點:

速度極快。

比React、Angular和Vue更輕便。

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

可以將常規(guī)樣式屬性與Inferno樣式一起使用。

可以使用自己的體系結構來構建應用程序,而不是將其限制于其他人的設計。

另一方面,它也存在一些明顯的缺點。由于與React相比,Inferno相對較新,因此其生態(tài)系統(tǒng)和社區(qū)仍在發(fā)展。從而需要大量時間來提供其他庫、支持等。

同樣,Inferno不對Hooks提供支持。盡管可以使用inferno-compact來使用React組件或包,但是這會使項目變慢并且變大。這樣Inferno的優(yōu)質體驗感會打折扣。

本文主要目的是比較React、Preact和Inferno框架的速度??梢钥吹剑琍react和Inferno的大多數(shù)功能基于React。但是在速度和性能方面,Preact居首位,而Inferno則位居第二。

因此,如果正在為需要閃電般性能的小型平臺尋找類似React的框架,Preact或Inferno將是理想選擇。但必須始終牢記, React是已經(jīng)幾乎取代了Angular的即成框架,因此無法將React與Preact或Inferno的功能完全匹配。

在功能和本機支持方面,React仍然位居榜首,而Preact和Inferno在速度方面具有優(yōu)勢,根據(jù)項目選你所需即可。
責編AJX

聲明:本文內容及配圖由入駐作者撰寫或者入駐合作網(wǎng)站授權轉載。文章觀點僅代表作者本人,不代表電子發(fā)燒友網(wǎng)立場。文章及其配圖僅供工程師學習之用,如有內容侵權或者其他違規(guī)問題,請聯(lián)系本站處理。 舉報投訴
  • Web
    Web
    +關注

    關注

    2

    文章

    1265

    瀏覽量

    69526
  • javascript
    +關注

    關注

    0

    文章

    519

    瀏覽量

    53889
  • reactjs
    +關注

    關注

    0

    文章

    4

    瀏覽量

    4561
收藏 人收藏

    評論

    相關推薦

    javascript:void(0) 是否影響SEO優(yōu)化

    使用 javascript:void(0) 確實可能對SEO優(yōu)化產(chǎn)生負面影響 。以下是關于 javascript:void(0) 對SEO影響的具體分析: 搜索引擎爬蟲的理解問題 搜索引擎爬蟲(如
    的頭像 發(fā)表于 12-31 16:08 ?161次閱讀

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

    javascript:void(0) 在 HTML 和 JavaScript 中是一個常見的表達式,主要用來創(chuàng)建一個無操作的鏈接(通常是 標簽)或者阻止默認事件處理。具體來說,它的作用有以下幾點
    的頭像 發(fā)表于 12-31 15:55 ?198次閱讀

    使用SSR構建React應用的步驟

    。 根據(jù)需要安裝用于服務器端的框架,如Express、Koa等。 安裝用于處理React服務器端渲染的庫,如 react-dom/server 。 二、服務器端渲染配置 設置服務
    的頭像 發(fā)表于 11-18 11:30 ?344次閱讀

    Taro鴻蒙技術內幕系列(一):如何將React代碼跑在ArkUI上

    基于 Taro 打造的京東鴻蒙 APP 已跟隨鴻蒙 Next 系統(tǒng)公測,本系列文章將深入解析 Taro 如何實現(xiàn)使用 React 開發(fā)高性能鴻蒙應用的技術內幕。
    的頭像 發(fā)表于 10-25 17:24 ?338次閱讀
    Taro鴻蒙技術內幕系列(一):如何將<b class='flag-5'>React</b>代碼跑在ArkUI上

    人工與自動化,才是真正的贏家?#工業(yè)自動化 #機器視覺檢測設備 #AOI光學檢測

    工業(yè)自動化
    思普泰克
    發(fā)布于 :2024年07月30日 16:06:34

    日志框架簡介-Slf4j+Logback入門實踐

    結果不受日志的有無影響,但沒有日志的應用程序是不完整的,甚至可以說是有缺陷的。優(yōu)秀的日志系統(tǒng)可以 記錄操作軌跡 、 監(jiān)控系統(tǒng)運行狀態(tài) 和 解決系統(tǒng)故障 。 Java 日志框架進化史 早期 Java 日志框架沒有制定統(tǒng)一的標準,使
    的頭像 發(fā)表于 07-30 10:00 ?1166次閱讀
    日志<b class='flag-5'>框架</b>簡介-Slf4j+Logback入門實踐

    bootstrap框架和vue框架的區(qū)別

    Bootstrap和Vue都是目前非常流行的前端開發(fā)框架,它們各自具有獨特的優(yōu)勢和特點。 設計理念 Bootstrap是一個基于HTML、CSS和JavaScript的前端開發(fā)框架,主要用于快速構建
    的頭像 發(fā)表于 07-11 09:55 ?909次閱讀

    bootstrap框架介紹

    Bootstrap是一個流行的前端框架,它提供了一套響應式、移動優(yōu)先的CSS和JavaScript組件,可以幫助開發(fā)者快速構建美觀、功能豐富的網(wǎng)頁。 一、Bootstrap簡介 1.1
    的頭像 發(fā)表于 07-11 09:53 ?584次閱讀

    bootstrap框架用什么軟件開發(fā)

    Bootstrap是一個流行的前端框架,用于快速開發(fā)響應式和移動優(yōu)先的Web應用程序。它提供了一套預定義的CSS和JavaScript組件,使得開發(fā)者可以快速構建出漂亮的用戶界面
    的頭像 發(fā)表于 07-11 09:50 ?538次閱讀

    nlp自然語言處理框架有哪些

    許多優(yōu)秀框架和工具,這些框架和工具為研究人員和開發(fā)者提供了強大的支持。以下是一些主要的NLP框架和工具的介紹: NLTK(Natural Language Toolkit) NLTK
    的頭像 發(fā)表于 07-09 10:28 ?585次閱讀

    鴻蒙語言基礎類庫:ohos.convertxml xml轉換JavaScript

    轉換xml文本為JavaScript對象。
    的頭像 發(fā)表于 07-08 15:54 ?441次閱讀
    鴻蒙語言基礎類庫:ohos.convertxml  xml轉換<b class='flag-5'>JavaScript</b>

    OpenHarmony 之 NAPI 框架介紹

    環(huán)境中的 JS 變量與方法。 OpenHarmony 中的 NAPI OpenAtom OpenHarmony(以下簡稱 “OpenHarmony”)應用層基于 javascript 語言開發(fā),而系統(tǒng)框架層則基于 C++ 語言。它們之間需要一
    的頭像 發(fā)表于 02-01 17:34 ?727次閱讀
    OpenHarmony 之 NAPI <b class='flag-5'>框架</b>介紹

    R-Rhealstone框架使用教程

    本篇文章描述基于Rhealstone的系統(tǒng)實時性的測量基準的框架--R-Rhealstone框架。
    的頭像 發(fā)表于 01-18 10:54 ?1563次閱讀
    R-Rhealstone<b class='flag-5'>框架</b>使用教程

    鴻蒙開發(fā)-ArkUI框架實戰(zhàn)【日歷應用 】

    :eTS 關于eTS eTS語言:基于TypeScript(簡稱TS)拓展的出來的,是OpenHarmony應用開發(fā)語言,使用ArkUI框架提供的組件進行界面開發(fā)。 什么是TypeScript
    發(fā)表于 01-17 21:37

    鴻蒙ArkTS的起源和簡介

    成熟。 為了提升應用的開發(fā)效率,相應的JS前端框架也不斷地涌現(xiàn)出來。其中比較典型的有Facebook發(fā)起的React.js,以及個人開發(fā)者尤雨溪發(fā)起的Vue.js。React和Vue的主要出發(fā)點都是將響應式編程
    發(fā)表于 01-16 16:23