五月,Google 推出了Flutter 1.5,引發了技術圈里對“全平臺”技術的熱議和思考,Flutter的召喚|趨勢背后的思考。

文末留言,大部分同學在“學和不學”間爭論不休,難道什么技術火,我們就要學什么嗎?

沒有人能給出你絕對的答案,“學與不學”本身來講就是個偽命題,大部分都在于你自己的態度和實際業務環境的需求來決策的。

但在技術圈里,也不乏敢于“嘗鮮”技術人,這群人往往能夠掌握多種技能,并能很快能將這些新技術運用到自己產品和業務當中去,實現商業化。我們將這群人稱之為“全棧工程師”。

本篇文章,我們暫且不再探討要不要全棧,而是想通過研究Web技術的演進路徑,來窺探未來的開發者的職業路徑是怎樣的? 由此帶給大家更多的啟示和參考。

Web技術的演變之路

靜態頁面時代(1990-1991)

HTML技術,主要是文本和圖片(包括gif動態圖片)。

特點:簡單,只能做信息的展示,無法同用戶進行交互。

1990年,萬維網之父蒂姆·伯納斯-李(Tim Berners-Lee)在NeXT電腦上發明了第一個Web瀏覽器。

1991年8月6日,Tim在alt.hypertext新聞組貼出了一份關于World Wide Web的簡單摘要,這標志了Web頁面在Internet上的首次登場。

最早的Web主要被一幫科學家們用來共享和傳遞信息,全世界的Web服務器也就幾十臺。由于僅是用來傳遞信息,從可視化方式或從傳遞數量上看,僅比電報強一點點。

當時還沒有JavaScript,用的是純靜態的頁面。

enter image description here

(早期的靜態網頁)

最早的動態網站(1993)

主要采用CGI/Perl腳本技術,能夠實現內容動態,具備了交互性,服務器能夠訪問文件系統或數據庫。

缺點:伸縮性差(為每個請求分配一個新的進程)、安全性差(直接使用系統環境變量和文件系統)、腳本組織混亂并且缺少一種結構化的構造動態應用程序的方式。

enter image description here

1994年,Rasmus Lerdorf創建了PHP。

事實上,這個時候的 PHP 只是用 Perl 語言編寫的一系列 CGI 腳本,用于跟蹤他在線簡歷的訪問情況,統計他自己網站的訪問者。在早期, PHP 并不是一門語言,只是一些工具,提供基本的變量,并使用嵌入式HTML句法自動處理表單變量。

