Oxlint 会取代 Eslint 吗?

最近,一个基于 Rust 的代码检查工具 Oxlint 在国外前端社区引起了热议,许多专家对其给予了高度评价。那么,相比于它的大哥 Eslint,Oxlint 有哪些优势?它会在未来取代 Eslint 吗?本文将讨论这个话题。

Oxc 和 Oxlint

OxlintOxc 项目下的一个产品,Oxc 是一个用 Rust 实现的前端工具链集合,包括:

  • Linter:即 Oxlint,可与 Eslint 相媲美,是本文的主角

  • Parser:即 oxc_parser,用于解析 .js(x).ts(x),可与 swc 媲美。基准测试声称其速度是 swc 的两倍

a295b50a7f4710e61d862cdc8828df44.png

  • Resolver:解析 ESM 和 CJS 文件的路径,基准测试显示其速度比 webpack/enhanced-resolve 快 28 倍

  • Formatter:基准测试对比 Prettier,尚未公布

  • Transpiler:对比 Babel 用于将高级语法转为低级语法,尚未公布

  • Minifier:代码压缩工具,尚未公布

除了与 Oxc 具有相同设计理念的工具(所有工具链工具均基于 Rust 开发)之外,还有 BiomeRuff

  • Biome:其前身是由 Babel 作者 Sebastian McKenzie 开发的 Rome。目标语言是 JS

  • Ruff:目标语言是 Python

Oxlint 介绍

Oxlint 引发热议的主要原因是其爆炸性的性能。

df5915daeb68081da91f4c72f0c55e24.png

我使用 Apple M1 Pro 32G 运行一个包含约 50 个文件的小项目,仅用了 18ms,官方声称其基准测试中比 Eslint 快 50-100 倍的说法并非虚言。

8ec86d74a32e85da54ef20c9ef56b02e.png

当然,除了性能优势外,OxlintEslint 还有许多不同之处。接下来,我们将从三个方面比较 OxlintEslint

易用性

Eslint 诞生于 2013 年。相比于竞争对手(如 JSHint),其最大的优势在于提供大量可选规则,并在某些场景下可以自动修复不符合规则的代码。

然而,随着时间推移,这一优势逐渐变成劣势——开发者不再需要大量自定义规则,而是需要基于最佳实践的开箱即用规则集。许多新产品正是基于这一概念而诞生的,如:

  • Prettier:仅检查和格式化代码风格

  • eslint-plugin-antfu:Antfu 自定义规则集的版本

Oxlint 借鉴了上述产品的优势,提供了一套开箱即用的默认规则。这套规则主要关注代码的正确性(如语法错误、冗余代码和容易引起误解的语法),而不是优化代码细节(如语法性能或风格)。

因此,只需要在项目中执行以下命令即可满足常规验证:

npx oxlint@latest

在易用性方面,Oxlint 远胜于 Eslint

可读性诊断

当代码检查工具检测到问题时,它会向开发者提供相关信息。Eslint 提供的信息通常很简短,只告诉你错误的原因。例如,对于以下代码:

let a;

通过信息 "a is defined but never used",我们可以知道错误的原因是变量 a 被定义但未使用。

然而,如果是更复杂的规则,简短的信息可能无法直观地表达错误发生的位置和解决方法。许多时候,我们仍需查看规则文档,了解该规则的具体含义,然后结合错误代码进行分析。

相比之下,Oxlint 提供的信息更加直观和准确。例如,执行以下代码后,会得到一个倍增数的数组:

const numbers = [1, 2, 3, 4, 5];const result = numbers.reduce((accumulator, current) => {return [...accumulator, current * 2];
}, []);// [ 2, 4, 6, 8, 10 ]
console.log(result);

每次 reduce 回调执行时,数组都会扩展,当数组很长时,这会导致性能问题。

针对这个问题,Oxlint 的信息包括三部分:

  • 错误原因

  • 错误具体发生的位置

  • 解决方法

fa17f5311e202d676356fe9bddd88f25.png

通过查看代码中的哪个 reduce 操作(紫色字体)和哪个扩展操作(青色字体),我们可以识别问题。

虽然有些人可能会说,如果项目很大,阅读如此详细的 lint 信息是一种头疼的事。

但我们需要知道——你可以提供它,但我不一定要使用它,不使用它与不能提供它是完全不同的概念。

在诊断可读性方面,Oxlint 优于 Eslint。

参与成本

参与成本指的是开发者自定义规则的成本。Oxlint 是用 Rust 编写的,如果开发者需要用 Rust 来编写自定义规则,成本会很高。相比之下,Eslint 的规则是用 JS 编写的,成本要低得多。

Oxlint 尝试从两个方面解决这个问题:

不需要自己编写,官方已经编写了常用规则。

截至本文撰写时,官方已经实现了大约 200 多条规则。从规则的名称可以看出,这些规则是从各种常见库的最佳实践中提取出来的,例如:

  • jest: no-confusing-set-timeout

  • react: jsx-no-duplicate-props

  • eslint: default-case-last

  • typescript: no-unnecessary-type-constraint

