写点什么

前端框架基准测试最新结果:18 个框架当中有 13 个达到顶级

  • 2019-04-26
  • 本文字数:1459 字

    阅读完需:约 5 分钟

前端框架基准测试最新结果:18个框架当中有13个达到顶级

小型全栈式 App RealWorld Conduit 最近更新了其基准测试结果。这款 App 分别采用 18 个不同的前端框架构建,并对它们进行了比较。结果显示,18 个框架当中有 13 个获得了顶级的 LightHouse 的分数(也就是在总分 100 分的情况下获得 90 以上)。在这 18 个框架当中,Svelte、Stencil、AppRun、Dojo、HyperApp 和 Elm 的网络传输负载最低(低于 30KB)。


自称为”演示 App 之母“的 Conduit 是对 Medium.com 的全栈式克隆,采用了一组API规范,并带有具备真实世界复杂性的功能。RealWorld项目核心维护者 Eric Simons 解释说:


它就像是TodoMVC,只是使用全栈技术实现。RealWorld 向大家展示了如何使用 React/Angular 等框架在 Node/Django 等平台上构建真实的博客平台。开发者可以把它们混合起来,因为它们都遵循相同的 API 规范。


RealWorld 基准测试始于 2017 年,最近更新了针对使用 18 个不同前端框架实现的 Conduit 的评估结果。2019 年的基准测试排名主要关注这三个方面:性能、大小和代码量。


性能分数是通过LightHouse来评估的。LightHouse 是一个非常流行的用于改进 Web 质量的自动化工具。LightHouse 对性能、可访问性和渐进式 Web App 进行审计,并基于六个加权指标给出性能评估分数。这六个指标按照重要程度排序如下:


  • TTI(Time to Interactive):让一个页面变得可交互需要多长时间。

  • 速度指数(Speed Index):页面处理内容的速度,分数越低也好。

  • FCP(First Contentful Paint):从导航一个页面到浏览器开始渲染 DOM 第一个字节的时间。

  • FCI(First CPU Idle):页面达到最小化可交互的时间(不需要等到页面上的所有元素都可交互,只要可以对大部分用户输入做出响应即可)。

  • FMP(First Meaningful Paint):用户感知到页面主要内容可见的时间。

  • 预估的输入延迟(Estimated Input Latency)。


LightHouse 将性能分数分为三组。90 到 100 分为顶级,表示性能最好的网站。在 RealWorld 基准测试中,大部分(18 个中有 13 个)Conduit 实现属于这一组。前 13 个框架中包括已经很成熟的框架(如 Elm、Dojo、Vue、Angular、Aurelia、Stencil、Svelte 和 React)、简约型框架(如 AppRun、Hyperapp)、较少被使用的框架(如 Crizmas 或 reframe)以及可编译成 JavaScript 的框架 Imba。


这 18 种 Conduit 实现也根据大小进行了排名。基准测试作者详细介绍了这一标准背后的原理及其计算方法:


传输大小是从 Chrome 开发者工具的 Network 页面获得的,包括 GZip 压缩的响应头和响应体……文件越小下载就越快,需要解析的东西就越少。


在性能最好的 13 个框架中,有 6 个(Svelte、Stencil、AppRun、Dojo、HyperApp 和 Elm)的传输大小小于 30KB:



他们通过k-means聚类算法将 18 个框架的传输大小分为 5 类。


框架的特点可以用来解释为什么它们的传输大小可以达到这么小:


  • Svelte 自称为”神奇的即逝 UI 框架“,将 API 编译成最优化的 JavaScript。

  • Stencil 的运行时只有 6KB,并可以编译成 Web 组件。

  • AppRun 和 HyperApp 的体积非常小(分别为 3KB 和 1KB)。

  • Dojo 最近推出了自动代码拆分特性,并针对 PRPL 性能模式进行了优化。

  • Elm 0.19 针对资产文件进行了优化。


前端框架的繁荣促成了基准测试的流行,这些基准测试旨在通过各种有意义的方式对框架进行比较。基准测试涉及的框架可能是各种各样的,具体取决于要比较哪些方面的内容、基准测试的方法和相关性以及分数的算法。但是,在选择前端框架时,还是要进行全盘考虑,包括质量和数量方面的指标。


查看英文原文Benchmark Ranks 18 Front-End Frameworks Implementation of Medium.com Clone


2019-04-26 09:288520
用户头像

发布了 731 篇内容, 共 468.1 次阅读, 收获喜欢 2006 次。

关注

评论 2 条评论

发布
用户头像
佩服兄弟666啊,来我们公司吧,在泰国,收入大几万,邀请你来v我TH0631280401
2019-04-27 17:15
回复
东南亚程序猿骗局?
2019-05-13 18:35
回复
没有更多了
发现更多内容

Linux操作系统中软件安装

小魏写代码

思码逸荣获汽车数智未来创新峰会“年度数字化创新产品奖”

思码逸研发效能

【论文解读】| 通过大语言模型实现通用模糊测试

云起无垠

LaunchPad 市场的复苏,Penpad 成新兴生力军

加密眼界

Python 开发在未来会有怎样的发展?

算法的秘密

如何使用极狐GitLab 代码推送规则,提高代码质量?

极狐GitLab

✅对线面试官-单线程能不能实现多并发

派大星

面试突击 Java 面试题

Go 首次冲进前八!曾两次夺得年度编程语言,也曾跌至百名开外 | TIOBE 2 月榜单发布

博文视点Broadview

华为云GaussDB支撑农行超级网银业务,性能和稳定性备受认可

华为云开发者联盟

数据库 后端 华为云 华为云GaussDB 华为云开发者联盟

vivo 短视频体验与成本优化实践

vivo互联网技术

体验 音视频 成本

测试管理进阶 | 量力而行:避免成为替罪羊

测吧(北京)科技有限公司

LaunchPad 市场的复苏,Penpad 成新兴生力军

股市老人

【Java21问答】为什么synchronized会PINNED虚拟线程?

袁世超

synchronized ObjectMontior 虚拟线程 Java21

华为云帕鲁服务器-云耀云容器版,到底强在哪?

华为云开发者联盟

服务器 华为云 华为云开发者联盟 幻兽帕鲁

信创的全称是什么?与非信创有什么区别?

行云管家

IT 信创 国产化 非信创

回顾 | E³CI效能认知与改进论坛,助力企业研发效能度量和提升

思码逸研发效能

详解 API 设计最佳实践

Noah

TPC-H 基准测试:Databend Cloud 与 Snowflake 对比

Databend

测试管理忠告|量力而行:避免成为替罪羊

霍格沃兹测试开发学社

LaunchPad 市场的复苏,Penpad 成新兴生力军

股市老人

论ai韭菜的自我修养

文思源想

AI 成长感悟 文思源想

掌握云容器网络:何为ipvs

华为云开发者联盟

开发 华为云 华为云开发者联盟 云容器

一文搞懂设计模式—适配器模式

Java随想录

Java 设计模式

干货 | 汽车行业研发效能提升的挑战与实践案例

思码逸研发效能

AI Agent深入浅出——以ERNIE SDK和多工具智能编排为例

飞桨PaddlePaddle

百度 BAIDU 百度飞桨 开发者说 AI Agent

前端框架基准测试最新结果:18个框架当中有13个达到顶级_大前端_Bruno Couriol_InfoQ精选文章