偷偷摘套内射激情视频,久久精品99国产国产精,中文字幕无线乱码人妻,中文在线中文a,性爽19p

JavaScript 生態(tài)圈和技術(shù)趨勢(shì),這一年發(fā)生了這些變化 ...

開(kāi)發(fā)
JS 生態(tài)圈最權(quán)威的調(diào)查報(bào)告 state-of-js 終于是出來(lái)了 。

今天,我來(lái)帶大家看看 2021  state-of-js 的調(diào)查結(jié)果:

速覽

下面是我挑出來(lái)的幾個(gè)比較重點(diǎn)的,我們先來(lái)速覽一下:

  • 可選鏈操作符使用率已經(jīng)高達(dá) 85% 
  • 空值合并操作符( ?? )使用率提升了 21% 。
  • 將近 50% 的受訪者在使用 Shadow DOM API 
  • esbuild 是滿意度調(diào)查中同比增長(zhǎng)最大的工具。
  • Vite 97%26%
  • 當(dāng)前有 5.6% 的受訪者正在使用 Deno 。
  • 一些老牌 JS 庫(kù) Axios、Lodash  Moment 仍然是最受歡迎的。
  • TypeScript JavaScript Elm

JS特性 - 語(yǔ)言

Proxy

Proxy 在各種框架和庫(kù)中使用的越來(lái)越多了(特別是 Vue.js 3.0 開(kāi)始使用后),所以了解到它的同學(xué)也越來(lái)越多,但是實(shí)際使用率沒(méi)有太大變化。

Promise.allSettled()

Promise.allSettled() 我還沒(méi)用過(guò),用法類似于 Promise.all ,區(qū)別是:它所有給定的 promise 不管是 fulfilled 還是 rejected 狀態(tài),只要全部返回后它就會(huì)返回。在你不關(guān)心所有的異步任務(wù)是不是都必須成功的時(shí)候可能會(huì)用到它。

Dynamic Import

動(dòng)態(tài)導(dǎo)入:只有 15% 的人還不知道它,接近 50% 的小伙伴都用過(guò)了,一般會(huì)在懶加載的時(shí)候用到。

Nullish Coalescing

空值合并運(yùn)算符:這玩意這么多人都在用嗎?用過(guò)的小伙伴可以在評(píng)論區(qū)說(shuō)一下,我平時(shí)用的比較多的還是 || 或者 && 。

空值合并操作符( ?? ),會(huì)在左側(cè)的操作數(shù)為 null 或者 undefined 時(shí),返回其右側(cè)操作數(shù),否則返回左側(cè)操作數(shù)。

 || 的區(qū)別是, || 會(huì)在左側(cè)是 0 的時(shí)候也返回右側(cè),而 ?? 會(huì)返回 0 。

const baz = 0 ?? 42;
console.log(baz); // 0

const conard = 0 || 42;
console.log(conard); // 42

Optional Chaining

可選鏈:使用率已經(jīng)高達(dá) 85% ,非常實(shí)用的特性,不多說(shuō)了。

Private Fields

私有屬性:只有 20% 的人用過(guò),我們?cè)陬惱锩娑x的屬性或方法默認(rèn)情況下都是公有的,可以通過(guò)在前面加個(gè) # 來(lái)變成私有的(僅在類內(nèi)部可以訪問(wèn))。

class ClassWithPrivateField {
#privateField;
}

class ClassWithPrivateMethod {
#privateMethod() {
return 'hello ConardLi';
}
}

BigInt

BigInt 可以解決 Number 的精度丟失問(wèn)題,一般大于 2^53 的數(shù)我們建議用 BigInt 來(lái)表示,不過(guò)現(xiàn)在使用率還很低,大家通常還是用一些庫(kù)去處理數(shù)字。

String.prototype.replaceAll()

replaceAll :可以讓我們按照一個(gè)正則進(jìn)行更靈活的字符串替換,第一年參加調(diào)查, Chrome85 才開(kāi)始支持的函數(shù),已經(jīng)有這么多人用過(guò)了,真的是一個(gè)非常實(shí)用的函數(shù):

