Laurie Voss

未來5年 「web開發(fā)」 會如何發(fā)展，在說出自己的預(yù)測前， 「Laurie」 先表示： 「在座各位，很可能討厭我的預(yù)測」 。

因?yàn)樗约壕筒淮娺@個預(yù)測結(jié)果。

那么他預(yù)測的依據(jù)是什么呢？簡單來說就是：

太陽底下無新鮮事

作為一個有26年 web 開發(fā)經(jīng)驗(yàn)的數(shù)據(jù)分析師， 「Laurie」 總結(jié)了技術(shù)發(fā)展的模型。

簡單來說，一項(xiàng)技術(shù)的生命周期會經(jīng)歷一個輪回：

提出解決思路

最初，人們在項(xiàng)目開發(fā)時遇到一個問題，有部分人開始嘗試解決這個問題。

一旦某個人提出一個讓人覺得 「這個思路很棒」 的解決方案，當(dāng)遇到類似問題時大家就會嘗試用自己的理解將這個解決方案落地。

比如，當(dāng) Dan? 提出 Redux 模型時，社區(qū)還沒有更好的狀態(tài)管理解決方案，于是這個方案被廣泛接受，涌現(xiàn)出很多 「基于Redux模型的狀態(tài)管理方案」 。

這是個不斷重復(fù)造輪子的過程（也是很多KPI項(xiàng)目的源頭）。

找出最佳實(shí)踐

隨著這套解決方案不斷實(shí)踐，會逐漸產(chǎn)生 「最佳實(shí)踐」 。

當(dāng) 「最佳實(shí)踐」 產(chǎn)生后，開發(fā)者通常會覺得無聊，因?yàn)樵谶@個方向沒有什么可探索（可造輪子）的了。

這時候，某個無聊的程序員會想：我可以制造一個 「大而全」 的框架/系統(tǒng)/產(chǎn)品，一勞永逸的解決這類問題。

也就是說，將最佳實(shí)踐 「商品化」 。

最佳實(shí)踐的商品化

「商品化」 過程通常是很激烈的，會有很多團(tuán)隊(duì)/公司/個人參與其中，提出自己的產(chǎn)品，并抨擊競爭對手在某些方面的不足。

比如，各種前端框架，可以認(rèn)為是前端工程師這類消費(fèi)者消費(fèi)的商品。

消費(fèi)者有自己的偏好，可能有人喜歡 Vue? ，有人喜歡 React 。但作為商品，最終會產(chǎn)生一個事實(shí)上的贏家。

這是一個不變的經(jīng)濟(jì)規(guī)律 —— 要達(dá)到某個目的，可能有很多產(chǎn)品可供選擇，但一旦其中某款產(chǎn)品被更多人選擇：

作為老板，可以更容易招到「會用這款產(chǎn)品的程序員」

作為程序員，可以更好利用這個產(chǎn)品的社區(qū)生態(tài)

這又會反過來使得該產(chǎn)品被更多人選擇，最終馬太效應(yīng)（強(qiáng)者愈強(qiáng)）產(chǎn)生。

比如，與 Wordpress 同時期出現(xiàn)的，還有很多博客建站產(chǎn)品。

但到2022年的今天，全世界43%的網(wǎng)站是 Wordpress 驅(qū)動的。第二名與他的差距恐怕都不是一個數(shù)量級的。

抱怨基礎(chǔ)欠缺

當(dāng)某一產(chǎn)品成為主流后，就會聽見一種聲音：不要光會用產(chǎn)品/系統(tǒng)/框架，你還得理解背后的原理。

當(dāng) 「Laurie」 剛當(dāng)開發(fā)時，主流的標(biāo)記語言是SGML (Standard Generalized Markup Language，標(biāo)準(zhǔn)通用置標(biāo)語言)

HTML? 僅僅是 SGML 的一個微小子集，特點(diǎn)是規(guī)范比較松散，但比較易學(xué)。

如果你在當(dāng)時使用 HTML? ，資深工程師會告誡你：不要光會用 HTML? ，還得理解背后的 SGML ，要不然是做不長久的。

大規(guī)模應(yīng)用

當(dāng)某個產(chǎn)品成為絕對主流，被大規(guī)模應(yīng)用，以至于成為事實(shí)上的 「基礎(chǔ)設(shè)施」 后，下一代技術(shù)人很可能不會再接觸上一代人所謂的 「原理知識」 。