(PHP發展史:https://wenku.baidu.com/view/024d9205a1c7aa00b52acbf8.html)

JavaScript誕生于1995年。起初它的主要目的是處理以前由服務器端負責的一些表單驗證。

如果能在客戶端完成一些基本的驗證,在當時來講絕對是令人興奮的,于是,就職于網景的布蘭登·艾奇開始著手計劃將LiveScript同時在瀏覽器和服務器中使用。此時,布蘭登·艾奇為了搭上媒體熱炒Java的順風車,臨時把LiveScript改名為JavaScript,所以從本質上來說JavaScript和Java沒什么關系。

1996年,ASP 1.0誕生,簡化了Web開發。

由于Web程序開發十分復雜,以至于要制作一個簡單的動態頁面也需要編寫大量的C代碼才能完成。

于是,Microsoft公司于1996年推出一種Web應用開發技術ASP,用于取代對Web服務器進行可編程擴展的CGI標準。

原來要寫C語言,太難了,有了ASP只需要寫寫VBScript腳本或者JavaScript腳本即可,而且還有內部組件實現了cookie等高級功能,ADO(ActiveX Data Object)簡化了數據庫的相關操作。

1998年,JSP技術誕生,建立的一種動態技術標準。

JSP也稱為動態頁面,其實就是,在HTML頁面里,嵌入java代碼,通過這樣,達到頁面動態改變的功能。JSP在處理的時候,先通過web server的JSP引擎,轉換為servlet,執行servlet,然后將結果合成一個HTML頁面,返回給客戶端。

瀏覽器端的魔術:AJAX (2005-2007)

局部更新,響應更快,真正用Web應用取代了Web頁面。

enter image description here

Ajax 技術誕生,改變了一切,同時也促成了 Web 2.0 的誕生。

  • 2004年:Gmail

  • 2005年:Google 地圖

前端不再是后端的模板,可以獨立得到各種數據。

谷歌火了,Ajax也成為火爆的前端技術,我們在使用gmail,google map等產品時,有了另一種體驗,點擊鏈接或按鈕后,即便網絡不算流暢,頁面不再全白重新刷新,而是內容漸漸的出現。其原理就是利用Js腳本到后臺服務器獲取數據,在瀏覽器前端對數據進行解析和渲染,在這個過程中,大多數頁面并不需要進行改變,只是更新頁面中一部分即可。谷歌公司大力支持Firefox使其重生,并和蘋果一起發展webkit項目,各自發展了chrome和safari瀏覽器,伴隨者頁面渲染能力大力提升同時,Js腳本的解析能力也突飛猛進。

Ruby on Rails:通過約定的規范方式開發Web應用(2007)

第一次將廣泛應用于桌面應用的開發模式——MVC,搬到了Web應用開發領域。

在隨后的幾年時間里,AJAX成為了焦點,但在服務器端仍然使用著舊有的技術。

大概在2007年,37signals公司公開其成員–Ruby on Rails。

那個基于Ruby on Rails 5分鐘構建博客的演示完全征服了全世界的開發者。

Rails的不同之處在于使用規定的方式去設計你的web應用程序,運用一種已經廣泛在桌面應用開發,但未被搬到web應用上的開發模式。這種模式就叫做模式(數據)-視圖(模板)-控制器(業務邏輯)。Rails強調,“這事就該這么做”,并且通過許多插件讓構建web應用再一次更加健全。

客戶端開發技術的崛起(2007-2016)

在2007到2010年期間,涌現了3種開發潮流:

第一,智能手機和移動應用潮流。通常情況下,許多應用程序同時有web和移動應用兩種版本。盡管如此,服務端仍然返回的是HTML頁面,而不是其它移動應用可以識別。因此,你需要返回的是結構化數據來取代HTML。

第二,開發潮流是jQuery。這是一個非常流行的JavaScript庫,能夠很容易構建動態、美妙的web應用,甚至是AJAX!

第三,潮流是Node.JS的發布。這是第一次能讓你用JavaScript開發高性能的服務端程序,進而可能結束“客戶端開發者”要知道HTML/JavaScript,“服務端開發者”要知道.NET/C#/Ruby這樣的噩夢。

客戶端開發技術的規范化—從后端到前端(2009-至今)

客戶端框架如Backbone、Ember、Derby、Meteor、AngularJS等等,簡化了客戶端的開發,并且也逐步形成了MVC的模式。這種模式下,前后端分工變得愈加清晰。

伴隨著信息時代、大數據時代的到來,jQuery 在大量的數據操作中的弊端體現出來了,它在對 DOM 進行大量的操作中,會導致頁面的加載緩慢等問題。

  • 2009 年AngularJS 誕生、Node誕生。
  • 2011 年React 誕生。
  • 2014 年Vue.js 誕生。

Node算是前端的第二次飛躍,它使 JS 在服務端語言中也有了一席之地。

如今,后端負責數據,前端負責其余工作越發明顯化。它們之間的通訊,只需要后端暴露 RESTful 接口,前端通過 Ajax,以 HTTP 協議與后端通信即可:

enter image description here

前端從 2014 年到 2017 年是混戰期,得益于 Node.js 的輔助加成,外加各種前端優秀的創意和實踐,使得React/Vue/Angular 三足鼎立,加快了標準統一的步伐,無論 React 發布 v16,增加 Fiber 和Hooks,還是 Vue 3.0 發布,其實最終都是朝著W3C WebComponents 標準走。

小程序是最近兩年比較火的技術,與PWA比較類似,應用輕量化將逐漸步入穩定期和成熟期。

趨勢背后的思考

由于前端的特殊性,開發者總是要與時俱進熟悉了解最新的前沿技術,如果基礎好的話,更容易、更快和更穩的去利用和掌握知識點,甚至能直接改裝熱門技術框架,直接為己用。未來的話,前端工作也會隨著技術的發展而繼續分化和融合,全棧也可能是你未來的一個職業走向。

拓展閱讀:enter link description here

enter image description here