原文地址: ovenzeze.coding.me/2018/summar…
Github：github.com/ovenzeze
轉載請註明出處

題外話

Google開發者大會2018在9-20到9-21在上海如期舉辦，作為為數不多在大陸舉辦開發者大會的國際一線網際網路公司，大會的內容和質量還是很令人期待的。當初抱著試一試的心態，在微信公眾號上填寫了申請表，沒想到能夠收到邀請函。畢竟作為工作不到兩個月的小菜鳥，其實是沒有抱太大期待能夠稽核通過的。既然有這個機會，自然希望能去看一看的。於是收到邀請函當天，就和老大申請了調休，訂了機票定下了行程。

其實大會的議程很早就在官網公佈出來了，簡單瀏覽了一下，其實大會的重點還是AI，涉及到前端生態的內容並不如想象中的多，而且和目前的技術積累和主攻方向還是有比較大的差別。但是作為開發者的信仰公司之一舉辦的大會，前去感受下頂級網際網路公司的技術氛圍和研究方向也是值得的。

主要內容

PS:樓主不太喜歡拍PPT，所有沒有太多現場的演講照片，所以大家湊合看下。

今年的大會主要議程還是圍繞新技術、商業化、工具幾個場景展開，其中涉及到前端生態主要是Flutter、AMP、PWA、Lighthouse和Puppeteer，其他還有一些偏知識型的技術分享。大會的議程可以在官網檢視到，也可以在各大視訊網站或直播平臺檢視回看。

其中，Flutter主要介紹了即將釋出的Flutter Release Preview 2的新特性、部分設計思想、最佳實踐以及在合作企業中的一些應用。AMP和PWA部分，有三場演講。主要是找了一些合作伙伴來聊了一下AMP或PWA在商業上帶來的促進和變化以及遷移到AMP帶來的挑戰。而在開發者工具部分，主要介紹了Lighthouse和Puppeteer，這兩部分主要是技術實踐和推廣。下面從這個三個方面，記錄下大會的主要內容和自己的感悟，希望可以給沒能來現場的同學一些參考。

(跨平臺)Flutter

Flutter部分主要介紹了下Flutter的工作方式、設計思想和一些最佳實踐，以及在國內公司的實際應用。作為Google最新推出的跨平臺開發工具，Flutter作為Google站在巨人的肩膀上設計開發的工具，在設計層面就解決了很多之前RN難以規避的問題，比如List渲染的效能問題，主要還是Google自己開發了一套GDI，拋棄了RN採用的層層編譯的方式，在程式執行時既不需要webview也不需要作業系統的底層控制元件，通過自己的基於Skia的GDI來繪製UI。這也是Flutter在設計和工作方式上和RN、Weex等跨平臺工具上最大的不同。Flutter理論上可以在支援的裝置上實現120FPS，而RN只承諾到60FPS。

不過目前Flutter還處於Beta階段，社群生態還不夠完善，有很多東西還需要繼續完善。但是作為開發者，很多人已經躍躍欲試了，截止到2018-9-26，在Github上Flutter最新的Stars已經達到了38232個，還處在飛速增長中，作為還在Beta版本的工具是很難得的，作為對比目前已經發布3年多的RN的Stars數是約70000個。可以看到社群也是非常活躍的，基本處於每天更新的程度。Issue的解決速度也非常快。

作為開發者，如果團隊有比較強大的開發實力，並且目前在跨平臺開發方面遇到難以解決的效能瓶頸，可以嘗試現在就開始使用Flutter。而對於廣大普通開發者，可以試試自己做一些業務APP來試水，待工具和社群生態更成熟以後再切入也不晚。

在大會上也介紹了目前國內是應用Flutter到生產環境最多的地區，比如騰訊的NOW直播、阿里的閒魚等團隊都在Flutter上面有積極的嘗試和豐富的實踐。

(效能與速度)AMP&PWA

AMP&PWA其實已經不算新了，這次Google主要是推廣介紹，還邀請了一些合作伙伴分享了向AMP改進的一些心得和收益。技術上主要的分享就是淘寶的國外版本，AliExpress(速賣通)，還有央視國際視通、京東，歐萊雅和米蘭網在AMP在商業實踐上的一些經驗。

AMP其實通過一套特有的規則來優化網頁的載入和執行，但是需要使用AMP專有的標籤和元件，在個性化定製方面肯定是要有所犧牲的。但是換來了速度上的提升和SEO上的優待，目前已經有超過15億個AMP網頁。

目前市場上主流的瀏覽器都對PWA有了完整的支援，但是在國內的話總體感覺應用還不是太廣泛。大會會也提到了，目前PWA主要還是應用在網路連線速率緩慢和裝置效能低下的地區和國家，國內的公司對PWA的熱情似乎不太高。

(開發者工具)Lighthouse&Puppeteer

在輔助開發工具的創造上，Google一直是走在業界最前列的。從Chrome自帶的開發者工具開始，Google創造的開發者工具就一直是WEB開發人員必備的工具。這次額外介紹了Chrome的無頭瀏覽器Puppeteer和網頁效能評測工具Lighthouse。

作為Google官方的無頭瀏覽器，Puppeteer幾乎可以模擬任何你在Chrome中可以進行的操作。模擬前進、後退、重新整理，模擬使用者點選和滑動，自動化表單提交、鍵盤輸入，網頁截圖、匯出PDF，爬取SSR網站內容等等。可以說比爬蟲工具更完善了。而且，Chrome官方團隊維護的工具，在功能上肯定是儘量像Chrome靠齊，可以說是開發者的福音了。

而最新的Lighthouse3.0，則可以更全面的測試和評估你的網頁效能，還能像ESLint一樣給出程式碼中存在的問題，提供最佳實踐，並可以生成報告匯出，整合到持續部署工具中，觀察每一次釋出對網頁效能帶來的影響，讓開發者全方位的掌控網頁的執行狀況。

在最新的Chrome中，你可以在Audits下找到Lighthouse，當然你也可以通過命令列工具使用，通過命令列工具你可以方便的將Lighthouse整合到持續整合系統中。

其他

整體來說，大會的質量還是很高的。也很有Google特色，穿插了大量的現場Coding環節，讓開發者感覺很親切。作為科技公司裡對技術最有追求的幾家公司之一，在前端方面的積澱確實很深厚。無論是新技術、新標準還是新的輔助開發工具，Google都是走在整個業界的最前列，期待國內公司也能夠有這樣的追求，並朝著這個方向去努力吧。不然真的很難吸引到真正優秀的人才，在長期的競爭中必然會處於下風。從使用工具到改進反哺工具，再到創造工具，還有很長的路要走。

作為一個小菜鳥，也會繼續努力，嚴格要求自己，希望有朝一日也能像Google工程師那樣的來介紹自己設計創造的工具。