论作为前端为何我们应当优先考虑标准

1,161 阅读4分钟

本文正在参加「金石计划」

动机

朋友在群里提问:

1. querystringify - https://www.npmjs.com/package/querystringify
2. query-string - https://www.npmjs.com/package/query-string
3. qs - https://www.npmjs.com/package/qs
这三个库你们都用哪个啊?

此时让我非常惊讶的是,为何候选项中不包含浏览器端的 URLSearchParams 或 node 端的 node:querystring

于是我进行询问:

你将在哪个宿主环境下用?
我认为浏览器端应优先使用 URLSearchParams。
node 端应优先优先使用 node:querystring。
同构的情况我暂时不太清楚。

他的回答:

将用于同构情况下。

于是我去翻阅了 Next.js 框架中的做法,它选择采用浏览器端标准,即 URLSearchParams。为了代码同构,在 node 端会引入 whatwg-url,以实现与浏览器端功能一致的 URLSearchParams

这种做法的好处在于,在浏览器普遍支持 URLSearchParams 的前提下,保证用于浏览器端的代码体积最小,性能最高。

我在群中叙述了上面的观点,他回答道:

我不在乎产出的大小。
而且 URLSearchParams 的 API 设计我不喜欢,它不够丰富。

于是有了本文,论述我为何认为应当优先考虑标准,而在什么情况下,才应当选择一个三方库。

注意:文章的论述不可避免地充斥着大量主观评判,实际上这个问题的本身也没有一个标准答案,欢迎你来提出你的思考和见解。

软件中随处可见的灵活性

软件固有的复杂性有四个原因:

  1. 问题域的复杂性。
  2. 管理开发过程的困难性。
  3. 软件中随处可见的灵活性。
  4. 刻画离散系统行为的问题。

本文涉及到的问题就有关于『软件中随处可见的灵活性』。

软件提供了非常大的灵活性,所以开发者几乎有可能表达任何形式的抽象。但是,这种灵活性变成了一种难以置信的、诱人的属性,因为它也迫使开发者打造几乎所有的初级构建模块,高层的抽象将建立在这些初级构建模块之上。建筑行业对原材料的品质有着统一的编码和标准,但软件行业却很少有这种标准。结果,软件行业还是一种劳动密集型的产业。

这就是我为何如此推崇拥抱标准的原因,因为这无疑是初步解决该问题最好的方式,而非我是一个偏执的 Vanilla JavaScript 信仰者。

什么时候才应当选择一个三方库

在我一再坚持使用标准的情况下,朋友的回答如此:

URLSearchParams 不够好用。
和引入 react 和 vue 的目的一样。
jquery 中也没有任何函数,是用浏览器自己的 api 做不了。

这里涉及到的真的是一个复杂的问题,关于我们什么时候才应当使用一个三方库。而对于一个这么大的问题,我无从回答,所以这里的讨论仅限制在对 URLSearchParams 标准和 query-stringqs 这些库的选择上,我将从折中的角度来论述我的看法。

对于软件中随处可见的灵活性的折中

首先,我们面对的是对于软件中随处可见的灵活性的折中,如上面所说的那样。query-stringqs 这些库都是优秀的库,维护者都是知名的开发者,都拥有极高的 star 数量。所以当你摒弃了现有标准,那么对于这些库的选择将是完全主观的,将完全凭借个人的喜好。

所以当由于历史原因,让你不得不摒弃标准,而选择一个库时。例如想在历史项目中统一一个功能库时,那么最好的解决方法就是发起一次投票,让多数人服从少数人。

URLSearchParams 的 API 是否好用,这是一个主观判断问题。对比 query-stringqs 和提供的 API 时你就能发现,URLSearchParams 的 API 是面向对象的,而这两个三方库偏向于函数式的。

对于性能方面的折中

其次,是对于性能方面的折中。如 Next.js 的做法能够保证用于浏览器端的代码体积最小,性能最高。

对于最后两句话的反驳

最后,是对于最后两句话的反驳。URLSearchParams 标准与 query-stringqs 这些库的选择并不同于 DOM APIreactvuejquery 这些库的选择。

URLSearchParams 标准与 query-stringqs 这些库解决的问题是一致的,URL 中查询参数的解析和字符串化,可以从 MDN 和库的 README 中得知。

DOM APIreactvuejquery 解决的问题并不相同。reactvue 是为开发者提供新的抽象层次去解决构建应用的复杂性,而非仅为了操作 DOM。jquery 确实提供了更加便利的 API 来操作 DOM,但别忘记了它的卖点是为了可跨多种浏览器工作!这一切也都是能在它们的文档中看到的!

最后

在面对一个一般性问题时,要优先考虑标准!