今年第三次參加 D2 大會了, 和前兩年體感有很大不同, 但收穫同樣不少.
- 開場: 前端 = 渲染引擎 + web 標準. 前端方向: 能力 + 體驗 + 生態.
- IoT: 兩個場景 + 擴充套件場景 + 自己的疑問
- 個人成長: 前端的 5 個大方向, 和 3 個關鍵點
- 貓超不一樣的視角: web 真的慢嗎?
開場
@圓心老師 開場講的兩句話, 記憶比較深刻
前端 = 渲染引擎 + Web 標準.
我對他的理解, 前端不需要分 iOS 和 Android, Web 等等, 更高層次去看的話, 都是渲染引擎 + web 標準. 其中渲染引擎, 雖然可能只有 native 和 web 之分, 但如果分執行時的話, 還包括 webkit, weex, react native 等, (我這麼說其實也並不是特別準確).
我覺得重點是後半句, web 標準 ! 這句話, 讓我想起之前看到的另外一句話[1]:
在移動時代沒有找到一個比HTML/CSS/JS更合適描述介面和表達業務的方式，當前智慧手機GUI體系只是對HTML拙劣的逼近和模仿。Weex/RN從某種意義上是必然的產物
所以, 結合在一起看的話, 前端做的所謂技術, 都是圍繞 渲染引擎 和 web 標準 來進行.
前端的核心有了, 那未來的方向和體系怎麼建設?
能力 + 體驗 + 生態
-
能力: 更多會是 web 能力的擴充套件, 比如: 前端的 Push, 離線, 桌面的觸達, 後臺程式, 攝像頭, 麥克風, U盤等等, 其中有一部分是 PWA 已經在做的事情 (包括 Service Worker, iOS 也正在支援), 其他的能力, 其實 Chrome 做得也是很不錯了, 畢竟有 Chrome OS 這樣的存在.
當然, 這其中還包括其他和前端有光的能力, 如: 圖形, 資料視覺化能力, IoT 能力, 管理能力等等
-
體驗, 我覺得可以分:
- 開發者體驗, 開發者的體驗其實有了很多的表現, 其實也體現在工程效率和開發效率上, 比如: VSCode 替代 Sublime, 還有最近出的 Parcel 打包工具, 也是在某種程度上解決了開發中對 webpack 某些痛點(當然, 打包效率的提升可能會更關鍵些), 還有很多的
out of box( 開箱即用) 的庫和模組也比以前更多了. - 使用者體驗, 這點可以不用過多展開, 為使用者考慮
流暢度(效能優化),便捷性(產品設計的合理性),美觀(設計視覺, 不要忘記 D2中的一個 D) 等等, 更多地站在使用者的角度想問題, 得到的也會更多.
- 開發者體驗, 開發者的體驗其實有了很多的表現, 其實也體現在工程效率和開發效率上, 比如: VSCode 替代 Sublime, 還有最近出的 Parcel 打包工具, 也是在某種程度上解決了開發中對 webpack 某些痛點(當然, 打包效率的提升可能會更關鍵些), 還有很多的
-
生態, 講的應該是開發生態, 包括開源, 社群的建設, 工具的共享, 共建等等, 特別是開源生態的建設, 也需要特別的智慧來推動開源的程式. 這個在
2016 年雲棲大會的雲棲社群開發者技術峰會——開源技術專場[2] 特別有感觸.
開場的乾貨特別多, 前端的層次和視角也特別高, 不過, 和 @小紅 同學一起在討論些問題, 也錯過了不少其他乾貨, 可以看看直播回放再體會體會哈.
IoT
The Internet of Thing. 物聯網, 這個有點讓我驚訝. 這次 D2 大會, 沒想到有一個專門的分會場講 IoT, 最早聽到 IoT 這個詞已經過去2, 3年了吧, 不知道能和前端有什麼碰撞.
雖然之前和物電的同學合作開發過養雞場的一個類物聯網系統, 也接觸到他們開發底層硬體的專業性 (電路自己畫, 電板找人待加工, 元件自己焊), 不過, 自己畢竟是以前端, 後臺, 上位機的角色參與進去的, 所以, 去了該會場尋找前端更多的可能.
來到該會場, 首先是各種微控制器: Arduino, Ruff, 樹莓派. 其中樹莓派之前聽到比較多, 不過, 這次在 D2, Ruff 提的比較多.
Ruff 是一個支援 JavaScript 開發應用的物聯網作業系統，為軟體開發者提供開放、高效、敏捷的物聯網應用開發平臺，讓 IoT 應用開發更簡單。
兩個應用場景
- 菜鳥的出入庫系統, 需要結合 攝像頭的人臉識別, 超聲波的距離識別, 當然也需要訂單號的掃描. 其中值得一提的是, 人臉識別是放雲端的, 比較類似 SaaS, FaaS.
- 智慧樓宇的控制, 比如: 週一週五的電燈控制, 一個空間達到多少 wifi 的接入, 自動開啟空凋進行控溫. 這裡難度比較大, 或工作量比較大的的各個裝置的不同協議的接入. 需要對接各種上個世紀的通訊協議, 或者廠商的私有協議, 還有包括 Wifi, Bluetooth, ZigBee 之類的通訊協議. (這是一個比較大的痛點, 不過, 這一點小米做的比較好, 在整個生態起來之後, 在做自己的協議標準, 也有開發平臺讓開發中對接: 小米 IoT 開發者平臺)
一個展開場景
聽 IoT 的講演後, 我有聯想到 Beacon 的使用場景, 早在 2013 年的 WWDC 會議上就有聽到類似的應用場景, 蘋果推出了 iBeacon 的概念.
Beacon 技術, 主要進行室內的精準定位, 和室外基於基站, Wifi, GPS 的定位有所不同, Beacon 技術依賴 Bluetooth 進行室內定位. 並依賴室內的精準定位, 在商城進行更有想象空間的營銷.
自己未解決的疑問
關於 IoT , 想象空間還是很大的, 但作為一個前端, 在可預見的未來, 發展道路會越來越窄的情況下6, 如何找到突破口? 如何更好地去做切入? 我們能做些什麼? 落地的場景有哪些? 所能帶來的價值? 以及比較重要的一點, 如何和傳統搞物理和電子的同學競爭? 物電的同學, 有物理, 電路, 電子方面的知識, 一般情況下, 使用 C, C++ 去程式設計? 我們前端能有什麼不一樣的優勢, 怎麼去尋求這其中的差異化發展呢?
個人成長
@岑安老師 分享.
前端方向5個大方向
| 企業中後臺 | 開發者服務 | 泛 NodeJS | 端技術 | 圖形 |
|---|---|---|---|---|
| 元件通, 協議通 標準化: DSL 協議, 資料介面 智慧化: 從設計到程式碼 |
1: 從端到雲一體化應用解決方案 2: OS 系統深度連結, 閉環生態 3: ISV 的開發和升級 |
一條基本線+一個突破點 基本線: Node 應用治理 突破口: IoT |
Weex + Webview weex: 效能, IoT 能力, 國際化 webview: 核心, 渲染引擎, 新標準 |
視覺化 + 互動能力 互動: 容器, 引擎, 框架, 平臺 視覺化: 智慧化, 資料聯動 |
接著上面我對 IoT 的疑問, 會後跟 @岑安老師 聊了聊他認為前端方向中泛 Nodejs 的突破口是 IoT的疑問, 簡單寫一下聽完老師後的感想和自己的理解:
- 首先, 我們得跳出當前前端的技術棧和業務的限制, 很顯然, 以目前前端的知識堆疊和能力, 沒有特別好的切入點來涉足 IoT 這個領域. 所以, 一個好的建議是, 做好該有的知識儲備, 以目前的狀態進入 IoT, 註定是被淘汰的那一批.
- 其次, 目前沒有一個好的技術方案來讓前端參與進來, 甚至是像
天貓精靈的無屏裝置, 前端的角色顯得更為尷尬, 所以, 簡單說, 一篇空白, 等待自己去探索出一條前端之路. - 如果非要和物電的同學進行正面競爭, 為什麼不差異化發展, 做連線的工作呢? 既然端上被他們牢牢掌握著, 我們將他們作為基礎服務, 將自己做為一個連線的角色, 整合端的能力? 做一個使用者的連線者? 有使用者的地方, 就應該有前端哈?
- 微控制器開發搞不過或搞不來, 我們能搞嵌入式系統嗎? 能用 Ruff 來做端嗎? 能用 Android 手機來做端嗎? 在做可行性方案的時候, 是不是有必要一定要搞微控制器和低成本硬體呢? 我能不能在 Android 手機上做一些 IoT 開發, 在批量生產時, 再讓物電的學生做電路設計和硬體成本的降低呢?
個人成長的3個關鍵詞
- 做: 有目標地做, 分階段地做, 做到極致
- 思考: 思考是核心, WHY 有時候比 HOW 更重要
- 發聲: 執行的總結和思考的傳達
自己對它的理解是, 做的時候, 更多需要去思考做背後的邏輯, 以及解決了什麼問題. 很多時候, 對技術選型或技術探索, 優化之類的, 需要和團隊的目標 或 老闆的想法結合在一起.
發聲, 最近有聽到很多類似的, 比如, 工作需要透明, 需要更多地和團隊成員分享, 還有包括技術分享等等. 說的多不如做的多, 所以, 這三點就不展開.
貓超不一樣的視角
@由校老師 貓超的 Web 實踐, 使用 U4 2.0 核心的將 Android 4.4 及以上的相容磨平, 並將 web 效能提升了不只一點點. 因為也剛好遇到了有同學問 web 和 weex 技術選型的問題, @由校老師 也做了很好的回答.
貓超在首次載入中, 對 Service Worker 做了優化, 通過 UC 核心, 可以將 Service Worker 本身 Push 到核心中,並提前載入資源進行首次優化. 在二次載入中, 通過 Service Worker 的 Cache 能力, 也能獲得不少的加速.
會後, 和 @由校老師 簡單聊了一下效能痛點: 長列表的記憶體回收, 或 cell 重用複用的問題等等. 在他看來長 list 的效能問題已經不是特別大的問題了, 相反, 他給我舉了一個 tabbar 滾動後無法保持狀態的痛點.
其他小細節
- 好多程式設計師背景的 PPT 在配色和字型大小上, 使用者體驗不是特別好, 比如: 藍底黑字, 大段字型很小的程式碼, 這點在轉正預講的時候自己也犯過類似的錯誤, 所以, 體感也比較強.
- 一個好的, 令人印象深刻的演講, 不是講一些共識, 而是講些不一樣的觀點. 即使是相同的觀點, 也需要有不同的角度或維度, 去解讀自己的不同觀點. 相同的觀點能包裝成不一樣的產品也不錯.