一個新視角:前端框架們都卷錯方向了?

大家好,我是卡頌。

近年來,前端領域涌現了許多新框架,如Svelte、Solid.JS、Astro、Qwik等。伴隨這些框架的出現,還出現了許多高端的新概念,如「運行時/編譯時框架」、「Islands架構」、「Selective Hydration」等。這些概念的核心目標是「通過各種方式,讓頁面加載和響應更快」。

這里的「快」主要體現在兩個方面:

  1. html加載更快(與SSR相關的概念,如「Islands架構」);
  2. 更快響應用戶交互(采用「細粒度更新」的框架,如vue、Solid.js)。

然而,「快」是否是評判Web未來發展方向的唯一標準呢?

一位擁有32年開發經驗的老程序員在他的博文《get-in-zoomer-we-re-saving-react》中提出了不同的觀點。本文是對該博文的部分解讀。

立即學習前端免費學習筆記(深入)”;

對于應用來說,什么才是重要的?當前前端框架的新特性主要關注「通過各種方式,讓頁面更快」。這里的主語是「頁面」而不是「應用」。事實上,雖然開發者經常談論web app,但大部分開發者開發的,只能稱為頁面。

頁面與應用的一大差別在于「交互體驗的差異」。如果一個頁面的某些交互類似于ios原生應用,我們會說這個頁面的交互體驗非常出色。因此,雖然「速度快」是交互體驗的重要一環,但絕不是全部,還有許多細節值得考慮。

以業界用戶體驗的標桿Mac OS為例:

在Mac OS中,打開應用的狀態欄時,按住「command + option」等快捷鍵可以開啟進階功能:

一個新視角:前端框架們都卷錯方向了?按住command + option前

一個新視角:前端框架們都卷錯方向了?按住command + option后

撤回(command + z)操作的結果對各種操作目標都是符合預期的(不管目標是文本還是文件等)。富文本內容的復制、粘貼與通過拖拽的表現一致。這些「符合預期」的細節背后,是一套「響應式系統」。

Mac OS X是第一款聲稱自己為「響應式」的操作系統。在此之前,業界的效仿對象windows操作系統。在Windows中,數據是「非響應式」的。除非開發者手動刷新或輪詢更新,否則獲取的數據不會自動更新。這種底層模式對上層應用的操作會有直觀的影響。

例如,下面是Windows 95中改變桌面外觀的配置項,用戶改變配置后,只有在點擊「OK」或「Apply」后,才能看到「改變配置后的效果」。

一個新視角:前端框架們都卷錯方向了?這一情況類似于前端框架普及前,開發者手動操作dom的情況。

相比之下,Mac OS X采用響應式更新,用戶在Mac OS中改變許多配置項后能夠立刻看到效果。這類似于開發者使用前端框架后,「狀態變化」能夠自動觸發「視圖更新」。

操作系統的演進對前端框架的發展具有借鑒意義。正如上面所說,Mac OS X的發展方向是「為了更好的用戶體驗,打磨各種細節」,而前端框架的發展方向是「更快」。

前端框架走歪了嗎?「React 并發特性」應該是今年前端領域比較熱門的話題。然而,從社區關于「并發特性」的文章來看,相比于「使用并發特性并從中獲益」,更多文章是關于「并發特性的科普,以及解釋其造成的影響」。從這個角度看,「并發特性」似乎叫好不叫座。

如果從更廣的范圍考慮「用戶體驗」,React是否可以有其他發展方向呢?例如,當前連續事件(Continuous Events,指連續觸發的事件,如鼠標事件、滾動事件)觸發的頻率和速度通常比React重新渲染的速度要快,容易造成不好的用戶體驗。通常的解決方案是使用ref,換句話說,就是降級到手動操作DOM。這里是否有很大的優化空間呢?

除了React外,其他框架是否也可以從這個角度考慮發展方向呢?

你認為前端框架的發展方向走歪了嗎?

參考資料[1]

get-in-zoomer-we-re-saving-react: https://www.php.cn/link/67236033be4f58d696d0d4ada931c543

? 版權聲明
THE END
喜歡就支持一下吧
點贊6 分享