比如現(xiàn)在， HTML? 已經(jīng)成為前端基礎(chǔ)設(shè)施了，誰還記得 SGML 呢？

另一個例子，現(xiàn)在的老前端，很多都用過 jQuery 。

在前端框架興起之前，大家都用 jQuery? 操作 DOM? 。面試時也會考察 jQuery 源碼。

畢竟，大家都認(rèn)可 —— 原生 JS 才是基礎(chǔ)。

jQuery? 中的選擇器太好用，以至于主流瀏覽器都將他內(nèi)置了，這就是 querySelector 的選擇器語法。

最終， querySelector? 成為選擇 DOM 時事實(shí)上的標(biāo)準(zhǔn)。誰會在意背后的原理呢？

回到原點(diǎn)

最后，在基于新的 「基礎(chǔ)設(shè)施」 的開發(fā)中又會遇到新的問題。于是，一切又回到了起點(diǎn)。

比如，最初開發(fā)者使用 JSP? 、 PHP 開發(fā)前端頁面。

后來有了 CSR 。

再后來為了解決 CSR? 的各種問題，有了 SSR 。

但從實(shí)現(xiàn)原理來說， JSP? 、 PHP? 不就是 SSR 么。

Laurie的預(yù)言

最后，基于上述輪回模型， 「Laurie」 提出了對 「web開發(fā)」 的預(yù)言。

在21年的一次調(diào)查中顯示，有68%的開發(fā)者使用 React 開發(fā)頁面。

「Laurie」 表示：在他的職業(yè)生涯中，能達(dá)到 jQuery? 那么大的使用規(guī)模， React 是唯一一個。

沒準(zhǔn)兒未來 React? 會被作為基礎(chǔ)設(shè)施在瀏覽器中直接實(shí)現(xiàn)（就像 jQuery 的選擇器一樣）。

但不是以 「直接集成React本身」 的方式，可能是將當(dāng)前還不太好用的 Web Components? 重新設(shè)計(jì)為類似 React Component 的形式。

在當(dāng)前，有很多新的框架基于 React? 實(shí)現(xiàn)，比如 Astro? 、 Remix? 、 Next.js? 、 Solid.js 。

這些框架的開發(fā)者假設(shè)自己的用戶已經(jīng)會用 React? 、喜歡用 React? （否則也不會用他這款框架），這從側(cè)面反映了 React 已經(jīng)被作為前端基礎(chǔ)設(shè)施。

如果接受了這個設(shè)定（ React 會作為前端基礎(chǔ)設(shè)施），那么我們就回到了輪回模型的起點(diǎn)。

有什么事情是當(dāng)前開發(fā)者用 React 反反復(fù)復(fù)實(shí)現(xiàn)，又覺得很無聊的事呢？

一個答案是：寫組件。

所以， 「Laurie」 認(rèn)為：未來5年，基于 「React組件」 的可視化編輯器會成為主流。

類似React Bricks這款產(chǎn)品：

屆時，一部分開發(fā)者負(fù)責(zé)實(shí)現(xiàn)各種功能的 React組件? ，這類組件被稱為 Bricks （磚塊）。

而大部分開發(fā)者則基于磚塊，用可視化編輯器拖拽實(shí)現(xiàn)不同頁面。

這類開發(fā)者甚至不會接觸到 HTML ，在他們的基礎(chǔ)設(shè)施中，最小的單位是磚塊（React組件）。

事實(shí)上，早期的瀏覽器（由 「Sir Tim」 開發(fā)的 WWW ）就是用拖拽、輸入等方式實(shí)現(xiàn)的富文本編輯器。

呵，太陽底下無新鮮事。

總結(jié)

如果你看到這個預(yù)測后覺得挺討厭的 —— 就這？

就像文章開篇就提到的， 「Laurie」 自己也討厭這個預(yù)測。

但歷史一次次證明，曾經(jīng)被討厭的設(shè)計(jì)，最終很可能變成主流（比如2013年時，前端們對待 JSX 的態(tài)度）。

26年前的開發(fā)者會認(rèn)為只會 HTML? ，不會 SGML 是不靠譜的。

10年前的開發(fā)者會認(rèn)為只會 jQuery? ，不會原生 JS 是不靠譜的。

現(xiàn)在的開發(fā)者會認(rèn)為只會前端框架，不懂實(shí)現(xiàn)原理是不靠譜的。

那有沒有一點(diǎn)可能，5年后的開發(fā)者會認(rèn)為只會拖拽生成頁面，不懂開發(fā)組件是不靠譜的？