const regex = /ConardLi/ig;
console.log(p.replaceAll(regex, '棒!'));

JS特性 - 瀏覽器 API

Service Workers

Service Worker :一個(gè)服務(wù)器與瀏覽器之間的中間人角色,它可以攔截當(dāng)前網(wǎng)站所有的請(qǐng)求,我們可以在這中間做很多靈活的判斷和處理,只有 8% 的人不知道它了,使用率已經(jīng)高達(dá) 45% 。

Intl

Intl 瀏覽器給我們提供的一個(gè)原生的用來(lái)做國(guó)際化的 API ,國(guó)際化的需求一般比較復(fù)雜,反正我們國(guó)際化都是用庫(kù),省心很多,這個(gè)還沒(méi)用過(guò)。

Web Audio API

控制 Web 音頻的 API ,只有特定領(lǐng)域的開(kāi)發(fā)者才會(huì)用到,變化也不大。

WebGL

Web 圖形化的需求越來(lái)越復(fù)雜多樣, WebGL 的普及也不可避免。現(xiàn)在大多數(shù)人都有過(guò)了解,但是使用者還局限在特定領(lǐng)域,今年的增長(zhǎng)率已經(jīng)有了小的變化,相信未來(lái)會(huì)迎來(lái)一個(gè)爆發(fā)增長(zhǎng)~

Web Animations API

dom 上的 animate 函數(shù),就屬于 Web Animations API 中的一個(gè),我們?nèi)粘J褂?CSS 實(shí)現(xiàn)的一些動(dòng)畫,都可以借助它轉(zhuǎn)換成 JS 實(shí)現(xiàn):

document.getElementById("CoonardLi").animate(
[
{ transform: 'rotate(0) translate3D(-50%, -50%, 0)', color: '#000' },
{ color: '#431236', offset: 0.3 },
], {
duration: 3000,
iterations: Infinity
}
);

這個(gè)應(yīng)該大家都有了解過(guò)吧,一般 XXX 網(wǎng)頁(yè)動(dòng)畫實(shí)戰(zhàn) 這樣的課程和文章都會(huì)提到,但是實(shí)際開(kāi)發(fā)中實(shí)現(xiàn)動(dòng)畫還是用 CSS 或者一些 JS 庫(kù)比較多一點(diǎn)。

WebRTC

WebRTC ( Web Real-Time Communications ) 是一項(xiàng)實(shí)時(shí)通訊技術(shù),可以在網(wǎng)絡(luò)應(yīng)用或者站點(diǎn),在不借助中間媒介的情況下,建立瀏覽器之間點(diǎn)對(duì)點(diǎn)的連接,實(shí)現(xiàn)視頻流和(或)音頻流或者其他任意數(shù)據(jù)的傳輸。

同樣,也是特定領(lǐng)域(如直播)會(huì)用到的 API ,使用者很局限。

Web Speech API

用于處于 Web 音頻的 API ,也是特定需求場(chǎng)景才會(huì)用到的 API,使用率很低,變化也不大。

Websocket

這個(gè)調(diào)查里使用率最高的 Web API 了,不用多說(shuō),只有 4% 不知道它是啥東西了 ...

Shadow DOM

Shadow DOM  Web Components 里面的一個(gè)重要 API:瀏覽器將模板、樣式表、屬性、 JavaScript 碼等,封裝成一個(gè)獨(dú)立的 DOM 元素。外部的設(shè)置無(wú)法影響到其內(nèi)部,而內(nèi)部的設(shè)置也不會(huì)影響到外部,與瀏覽器處理原生網(wǎng)頁(yè)元素(比如 <video> 元素)的方式很像。

Shadow DOM 最大的好處有兩個(gè),一是可以向用戶隱藏細(xì)節(jié),直接提供組件,二是可以封裝內(nèi)部樣式表,不會(huì)影響到外部。

// attachShadow() creates a shadow root.
let shadow = div.attachShadow({ mode: 'open' });
let inner = document.createElement('b');
inner.appendChild(document.createTextNode('Conard Li Hiding in the shadows'));

// shadow root supports the normal appendChild method.
shadow.appendChild(inner);
div.querySelector('b'); // empty

