前端發展史
我把前端發展編爲五個階段，這個五個階段跟網絡上看到的階段分析不同。我認爲每個階段有一個理論或者方法論的支撐，帶來了一次飛躍。
第一階段
第一階段放在2003年。大家那個時候都知道，那個時候講求所有的HTML、CSS、JS是我們所謂結構樣式行爲的分離，這個理論造就了今天前端主體。
在這之前基本是兩種職位，一個是JAVA工程師，一個是設計。當時的設計是包含了視覺設計以及HTML+CSS。但是因爲這種結論理念的到來，讓前端開始真正變爲前端，專注於今天大部分前端所工作的內容。這個理念核心的出現，帶來了整個前端崗位的出現。其實伴隨着2003年之後，國內第一次出現真正的前端的崗位是2005年，這期間有一個延續性。之後很多公司出現了重構工程師，也是今天很多前端的主體。
第二階段
第二階段是2008年。當時有一個理念認爲90%的性能優化都在前端。在前臺體系裏面，這個理論讓前端價值得到進一步體現。
前端現在可以回答對公司的體現是什麼：我們可以通過性能的優化帶來更好的體驗、更高的轉化率等。突然發現前端整個崗位體現了很大的價值。我相信經歷了那個時代的人都記得YSlow，那個包括今天影響前端對於性能體系所有的思維，這是第二階段。
但是第二階段帶來了什麼？上面有寫，帶來了工程化的開啓。怎麼理解？今天要做很多性能優化，需要通過工具、流程把體系更好的工程化，然後得到一個最佳的結果。所以我認爲它是一個工程化的開啓。之後我們可以看到，最早用Ant前端工具，到今天有GRUNT、Webpack、Babel等。這樣來看，第二個階段是在2008年整個性能優化的過程，理念就是90%性能優化在前端。
第三階段
第三個階段是2013年。我今天分享跟大家原來理解的階段不一樣，大家有從框架階段來定義，也有從中間技術W3C什麼時候出現，或者從Node.js什麼時候出現來定義。出現並不是一個階段。其實發現Node.js早於2013年，可能是2008/2009年就出現了，但是爲什麼那個時候沒有出現變化？換到今天，我們更願意用另外一個詞就是前後端分層，在後端體系裏面讓前端更加專注前臺的UI層、邏輯層，後端關注後臺的接口，讓我們之間分工更加明確。後端如果開發一個頁面，跟前端說頁面有問題，但是前端一看是後端把標籤寫錯誤了，這就是合作方式不合理。
前後端的分層促進了對於前端體系的發展，也開始慢慢的影響到今天從前端到全棧的過程。讓很多人更有機會使用Node.js從工程的工具開發慢慢過渡到可以用JS做應用開發，這在2013年是很大的變化。當然這裏面有很多Node.js的框架，在上層的數據層，我們也會看到GraphQL整個邏輯編排的體系，所以會把這個體系帶到前端，今天大家所看到的BFF，也是基於這一套體系的發展。這是前端第三個發展階段，始於2013年。
第四階段
第四個階段我相信很多人都有感觸，因爲移動時代的來臨，改變了今天整個PC和無線的格局，也改變了我們前端大部分人開發的方式。
一開始理論是Mobile first，後面是Write Once，Run anywhere。這個時代是什麼？我們把PC工作轉到無線工作，這裏面很多人糾結，那個潮流來臨時候發現大量前端涌向了客戶端，客戶端出現了蓬勃發展。但是今天大量的客戶端又涌向了前端。兩者之間不停轉化。爲什麼？因爲大家都在思考到底是H5還是Native，未來到底是H5開發還是Native開發？
我認爲這個焦點就有錯誤。爲什麼糾結今天用H5還是Native解決問題？我覺得今天到了無線時代，焦點應該在這裏：怎麼樣用最標準化的開發能夠讓更多的人開發這個頁面、怎麼樣能夠提供像H5一樣標準的頁面。
回到這個焦點，在移動時代來臨的時候，在每個APP如何重新定義渲染引擎，這個渲染引擎是什麼樣的？大家可以看到，封裝是最早的，可以把H5封裝APP，以及RN，WEEX，以及今天的Flutter。整個主線和思維按照這個理念進行，而且時至今日這個理念依舊在影響我們前端開發。
第五階段
第五個階段是低代碼對於整個體系影響。
這裏有一個背景就是互聯網下的風口，所有的企業都看to B的體系，無論是阿里還是京東，to B的體系有一個什麼樣的東西？其實我們在前端的體系裏面把to B看成是中後臺，那裏面有什麼樣的特質？比如說佈局是高度標準化的，它的表單是高度標準化的，它的表格是高度標準化的，它的可視化圖表是高度標準化……這個體系存在大量的標準化，而不像C端多樣化，這個體系裏面，如何用低代碼或者無代碼的體系來完成對這個體系的重塑，這是在2016年重點看待的事情，也是2016年給我們帶來很多的變化。今天很多公司提供這樣的解決方案，比如說今天微軟的PowerApps，大家在這個領域在做新的探索。
小結
我們回顧可以看到：2003年結構樣式行爲分離，預示着前端崗位的出現。2008年90%性能優化在前端，開啓了工程化。2013年前後段分離，帶來了全棧的演進。2014年Mobile first是無線時代的來臨。2016年 LOW/NO Code出現，帶來了中後臺的重塑。
今天的機會
我們看今天是什麼？每一個今天重點投入的方向背後思考是什麼？我們今年阿里經濟體前端委員會四大技術方向：第一搭建服務，第二是Serverless，第三是智能化，第四是IDE。
搭建服務
首先看搭建服務。今天講到了低代碼和無代碼通過什麼方式完成？第一，肯定中間包含了大量的組件、元件、模塊。
在消費端體系裏面，我們也在做很多嘗試，比如說原來的頻道活動，在活動的體系裏面也是高度抽象化的，所以在這個體系裏面，我們可以看到整個搭建服務無論是在中後臺還是整個無線端，以及PC端都有大量場景，這樣大量場景需要把整個框架標準化，希望把裏面的元件、組件以及模塊標準化，還希望把這樣的服務能夠服務於今天所有無論是中後臺也好，C端頁面也好，希望有這樣的體系——服務化標準化的方式服務，打通整個體系，這就是爲什麼把搭建服務認爲是面向未來最重要的方向。
Serverless
今天很多人聽到了Serverless，很多人對於Serverless理解有所不同。我如何理解這個Serverless？我理解Serverless有兩個角色：
-
一個是內，內是站在公司角度Serverless對前端的影響。
-
一個是外，外可能是在雲上如何提供Serverless能力的提取。
回到公司的內，Serverless帶來什麼樣的影響呢？我覺得可以讓前端更加貼近業務，可以讓更多能力下沉。前端轉到Node體系有一個很大的挑戰，很多人說不是你會寫Node.js你就是前端工程師，我非常同意這樣說法。但是到了Serverless我們可以不用關注部署，不用關注運維，不需要關注所有的DevOps，也不需要關注底層數據庫的狀態，他會讓我們前後端整個的體系像前後端分層一樣又往前邁一步。
目前我的團隊裏面，不僅包括前端，還有200多個JAVA開發，大家共同推進所有的體系變革，希望團隊裏面所有業務邁向Serverless。Serverless需要把後端能力平臺化，把底層數據模型、領域模型和能力模型高度後臺化，對整個體系進行重塑。之後前端會有大量的業務邏輯開發，讓前端更加貼近業務，讓前端更加理解業務，我覺得Serverless未來會在整個前後端開發模式上帶來新的變革。
回到外部體系，它是什麼？五年前在D2我講了一個想法：在雲上更多通過Serverless方式提供函數式編程，讓開發者編程更加快捷。端就是今天小程序，今天可以看到，無論是騰訊、阿里，包括頭條、百度都在推自己的小程序，小程序就是未來端上的一個跨端的解決方案，而且有一定的收益、安全可控，雲上一定是以Serverless的方式和端之間做連接，可以讓這個體系運轉很好。
我今天看到一個數據說國內今天在雲上的Serverless，有60%到70%的程序都是通過Node.js在運行，所以Node在這當中有很大的空間。研發平臺是什麼樣？上層數據接入網關是什麼樣？還有編排是什麼？這是今天Serverless聚焦的領域並往下完成基礎設施的建設。當然像我講的，Serverless一定會帶來前端很大的變革。
智能化
去年在D2講過智能化，智能化一定是未來，爲什麼這樣講？因爲在AI來臨的時候，我們能否從一個Design變成一個Code？今天每個公司的前端都有大量的設計、大量原代碼，我們通過大量設計稿和原代碼進行機器學習，讓中間的佈局可學習，讓中間的元件可學習，我相信未來D2C一定能夠解決前端生產力瓶頸，讓前端從今天大量低端開發、手工工作中解放出來，將精力轉移到很多領域深度的參與、深度的突破。
所以我覺得，智能化一定會帶來前端未來格局的變化，因爲AI讓很多低效的工作通過這樣的方式完成。回到另外一個問題，無論是在無線化的時代，還是中後臺的時代，整個抽象程度是高度收斂的，不像原來做C端的PC是發散的。在收斂的情況下，一定是可以基於收斂的體系進行規模化，而這個規模化是我們希望通過AI的方式完成整體的改造。我相信一定會帶來前端另外一個變化。
IDE
大家會問，爲什麼IDE會變成你們的核心方向？我講一下思考。今天阿里的前端我們做了叫工程中臺，工程中臺做到了前端代碼從提交到發佈的管控，當然包括中間提交之後整個代碼的編譯、構建、檢測以及發佈。但是在前臺的部分，每個團隊都有一個工具，而這個工具在各團隊之間割裂的，無法複用。因爲工程不僅僅是提交到發佈，前端工程化應該從編碼開始到發佈，應該是一個完整的鏈路、完整的格局
回到這個體系裏面，如何能夠收斂前面整個的開發狀態，我覺得是可以通過IDE內核構建整個基礎。能夠把整個體系打通，同時所有團隊、所有能力，作爲組件的形式存在，組件可以讓更多人基於同樣一個架構進行高質量的交付，這樣才能形成一個完整的生態。
當然如果僅僅是面向內部，IDE還達不到作爲整個集團的四大方向之一。比如說還有很多ISV，很多小程序開發、互動的開發、一些工作的開發，我們也提供IDE給ISV的，但是那個體系是內部的精簡版。如果今天把整個IDE從內到外全部打通，就是基於一套完整的架構，然後基於上面的能力內外都可以互通，可以帶來整個生態的能力提升。
小結
今天講到了，在整個搭建體系，在整個低代碼、無代碼的體系，依託IDE提供很多的能力，我們是否可以把本地的IDE跟雲端IDE體系完全打通，通過一套架構完成所有的體系構建，通過組件的生態全部打通，形成完整的閉環，我覺得完全可以。
往外延伸，回到今天的雲體系，也需要提供一個IDE給今天更多人使用。你會發現，IDE是可以把內外、線上線下、所有的開發者生態全部打通，能夠讓集團所有的前端的能力服務於阿里所有的生態，這就是我認爲IDE會作爲我們核心戰略之一的原因，我們需要促進這個體系的完成。
新興領域
前面我們講了今天阿里的前端的四大技術方向，這四大方向思考我已經陳述了，希望給大家帶來一些思考。當然除了四大方向，我們依舊有很多沒有列在上面的部分。
上面說的三部分，對於未來我們依舊有很多的空間去探索。來看新交互，前端的強項是通過交互完成所有的工作，當所有新的技術來臨的時候，怎麼樣在新環境下完成所有工作？比如說今天VR時代來臨的時候，怎麼完成VR交互？整個領域跟現在的開發領域有什麼差異？是到它的體系重構前端引擎嗎？還是有很多東西是值得我們想象和思考的。
物聯網時代來臨，我們團隊有專門做IOT，他們是做很多新零售。我們要做什麼改變，也是前端要看待的事情。在那個體系裏面，可以用JS寫什麼樣的驅動？可以推動這個行業做什麼樣的發展？其實都給前端打開了一道門。
最後5G，中美搞得很緊張，都是因爲跟5G相關。但是，5G來臨帶來了什麼？思考這個問題。我們今天大量的在觀測性能的消耗、兼容性的問題，未來隨着整個網速的提升一定會移向雲端。如果今天在手機上做非常複雜的3D渲染，你會發現非常的卡頓。如果今天在手機上做非常複雜的遊戲、動畫也是很挑戰的。今天吃雞都是在PC端玩而不是手機上玩，因爲對於整個性能消耗、渲染整個體系有很強的要求。
5G來臨會變成什麼？所有渲染在雲端完成，通過流媒體交互的方式完成所有的體系，第一個解決了所有在觀測渲染性能問題。第二解決了大量兼容性問題。會變得更加簡單。
我們要正確看待一個技術變革的時候，會帶來什麼？什麼樣的變化？這是我們需要深入思考的部分，因爲這個一定會對未來形成一些變化，而我們的預判決定了我們今天如何看待未來，如何統治未來，我們應該做什麼。我相信新交互、IOT還有5G一定會對前端未來的發展形成另外的影響。
如何引領技術
爲什麼會有這個話題？這也是這兩年沉痛的思考。阿里前端有2000多人，這些人能力很強，但是在國內上高質量的前端都是上萬人，今天在前端的領域，我們對於前端領域的影響又是多少？其實是不成正比的。回到現在我們應該做什麼？我們應該思考什麼？我們應該如何促進整個國內前端的影響力以及高質量？我覺得不止是站在阿里團隊的角度思考，更應該站在國內前端的角度思考，我們能做什麼？
其實有一些東西大家覺得難嗎？其實我覺得好像也不難。說Flutter就是基於下沉的渲染，繪圖引擎做上層的多終端的方案。我記得剛剛進入無線時代做兼容性的解決方案，思路是一脈相承的，爲什麼我們做了一個東西沒有聲音沒有繼續探索。而另外一個方案應運而生了。
第一，我們不是沒有思考力。第二，回到今天時代，你們看完了可以立馬寫一個。但是，爲什麼是他寫的？看完他的理念可以立即寫出一個東西。在這裏再往下走，理念我們也有了，能力我們也有了，就是沒有出來東西，這是值得大家認真思考的問題。
從表象到本質
剛纔我講時代變化的時候，我的理論是，因爲它有一個理論支撐了一個時代變化。框架也一樣，框架一定會有基於某個問題解決他的問題。React.js解決了什麼？就是最開始很痛苦，然後就用別的方式重構。無論以前講的MVC、MVP還是MVVM。大家說以前這個東西我提過，但是最後變成公共標準不是我，而是別人。
當然首先回到一個理念，今天針對某一個東西要做什麼。首先要有理念，比如說今天我期望解決當下的多終端適配的問題，希望通過多途徑渲染完成體系的變化。回到的問題是今天如何解決問題？這個問題是什麼？我如何定義這個問題？我們要形成一個理念，才能往後走，往後走怎麼走？
理念到落地
通過雙引擎促使今天的變化。
今天的人才引入要做什麼？我們針對前面提出很多假設，以及對於未來暢想的思考以及針對今天問題的深度解決，針對這些體系要進行專業人才的引入。今天要做IDE就需要原來做過IDE專業人才。今天需要一些跨界，跨界是怎麼講？原來模塊加載，有幾年前端流行模塊加載，模塊的JS理念來源於哪裏？Python。就是從一個語言到另外一個語言，吸收長處，讓這個長處到我們的體系中解決問題，其實我們需要跨界人才帶來更多元化的思考，而不僅僅是我們自己的思考。多元化一定會帶來很多的思路，和今天很多學術一樣，一定會有相互之間交集所出現的學科。今天也是希望有更多不同跨界人才加入促使這個體系變化。
另外是研究型人才。今天我們如果要做可視化，很多公司在做可視化，但是可視化其實是一個學術的領域。在大學裏面是有課程的。但是回到體系，我們對它的思考是什麼，深度夠不夠？包括今天3D也一樣，在很多大學也是有課的，圖形渲染怎麼樣，該怎麼做，是有非常複雜的學術背景的。對於我們來講，這些人才我們有沒有？我覺得這是每個公司、每個團隊要思考的一個問題。
再往上就是通過雙引擎。我期望很多東西通過低代碼、無代碼完成大量低效工作後，剩下的精力放在應用的深度上。
第二學術人才加入，我們需要通過學術化探討加入更多新理論進來，通過這兩個雙引擎，能夠把我們前面提到的理念落到技術，這是整個國內目前很缺失的部分，也是我今天認爲最需要改變的部分。
影響力建設
兩個途徑：
-
第一個途徑是標準組織。跟前端相關的標準組織就三個，一個是TC39，第二W3C，第三是Node基金會。今天如何通過我們的思考，我們的能力影響今天的標準？我覺得前段時間有人跟我抱怨，說TC39方案不合理，我有更好的方案，可是他們就不聽我的。我們如何解決這些問題？這是我們要思考的問題。
-
第二個途徑是開源生態，我們如何通過開源生態完成所有東西。我們今天做的還不夠，有的公司團隊在開源方面做得還不錯。回到今天整個國內，我們如何具備社區化運營的基因，我覺得值得所有人思考的問題，包括我自己也在思考這方面的問題。
標準組織
我們首先要了解標準組織是怎麼樣的？有什麼樣的方向？制度是什麼樣的？我要參與什麼？不能參與什麼？要了解怎麼運轉，加上我們的思考判斷、對於未來趨勢的判斷，以及我們對於深度應用的判斷，然後推動整個標準組織的完善。
開源生態
開源生態簡單。怎麼挖掘、培育和運營來使我們的體系變成一個社區化的運營。
其實有時候不一定說做開源的社區，首先團隊能不能做到社區化的運作？我相信很多團隊是做不到的。團隊內的技術項目不是從上至下的，而是像社區一樣運作，這能夠促進整個生態的完善，這是可以推進的部分。
籌備中國前端聯盟
另外因爲Hax的痛苦，包括阿里的前端、360、Hax，我們看如何籌備中國前端聯盟，希望通過這個聯盟幫助未來中國前端的發展，我們往下落地的過程中還有一些細節在繼續推進。
這個組織要做的事情：
-
標準對接
-
開源共建
-
信息互通
通過協同協作形成世界性的影響，希望這個組織未來能夠成立，也是基於前面講的很多點的思考。今天具備思考，具備能力，但是今天沒有世界級的影響。這是很痛的一個點，中國前端要往前發展，一定形成世界級的影響，世界級的影響一定靠所有人聯合在一起。
前端價值
前面我講的很多東西你做到了，但是很多人回到公司都要回答一個問題：前端對於公司的價值是什麼？前端對於公司價值一定不是專業的建設，但是專業建設是必不可少的，但同時作爲組織裏面的崗位要回答，我這個崗位對於公司的價值是什麼？所以我說，前面都做到了不等於價值。技術能力也不等於整個企業價值。這裏面應該做什麼樣的思考？
傳統三件套
傳統三件套也是今天很多團隊在做的：如何提升前端效率，讓資源變得更加的高效？如何做性能優化、體驗優化？很多團隊都在做性能優化。另外如何保障產品的質量等等。這是作爲一個開發崗位最基本應該做到的。
Gap在哪裏
比如說今天運營策略是什麼？引領模式是什麼？產品邏輯是什麼？業務閉環是什麼？轉化漏洞是什麼？市場佔比是什麼？它要求的一定不是一個前端的能力，它要求的是另外三個能力：商業化的思考能力、數據化的能力，以及產品化的能力。
如何思考商業的閉環？站在產品角度產品邏輯應該是什麼？產品應該怎麼做？怎麼樣通過了解今天的數據看待很多問題，推動體系的變化？這是我們前端都需要增強的。當你具備了這三個能力的時候，我相信你在公司的價值一定會得到體現。
總結
今天的我們還只是在啓程的路上，未來的世界還在變化，比如說Serverless都在變化，未來的路怎樣還未可知。最後把一句話送給所有人：路漫漫其修遠兮，吾將上下而求索。
嘉賓介紹
鄭葉飛（花名：圓心），阿里巴巴集團前端委員會主席，也是D2前端技術論壇發起人。2007年加入淘寶，曾參與天貓、快樂淘寶、聚划算等創業團隊。現負責淘寶終端技術團隊與淘寶基礎鏈路團隊，推進了淘寶前端工程化、無線化、全棧化、智能化的快速演進。且一直熱身於推進國內前端技術的交流與發展。