实现专门为编写规则设计的 DSL。

Oxlint 正在研发一种专门用于编写规则的 DSL。至于这个 DSL 何时发布以及效果如何,目前尚不清楚。

从参与成本的角度来看,Eslint 完全胜出。

Oxlint 会取代 Eslint 吗?

根据已知情况,Oxlint 规则参与成本高于 Eslint。只要这个问题没有解决,Eslint 支持的一些规则 Oxlint 就无法支持。因此,短期内完全取代 Eslint 是不现实的。

然而,就像 Vite 相对于 Webpack,前者并未实现后者的所有功能。但只要满足 90% 开发者的常见需求,并提供更好的体验,就能吸引大多数 Webpack 用户。

Oxlint 也是如此——它建议开发者先运行 Oxlint,然后在 lint-stagedCI 设置中运行 ESLint。这样,大多数常见问题在到达 ESLint 之前就被 Oxlint 阻止了。

这种方法可以显著提高 lint 过程的速度,并且学习曲线很低。因此,它很可能在开发者中迅速流行。

当这种方法变得流行时,随着 Oxlint 规则覆盖范围的增加,它将逐渐替代 Eslint 最常见的 90% 需求。

到那时,会出现 Oxlint 为主,Eslint 为辅(处理少数特殊规则)的情况。

从这个角度来看,Oxlint 有很大的胜算。

尽管 Oxlint 前景光明,但它目前还有一些缺点,例如:

框架语法:Oxlint 原生支持 js(x)ts(x),但不支持 SvelteVue 模板语法。

vscode 插件仍不稳定,有 bug。例如,在下面的代码中,警告应该在第 1 行和第 3 行,但第 2 行也被标记了。

8ee08ff64fe0dd302868d5b13ff6d1ee.png

我相信,随着开发团队的持续投入和社区生态系统的形成,Oxlint 及其底层 Oxc 将拥有光明的未来。

最后:

vue2与vue3技巧合集

VueUse源码解读

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/852182.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

现货黄金投资价格怎么分析 低买高卖是核心!

我们做现货黄金投资,总是离不开对黄金价格的分析,分析其实就是一种理性的思考,我们对现货黄金当前走势进行一番思考,进而判断它未来的走向,以此作为自己投资入场的基础。那黄金投资价格怎么分析呢?下面我们…

Git 分支管理规范化[Git Flow ]分支管理策略

分支命名规范 master 分支&#xff1a;master 分支只有一个&#xff0c;名称即为 master。GitHub 现在叫 main develop 分支&#xff1a;develop 分支只有一个&#xff0c;名称即为 developfeature 分支&#xff1a;feature/<功能名>&#xff0c;例如&#xff1a;featu…

uniapp开发微信小程序预加载分包

微信小程序分包是一种优化小程序项目结构和性能的方式。它允许开发者将小程序代码包拆分成多个子包&#xff0c;在用户需要时动态加载这些子包&#xff0c;从而减少小程序的首次加载时间和主包的体积。&#xff08;总体积不得大于20M&#xff0c;主包&#xff08;共同文件静态资…

Matlab|基于主从博弈的智能小区代理商定价策略及电动汽车充电管理

目录 一、主要内容 二、部分代码 三、程序结果 四、下载链接 一、主要内容 主要做的是一个电动汽车充电管理和智能小区代理商动态定价的问题&#xff0c;将代理商和车主各自追求利益最大化建模为主从博弈&#xff0c;上层以代理商的充电电价作为优化变量&#xff0c;下层以…

从Android刷机包提取System和Framework

因为VIVO的手机很难解锁BL和Root&#xff0c;故直接从ADB中获取完整的Framework代码是比较困难的。我就考虑直接从VIVO提供的刷机包文件中获取相关的代码 由于vivo把system.new.dat分割了&#xff0c;所以下一步&#xff0c;我们使用cat命令&#xff0c;合并这些文件&#xff0…

Java I/O模型

引言 根据冯.诺依曼结构&#xff0c;计算机结构分为5个部分&#xff1a;运算器、控制器、存储器、输入设备、输出设备。 输入设备和输出设备都属于外部设备。网卡、硬盘这种既可以属于输入设备&#xff0c;也可以属于输出设备。 从计算机结构的视角来看&#xff0c;I/O描述了…

在 Kubernetes 上拉取 Harbor 私有仓库镜像并部署服务

上一篇讲解了IntelliJ IDEA和Jib Maven插件配合&#xff0c;镜像一键推送到Harbor私服仓库&#xff0c;今天来讲解下怎么让k8s直接拉取Harbor 私有仓库上面的镜像 创建 Kubernetes Secret 用于拉取镜像 因为 Harbor 仓库是私有的&#xff0c;我们需要创建一个 Kubernetes Sec…

JavaScript面向对象

一、编程思想 面向过程介绍 面向过程就是分析出解决问题所需要的步骤&#xff0c;然后用函数把这些一步一步实现&#xff0c;使用的时候再一个一个依次调用就可以了。 面向过程&#xff0c;就是按照我们分析好了的步骤&#xff0c;按照步骤解决问题。 面向对象编程&#xf…