這個(gè)使用率已經(jīng)這么高了嗎?大家在開(kāi)發(fā)里有用到過(guò)嗎?

Page Visibility API

頁(yè)面可見(jiàn)性 API,可以幫助我們檢測(cè)當(dāng)前用戶是不是還在當(dāng)前頁(yè)面,當(dāng)網(wǎng)頁(yè)被最小化或者切換到其他 tab 的時(shí)候,會(huì)觸發(fā)一個(gè) visibilitychange 事件,我們就可以在這個(gè)時(shí)候去停掉一些耗時(shí)的操作來(lái)節(jié)省資源。

document.addEventListener(visibilityChange, handleVisibilityChange, false);

function handleVisibilityChange() {
if (document.hidden) {
// 頁(yè)面隱藏了
} else {
// 頁(yè)面又活躍了
}
}

一個(gè)挺好用的 API ,兼容性也不錯(cuò),大家可以用起來(lái)~

JS特性 - 其他技術(shù)

PWA

PWA 使用率今年漲幅挺大的,也是屬于一個(gè)比較成熟的技術(shù)了。

WebAssembly

WebAssembly  88% 的人都有了解過(guò),但是使用率只有 15% ,相比去年只增加了 5% ,它給 Web 開(kāi)發(fā)帶來(lái)了更多的可能性,相信未來(lái)會(huì)得到爆發(fā)式增長(zhǎng)。

JS 庫(kù)

滿意度

這張圖挺有意思的,按照 S、A、B、C 四個(gè)等級(jí)的滿意度,對(duì)比了前端框架、服務(wù)端框架、測(cè)試庫(kù)、構(gòu)建工具、移動(dòng)和桌面端技術(shù)、Monorepo 工具,下面我們來(lái)逐個(gè)部分看一下。

時(shí)間變化

紫色代表人氣下降,藍(lán)色代表人氣上升,向上代表用的人越來(lái)越多,向右代表有更多的人想學(xué)習(xí)它。

怎么看起來(lái)大家今年都不太想學(xué)東西了呢?哈哈,另外對(duì)一些新型的庫(kù)比如 Sevelte 學(xué)習(xí)欲望還是有增長(zhǎng)的。

前端框架

使用率

