2020排行榜!Realworld前端框架的比较
全文共1500字,预计学习时长6分钟
图源:unsplash
过去的三年我们都探讨了这个话题,那么今年的情况会是怎样呢?
首先声明,此文并不是关于未来前端选择的比较,而是从三个方面(性能,大小,相似应用下的代码行数)来进行小范围的简单比较。
读者需要注意:
· 本文是在比较Realworld软件——而不是正在研发中的软件,这些软件通常缺乏足够的知识和想法,因此难以实现。
· 由专家撰写或评审过——理想情况下,该技术领域的专家会评估此项目。
· 以某种方式标准化—— 一个符合特定规则的项目存在一种规范,提供后端API,静态标记和样式。
正在比较哪些库/框架?
撰写此文时,Realworld存储库中有24种conduit实现As,它们之间的从属地位并不重要,唯一的判定标准是看它是否出现在RealWorld repo page上。
关注的是什么指标?
性能—此应用程序需要多长时间才能显示内容并可用?
大小—该应用程序有多大?我们将只比较已编译的JavaScript文件的大小。HTML和CSS对所有变体都是通用的,并且是从CDN(内容交付网络)下载的。所有技术都可以编译或转换为JavaScript,因此仅调整该文件的大小。
代码行数—需要多少行代码才能基于规范创建RealWorld应用程序?某些应用程序很麻烦,但应该不会产生重大影响。我们量化的唯一文件夹是每个应用程序中的src /。无论它是否是自动生成的,你仍然需要对其进行维护。
图源:unsplash
标准#1: 性能
我们通过Chrome随附的Lighthouse Audit查看性能得分,得分在0到100之间。有关更多详细信息,请参阅《Lighthouse计分指南》。
审查设置
所有经过测试的应用程序的Lighthouse审核设置
基本原理
越早开发的应用程序,人们越早开始使用,用户体验相对也更好。
性能得分 (0–100) — 越高越好
评论
注意: 由于缺少演示应用程序,因此跳过了PureScript。
总结
通过Lighthouse Aud,可以看到在今年未维护/未更新的应用程序跌破90关口。当然如果得分> 90,可能也不会有很大的不同。AppRun,Elm和Svelte的表现令人印象深刻。
图源:unsplash
标准#2: 大小
传输大小取决于Chrome网络标签,服务器提供的GZIPped响应标头以及正文。
这取决于框架的大小以及所添加的任何其他依赖项。同样,构建工具可以很好地清除捆绑软件中未使用的代码。文件越小,下载速度越快,解析的次数也更少。
文件大小:KB — 文件越小,传输越快
评论
由于缺少演示软件,因此跳过了PureScript。Angular + ngrx + nx,请不要怪我用Angular + ngrx + nx-检查Chrome开发工具网络标签,如果有计算错误的地方,评论区见。
Rust +Yew + WebAssembly 包括 also.wasm file(s)
总结
Svelte和Stencil社区将其压缩到20KB以下的出色操作,确实是一项成就。
标准 #3: 代码行数
cloc可以计算每个存储库src文件夹中的代码行数,空白行和注释行不算在内,意义何在?
如果调试程序是移除软件缺陷的过程,那么编写程序就是把软件缺陷放进来的过程— EdsgerDijkstra
基本原理
这说明给定库/框架/语言的简洁程度。根据规范,你需要多少行代码才能实现功能基本相同的应用程序(其中一些具有更多的功能)。
# 代码行数— 越少越好
评论
由于cloc无法处理.svelte文件,因此跳过了Svelte。
由于cloc无法处理.riot文件,因此跳过了riotjs-effector-universal-hot。
Angular+ ngrx:使用/ libs文件夹完成的LoC计算仅包括.ts和.html文件。你的看法是什么呢?欢迎探讨。
总结
只有重新构架的Imba和ClojureScript才能在1000LoC下实施该应用程序。Clojure以异常表达而著称。Imba第一次出现在这个行列里(去年是cloc,没有.imba文件格式),并且看起来会继续存在。如果您在意LoC,您就会知道该怎么做。
图源:unsplash
今年的结果就是这样,欢迎在评论区讨论你的看法~
留言 点赞 关注
我们一起分享AI学习与发展的干货
欢迎关注全平台AI垂类自媒体 “读芯术”
(添加小编微信:dxsxbb,加入读者圈,一起讨论最新鲜的人工智能科技哦~)
2020排行榜!Realworld前端框架的比较相关推荐
- 2020年最新前端框架大全,Web工程师人手一份!
今天跟大家分享一些目前比较热门新鲜度靠前的50款前端工具,希望对你有所帮助. 一.构建工具 1. Parcel 地址:https://parceljs.org Parcel是一款极速零配置WEB应用打 ...
- 2020年最新前端框架大全,Web工程师人手一份
今天跟大家分享一些目前比较热门新鲜度靠前的50款前端工具,希望对你有所帮助. 一.构建工具 1. Parcel 地址:https://parceljs.org Parcel是一款极速零配置WEB应用打 ...
- 十大新兴前端框架大盘点【云图智联】展望2020
2019年在整体上,前端的主流框架没有太大的变化,业务代码仍由三大框架(React.Vue.Angular)所主宰着,打包工具一般仍使用webpack.Rollup.js,状态管理器还是Redux.M ...
- 2020年Web前端最新导航(常见前端框架、前端大牛)
前言 本文列出了很多与前端有关的常见网站.博客.工具等,整体来看比较权威.有些东西已经过时了,我就不列出来了. 学是一方面,也是最主要的方面:但还有一个作用,比如,"这个前端框架你都不知道啊 ...
- 2020 非常火的 11 个微前端框架
点击"开发者技术前线",选择"星标????" 让一部分开发者看到未来 作者 | Jonathan Saring 译者 | Flora https://itnex ...
- 2020 非常火的11个微前端框架
点击上方"Github中文社区",关注 看遍Github,每天提升 作者 | Jonathan Saring 译者 | Flora https://itnext.io/11-mic ...
- 2020年排名前10的前端框架
Ant Design 网站链接:https://ant.design/index-cn 蚂蚁金服出品,非常著名的框架.就算你不了解前端,也会在公司的项目中多少听到程序员说起过.目前很多公司都在用,已经 ...
- 新兴前端框架 Svelte 从入门到原理
在这篇文章中,我们将会介绍 Svelte 框架的特性.优缺点和底层原理. 本文尽量不会涉及 Svelte 的语法,大家可以放心食用.因为 Svelte 的语法极其简单,而且官方教程学习曲线平缓http ...
- 框架对比_2020 年前端框架性能对比和评测
我们又来做这个对比了.这次是 2020 年的版本,还有之前的版本: 2019 年. 2018 年. 2017 年. 先来明确一点--这篇文章绝对不是为了告诉你该选择哪个前端框架而写的.它只是一个小型而 ...
最新文章
- python3 报错 TypeError: load() got an unexpected keyword argument ‘encoding‘ 解决方法
- LeetCode 3Sum
- 【Python】Autoviz: 一行代码搞定数据集探索并可视化
- Elasticsearch系列「零」架构解析与最佳实践
- DotNetTextBoxV3.0在线编辑器控件Ver3.4.1 Open Source开源版(附商业试用版下载)
- 机器学习算法实现解析:libFM之libFM的训练过程之SGD的方法
- 已经创建了AWS EC2实例,Linux系统默认没有root用户,那么如何创建root用户并更改为root用户登录呢?
- JS 获取当前日期时间(兼容IE FF)
- YaCy开源搜索引擎的热门技巧
- 蔚来召回4803辆ES8电动汽车 自燃原因找到了?
- PXE无人值守系统安装配置简要说明
- JSP程序设计习题4-3.6
- 数据库学习笔记【自学教程】—— 如何建立数据库
- 爆肝六万字整理的python基础,快速入门python的首选
- python+selenium实现网页全屏截图
- 计算机为什么有个来宾用户名,电脑里面突然多出来一个叫Guest的账户是怎么回事?...
- 微信小程序开发监听器教程
- 调查报告:创意行业是否为远程办公做好准备?
- ITIL先锋论坛专家风采——陈多思
- 夏普电视显示服务器忙碌或网络异常,夏普电视故障常见有哪些?
热门文章
- 【高并发】高并发分布式锁架构解密,不是所有的锁都是分布式锁(升级版)!!
- linux pci串口驱动下载,PCI串行口驱动下载_PCI串行口驱动官方下载-太平洋下载中心...
- mysql root密码忘记2018_MySQL数据库之2018-03-28设置及修改mysql用户密码学习笔记
- jQuery之动画系列(show、hide、fadeIn、fadeOut、fadeToggle、fadeTo、slideDown、slideUp、slideToggle)
- Scrapy爬虫:代理IP配置
- catia相合约束怎么反向_男人想离婚了,出现这4大征兆,女人要怎么办
- OpenCV Face Recognition山寨版
- 【K580键盘】蓝牙连接一直失败
- IDEA无法使用已安装的字体
- LabView 下载与安装