使用Python实现管理员权限操作的WiFi的方法

在网络连接方面&#xff0c;无线局域网&#xff08;WLAN&#xff09;已成为我们日常生活中不可或缺的一部分&#xff1b;在某些情况下&#xff0c;我们可能需要管理员权限才能启用或禁用WLAN&#xff0c;但是通常会遇到权限不足的问题&#xff1b;为了解决这个问题&#xff0c;…

keil调试过程中遇到的问题及栈分析遇到的问题

文章目录 前言进行最坏运行时间分析及栈分析遇到的两个问题 一、问题1二、问题2总结 前言 进行最坏运行时间分析及栈分析遇到的两个问题 一、问题1 项目使用的时间片&#xff0c;在线调试过程中进行最坏运行时间通过打断点发现一个有个问题&#xff1a; 在一个时间片的开头和…

阻抗控制(Impedance Control)和导纳控制(Admittance Control)例子

阻抗控制(Impedance Control)和导纳控制(Admittance Control) 是两种用于机械臂或机器人交互控制的策略。阻抗控制定义的是机器人端部的力和位置之间的关系,而导纳控制则定义的是外力和运动之间的关系。导纳控制常用于处理机器人与环境交互中的力控制问题。 适用场景对比…

185.二叉树:二叉搜索树的最近公共祖先(力扣)

代码解决 /*** Definition for a binary tree node.* struct TreeNode {* int val;* TreeNode *left;* TreeNode *right;* TreeNode(int x) : val(x), left(NULL), right(NULL) {}* };*/class Solution { public:// 函数用于寻找二叉搜索树中节点 p 和 q 的最低…

flask基础4-flask数据库操作

目录 一.SQLALchemy 1.安装&#xff1a; 2.连接 二&#xff1a;创建OBM映射 SQLALchemy常用数据类型 三&#xff1a;数据的CRUD操作 1.构建session对象 2.添加对象 3.查找对象 4.修改对象 5.删除对象 四&#xff1a;ORM的关联关系 1.表的外键关联一对多 3.ORM中的一…

Honor of Kings 2024.06.13 (2)

【第一局】准确的说&#xff0c;其实对面优势更加明显&#xff0c;可惜黄忠和墨子喜欢杀人&#xff0c;而我又是不喜欢杀人的&#xff0c;打了好几次失误 【第二局】阵容本来很有优势&#xff0c;这个二呆射手跟第一局黄忠一样爱杀人&#xff0c;应该说三路的输出都爱杀人&…

编程器可以做什么游戏:探索游戏开发的无限可能

编程器可以做什么游戏&#xff1a;探索游戏开发的无限可能 编程器&#xff0c;作为游戏开发的核心工具&#xff0c;赋予了开发者创造独特游戏体验的能力。那么&#xff0c;编程器究竟可以做什么游戏呢&#xff1f;本文将从四个方面、五个方面、六个方面和七个方面&#xff0c;…

小主机折腾记26

双独立显卡调用问题 前两天将tesla p4从x99大板上拆了下来&#xff0c;将880G5twr上的rx480 4g安装到了x99大板上&#xff0c;预计是dg1输出&#xff0c;rx480做3d运算。安装完驱动后&#xff0c;还想着按照之前tesla p4的设置方法去设置rx480&#xff0c;结果果然&#xff0c…

Serverless 使用OOS将http文件转存到对象存储

目录 背景介绍 系统运维管理OOS 文件转存场景 前提条件 实践步骤 附录 示例模板 背景介绍 系统运维管理OOS 系统运维管理OOS&#xff08;CloudOps Orchestration Service&#xff09;提供了一个高度灵活和强大的解决方案&#xff0c;通过精巧地编排阿里云提供的OpenAPI…

AcWing 477:神经网络 ← 拓扑排序+链式前向星

【题目来源】https://www.acwing.com/problem/content/479/【题目描述】 人工神经网络&#xff08;Artificial Neural Network&#xff09;是一种新兴的具有自我学习能力的计算系统&#xff0c;在模式识别、函数逼近及贷款风险评估等诸多领域有广泛的应用。 对神经网络的研究…

Golang的json解析--Gjson库的使用举例

目录 简介 安装 原生的json解析 Gjson使用举例 基本使用 键路径 使用示例 其他资源 简介 在 Golang 中&#xff0c;解析 JSON 数据是一项非常常见的任务。Go提供了标准的JSON包&#xff0c;可以轻松地将JSON数据序列化和反序列化。但是&#xff0c;在使用标准JSON包…

Navigation的基本使用及其原理

Navigation的基本使用 1. 添加依赖 首先&#xff0c;在项目的build.gradle中添加Navigation组件库的依赖。 dependencies { implementation androidx.navigation:navigation-fragment:X.X.X implementation androidx.navigation:navigation-ui:X.X.X // 请替换X.X.X为当前最…