簡評：很多框架都沒用過宵溅，學(xué)不完學(xué)不完髓介。
本文將比較相同 RealWorld 應(yīng)用 不同實(shí)現(xiàn)的各種指標(biāo)榕暇。
RealWorld 示例程序 有以下特點(diǎn)
- 真實(shí)的應(yīng)用程序：不僅僅是簡單的 TODO 項(xiàng)目蛆封。
- 標(biāo)準(zhǔn)化： 符合特定規(guī)則的項(xiàng)目剃法。提供后端API碎捺，靜態(tài)標(biāo)記，樣式和規(guī)范贷洲。
- 由專家撰寫或?qū)忛啠哼@些項(xiàng)目由該領(lǐng)域的專家構(gòu)建或?qū)彶椤?/li>
我們正在比較哪些庫/框架收厨？
比較的指標(biāo)有：
- 性能：此應(yīng)用程序顯示內(nèi)容并到可用花費(fèi)的時間？
- 大杏殴埂：該應(yīng)用有多大诵叁？我們只會比較已編譯后 JavaScript 文件的大小。CSS 對于所有變種都是通用的钦椭，并且從 CDN（內(nèi)容交付網(wǎng)絡(luò)）下載拧额。HTML 也適用于所有變體。所有技術(shù)都可以編譯或轉(zhuǎn)換成 JavaScript彪腔，因此我們只比較 JavaScript 文件的大小侥锦。
-
代碼行：作者需要根據(jù)規(guī)范創(chuàng)建 RealWorld 應(yīng)用程序需要多少行代碼？我們量化標(biāo)準(zhǔn)是應(yīng)用程序
src/中的代碼行數(shù)德挣。
性能
使用 Chrome 的 Lighthouse Audit 來進(jìn)行首次有效繪制測試恭垦。首次游戲繪制的時間越短體驗(yàn)越好。
大小
轉(zhuǎn)換的代碼大小來自 Chrome network tab 數(shù)據(jù)顯示。從服務(wù)器返回的 GZIPed 響應(yīng)標(biāo)頭加上響應(yīng)主體署照。文件越小意味著下載越快（并且解析速度越快）祸泪。
這取決于你的框架大小、你添加的額外依賴關(guān)系以及你的構(gòu)建工具如何壓縮建芙。
可以看到 Svelte, Dojo 2 和 AppRun 表現(xiàn)非常的出色没隘。
代碼行（編譯前的代碼量）
我們使用 cloc 來計(jì)算每個 repo 的 src 文件夾中的代碼行〗空白和注釋會被忽略右蒲。
代碼量越小，出現(xiàn)錯誤的概率就越小赶熟。
原文鏈接： A Real-World Comparison of Front-End Frameworks with Benchmarks (2018 update)
推薦閱讀：后端開發(fā)人員的路線圖 2018 版