使用率今年整體都沒(méi)有太大變化, React 依然以 80% 的使用率 高居榜首,因?yàn)檎{(diào)查的老外比較多,所以 Angular  Vue.js 使用率還要高,不過(guò)前者已經(jīng)是下降趨勢(shì)了。另外 Svelte 的使用率在今年有了 5% 的增長(zhǎng)。

滿意率

Solid.js 是一匹黑馬,今年以 90% 的滿意率高居榜首,不過(guò)它的使用率只有 3% ,滿意度自然也就高一點(diǎn)。

React 的滿意度已經(jīng)連續(xù)三年下降,來(lái)到了第三位,不過(guò)在使用率這么高的情況下仍然有 84% 的滿意度,依然堅(jiān)挺!

Ember.js 應(yīng)該是崩了,使用率和滿意率都連續(xù)下降... 沒(méi)救了。

后端框架

使用率

幾乎沒(méi)變化 ... Express 依然占據(jù)霸主地位,今年新出來(lái)的框架不少,像 Remix 僅有 5% 的使用率。

不過(guò),有點(diǎn)震驚, Koa 去哪了?難倒只有中國(guó)人用嗎???

滿意率

新出來(lái)的框架更能滿足大家的痛點(diǎn),所以滿意度普遍較高, SvelteKit  96% 的滿意度高居榜首。

測(cè)試框架

Jest 仍然是最常用的測(cè)試框架, Testing Library 的使用率增長(zhǎng)不多,但是滿意度高達(dá) 96% 。

移動(dòng)端和客戶端

使用率

今年 Elctron 來(lái)到了使用率的第一位,不過(guò)仍然只有 36% 的人用過(guò)它,RN 是第二位,二者應(yīng)該就分別是桌面端和移動(dòng)端最常用的技術(shù)了。

滿意率

值得注意的是,今年新出的 Tauri 占據(jù)了榜首,不過(guò)它只有 3% 的使用率。

Tauri 是一個(gè) Electron 的替代技術(shù),主要用來(lái)解決 Electron 包體積和內(nèi)存消耗過(guò)大的問(wèn)題。

構(gòu)建工具

使用率

webpack 仍然是使用率最高的框架, tsc 依托于 TypeScript 的大火來(lái)到了第二位,并且還有 17% 的增長(zhǎng)。另外表現(xiàn)最為亮眼的還是 Vite ,第一年推出就有了 30% 的使用率。

滿意率

滿意度上今年出現(xiàn)了非常大的分歧, Snowpack 的滿意度下降了 24% ,相比 swc 的滿意度提升了 14% 。而 Vite 以恐怖的 98% 的滿意度來(lái)到第一位!。 Gulp 應(yīng)該是沒(méi)救了,使用率和滿意度都在持續(xù)降低。

Monorepo 工具

使用率

滿意度

Monorepo 今年第一次參加調(diào)查,表示這種開(kāi)發(fā)方式越來(lái)越普及了。但是使用率最高的 Lerna 依然只有 25% 、被吹上天的 pnpm 也只有 13% 的使用率。

其他

工具庫(kù)

jQuery 已經(jīng)跌到 11% 了嗎? Axios 為啥使用率還這么高,大家不用 Fetch 嗎?

JS 運(yùn)行時(shí)

Node.js  Browser 還高? Deno 擁有了 5.6 的使用率 ...

可以編譯成 JS 的語(yǔ)言

TypeScript 占據(jù)絕對(duì)霸主地位。

評(píng)估指標(biāo)

在評(píng)估是否使用一個(gè)庫(kù)時(shí),考慮最多的因素是什么?

文檔 > 開(kāi)發(fā)體驗(yàn) > 用戶體驗(yàn) > 用戶規(guī)模 > 社區(qū) > 開(kāi)發(fā)者和團(tuán)隊(duì)

對(duì) JS 的看法

JS 生態(tài)是不是變化的太快了

口口聲聲的喊,學(xué)不動(dòng)了的人都去哪了?為什么同意這個(gè)觀點(diǎn)的人越來(lái)越少了呢?

JS 的主要痛點(diǎn)

依賴管理 > 代碼架構(gòu) > 狀態(tài)管理 > 調(diào)試 > 日期管理 > 編寫模塊 > 查找包 > 異步

頒獎(jiǎng)

  • 空值合并運(yùn)算符 ( ?? ) 使用率增長(zhǎng)了 21% 。
  • esbuild 只有兩歲,使用率提升了 20% 
  • Vite 成為最受關(guān)注和滿意度最高的技術(shù)。

調(diào)查范圍


最后還得吐槽一下,和 state-of-css 一樣, state-of-js 的中國(guó)參與者仍然很少 ...

責(zé)任編輯:張燕妮 來(lái)源: code秘密花園
相關(guān)推薦

2018-12-24 09:47:06

2022-12-08 00:09:20

CSS生態(tài)圈技術(shù)趨勢(shì)

2023-01-11 08:06:42

2023-04-04 13:31:18

2016-01-05 11:56:34

2016-11-01 14:30:09

大數(shù)據(jù)大數(shù)據(jù)技術(shù)

2016-07-14 15:57:06

華為

2016-01-07 13:19:21

大數(shù)據(jù)分析生態(tài)圈

2023-12-05 08:31:47

2011-06-29 15:48:29

Java

2012-06-15 10:03:57

2021-03-23 11:00:41

網(wǎng)絡(luò)安全網(wǎng)絡(luò)攻擊網(wǎng)絡(luò)釣魚

2013-01-04 10:58:21

JavaScriptWebJS

2015-04-09 11:25:06

云智慧APICloud應(yīng)用性能管理

2018-07-16 14:36:24

編程學(xué)習(xí)代碼

2021-01-14 11:39:05

云計(jì)算

2019-11-28 08:23:14

容器Kubernetes編排

2015-03-04 11:19:59

2015-10-08 09:33:48

2020-12-31 14:34:16

比特幣數(shù)據(jù)以太坊
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)