阿里巴巴前端 D2 會議筆記

原文鏈接

今年第三次參加 D2 大會了, 和前兩年體感有很大不同, 但收獲同樣不少.

  • 開場: 前端 = 渲染引擎 + web 標(biāo)準(zhǔn). 前端方向: 能力 + 體驗 + 生態(tài).
  • IoT: 兩個場景 + 擴(kuò)展場景 + 自己的疑問
  • 個人成長: 前端的 5 個大方向, 和 3 個關(guān)鍵點
  • 貓超不一樣的視角: web 真的慢嗎?

開場

@圓心老師 開場講的兩句話, 記憶比較深刻

前端 = 渲染引擎 + Web 標(biāo)準(zhǔn).

我對他的理解, 前端不需要分 iOS 和 Android, Web 等等, 更高層次去看的話, 都是渲染引擎 + web 標(biāo)準(zhǔn). 其中渲染引擎, 雖然可能只有 native 和 web 之分, 但如果分運(yùn)行時的話, 還包括 webkit, weex, react native 等, (我這么說其實也并不是特別準(zhǔn)確).

我覺得重點是后半句, web 標(biāo)準(zhǔn) ! 這句話, 讓我想起之前看到的另外一句話[1]:

在移動時代沒有找到一個比HTML/CSS/JS更合適描述界面和表達(dá)業(yè)務(wù)的方式,當(dāng)前智能手機(jī)GUI體系只是對HTML拙劣的逼近和模仿。Weex/RN從某種意義上是必然的產(chǎn)物

所以, 結(jié)合在一起看的話, 前端做的所謂技術(shù), 都是圍繞 渲染引擎 和 web 標(biāo)準(zhǔn) 來進(jìn)行.

前端的核心有了, 那未來的方向和體系怎么建設(shè)?

能力 + 體驗 + 生態(tài)

  • 能力: 更多會是 web 能力的擴(kuò)展, 比如: 前端的 Push, 離線, 桌面的觸達(dá), 后臺進(jìn)程, 攝像頭, 麥克風(fēng), U盤等等, 其中有一部分是 PWA 已經(jīng)在做的事情 (包括 Service Worker, iOS 也正在支持), 其他的能力, 其實 Chrome 做得也是很不錯了, 畢竟有 Chrome OS 這樣的存在.

    <img width="50" alt="dingtalk20171217121607" src="https://user-images.githubusercontent.com/7157346/34076502-3a6ac89c-e324-11e7-98cb-8f8526a5485a.png">

    當(dāng)然, 這其中還包括其他和前端有光的能力, 如: 圖形, 數(shù)據(jù)可視化能力, IoT 能力, 管理能力等等

  • 體驗, 我覺得可以分:

    • 開發(fā)者體驗, 開發(fā)者的體驗其實有了很多的表現(xiàn), 其實也體現(xiàn)在工程效率和開發(fā)效率上, 比如: VSCode 替代 Sublime, 還有最近出的 Parcel 打包工具, 也是在某種程度上解決了開發(fā)中對 webpack 某些痛點(當(dāng)然, 打包效率的提升可能會更關(guān)鍵些), 還有很多的 out of box( 開箱即用) 的模塊 也比以前更多了.
    • 用戶體驗, 這點可以不用過多展開, 為用戶考慮流暢度(性能優(yōu)化), 便捷性(產(chǎn)品設(shè)計的合理性), 美觀(設(shè)計視覺, 不要忘記 D2中的一個 D) 等等, 更多地站在用戶的角度想問題, 得到的也會更多.
  • 生態(tài), 講的應(yīng)該是開發(fā)生態(tài), 包括開源, 社區(qū)的建設(shè), 工具的共享, 共建等等, 特別是開源生態(tài)的建設(shè), 也需要特別的智慧來推動開源的進(jìn)程. 這個在2016 年云棲大會的云棲社區(qū)開發(fā)者技術(shù)峰會——開源技術(shù)專場[2] 特別有感觸.

開場的干貨特別多, 前端的層次和視角也特別高, 不過, 和 @小紅 同學(xué)一起在討論些問題, 也錯過了不少其他干貨, 可以看看直播回放再體會體會哈.

IoT

The Internet of Thing. 物聯(lián)網(wǎng), 這個有點讓我驚訝. 這次 D2 大會, 沒想到有一個專門的分會場講 IoT, 最早聽到 IoT 這個詞已經(jīng)過去2, 3年了吧, 不知道能和前端有什么碰撞.

雖然之前和物電的同學(xué)合作開發(fā)過養(yǎng)雞場的一個類物聯(lián)網(wǎng)系統(tǒng), 也接觸到他們開發(fā)底層硬件的專業(yè)性 (電路自己畫, 電板找人待加工, 元件自己焊), 不過, 自己畢竟是以前端, 后臺, 上位機(jī)的角色參與進(jìn)去的, 所以, 去了該會場尋找前端更多的可能.

來到該會場, 首先是各種單片機(jī): Arduino, Ruff, 樹莓派. 其中樹莓派之前聽到比較多, 不過, 這次在 D2, Ruff 提的比較多.

Ruff 是一個支持 JavaScript 開發(fā)應(yīng)用的物聯(lián)網(wǎng)操作系統(tǒng),為軟件開發(fā)者提供開放、高效、敏捷的物聯(lián)網(wǎng)應(yīng)用開發(fā)平臺,讓 IoT 應(yīng)用開發(fā)更簡單。

兩個應(yīng)用場景

  • 菜鳥的出入庫系統(tǒng), 需要結(jié)合 攝像頭的人臉識別, 超聲波的距離識別, 當(dāng)然也需要訂單號的掃描. 其中值得一提的是, 人臉識別是放云端的, 比較類似 SaaS, FaaS.
  • 智能樓宇的控制, 比如: 周一周五的電燈控制, 一個空間達(dá)到多少 wifi 的接入, 自動開啟空凋進(jìn)行控溫. 這里難度比較大, 或工作量比較大的的各個設(shè)備的不同協(xié)議的接入. 需要對接各種上個世紀(jì)的通訊協(xié)議, 或者廠商的私有協(xié)議, 還有包括 Wifi, Bluetooth, ZigBee 之類的通訊協(xié)議. (這是一個比較大的痛點, 不過, 這一點小米做的比較好, 在整個生態(tài)起來之后, 在做自己的協(xié)議標(biāo)準(zhǔn), 也有開發(fā)平臺讓開發(fā)中對接: 小米 IoT 開發(fā)者平臺)

一個展開場景

聽 IoT 的講演后, 我有聯(lián)想到 Beacon 的使用場景, 早在 2013 年的 WWDC 會議上就有聽到類似的應(yīng)用場景, 蘋果推出了 iBeacon 的概念.

Beacon 技術(shù), 主要進(jìn)行室內(nèi)的精準(zhǔn)定位, 和室外基于基站, Wifi, GPS 的定位有所不同, Beacon 技術(shù)依賴 Bluetooth 進(jìn)行室內(nèi)定位. 并依賴室內(nèi)的精準(zhǔn)定位, 在商城進(jìn)行更有想象空間的營銷.

自己未解決的疑問

關(guān)于 IoT , 想象空間還是很大的, 但作為一個前端, 在可預(yù)見的未來, 發(fā)展道路會越來越窄的情況下6, 如何找到突破口? 如何更好地去做切入? 我們能做些什么? 落地的場景有哪些? 所能帶來的價值? 以及比較重要的一點, 如何和傳統(tǒng)搞物理和電子的同學(xué)競爭? 物電的同學(xué), 有物理, 電路, 電子方面的知識, 一般情況下, 使用 C, C++ 去編程? 我們前端能有什么不一樣的優(yōu)勢, 怎么去尋求這其中的差異化發(fā)展呢?

個人成長

@岑安老師 分享.

前端方向5個大方向

企業(yè)中后臺 開發(fā)者服務(wù) 泛 NodeJS 端技術(shù) 圖形
組件通, 協(xié)議通<br />標(biāo)準(zhǔn)化: DSL 協(xié)議, 數(shù)據(jù)接口<br />智能化: 從設(shè)計到代碼 1: 從端到云一體化應(yīng)用解決方案<br />2: OS 系統(tǒng)深度鏈接, 閉環(huán)生態(tài)<br />3: ISV 的開發(fā)和升級 一條基本線+一個突破點<br />基本線: Node 應(yīng)用治理<br />突破口: IoT Weex + Webview<br /><br />weex: 性能, IoT 能力, 國際化<br /> webview: 內(nèi)核, 渲染引擎, 新標(biāo)準(zhǔn) 可視化 + 互動能力<br /> 互動: 容器, 引擎, 框架, 平臺<br /> 可視化: 智能化, 數(shù)據(jù)聯(lián)動

接著上面我對 IoT 的疑問, 會后跟 @岑安老師 聊了聊他認(rèn)為前端方向中泛 Nodejs 的突破口是 IoT的疑問, 簡單寫一下聽完老師后的感想和自己的理解:

  1. 首先, 我們得跳出當(dāng)前前端的技術(shù)棧和業(yè)務(wù)的限制, 很顯然, 以目前前端的知識堆棧和能力, 沒有特別好的切入點來涉足 IoT 這個領(lǐng)域. 所以, 一個好的建議是, 做好該有的知識儲備, 以目前的狀態(tài)進(jìn)入 IoT, 注定是被淘汰的那一批.
  2. 其次, 目前沒有一個好的技術(shù)方案來讓前端參與進(jìn)來, 甚至是像天貓精靈的無屏設(shè)備, 前端的角色顯得更為尷尬, 所以, 簡單說, 一篇空白, 等待自己去探索出一條前端之路.
  3. 如果非要和物電的同學(xué)進(jìn)行正面競爭, 為什么不差異化發(fā)展, 做連接的工作呢? 既然端上被他們牢牢掌握著, 我們將他們作為基礎(chǔ)服務(wù), 將自己做為一個連接的角色, 整合端的能力? 做一個用戶的連接者? 有用戶的地方, 就應(yīng)該有前端哈?
  4. 單片機(jī)開發(fā)搞不過或搞不來, 我們能搞嵌入式系統(tǒng)嗎? 能用 Ruff 來做端嗎? 能用 Android 手機(jī)來做端嗎? 在做可行性方案的時候, 是不是有必要一定要搞單片機(jī)和低成本硬件呢? 我能不能在 Android 手機(jī)上做一些 IoT 開發(fā), 在批量生產(chǎn)時, 再讓物電的學(xué)生做電路設(shè)計和硬件成本的降低呢?

[站外圖片上傳中...(image-e9a0a1-1513824975958)]

個人成長的3個關(guān)鍵詞

  • 做: 有目標(biāo)地做, 分階段地做, 做到極致
  • 思考: 思考是核心, WHY 有時候比 HOW 更重要
  • 發(fā)聲: 執(zhí)行的總結(jié)和思考的傳達(dá)

自己對它的理解是, 做的時候, 更多需要去思考做背后的邏輯, 以及解決了什么問題. 很多時候, 對技術(shù)選型或技術(shù)探索, 優(yōu)化之類的, 需要和團(tuán)隊的目標(biāo) 或 老板的想法結(jié)合在一起.

發(fā)聲, 最近有聽到很多類似的, 比如, 工作需要透明, 需要更多地和團(tuán)隊成員分享, 還有包括技術(shù)分享等等. 說的多不如做的多, 所以, 這三點就不展開.

[站外圖片上傳中...(image-192761-1513824975959)]

貓超不一樣的視角

@由校老師 貓超的 Web 實踐, 使用 U4 2.0 內(nèi)核的將 Android 4.4 及以上的兼容磨平, 并將 web 性能提升了不只一點點. 因為也剛好遇到了有同學(xué)問 web 和 weex 技術(shù)選型的問題, @由校老師 也做了很好的回答.

貓超在首次加載中, 對 Service Worker 做了優(yōu)化, 通過 UC 內(nèi)核, 可以將 Service Worker 本身 Push 到內(nèi)核中,并提前加載資源進(jìn)行首次優(yōu)化. 在二次加載中, 通過 Service Worker 的 Cache 能力, 也能獲得不少的加速.

會后, 和 @由校老師 簡單聊了一下性能痛點: 長列表的內(nèi)存回收, 或 cell 重用復(fù)用的問題等等. 在他看來長 list 的性能問題已經(jīng)不是特別大的問題了, 相反, 他給我舉了一個 tabbar 滾動后無法保持狀態(tài)的痛點.

[站外圖片上傳中...(image-a03e5b-1513824975959)]

其他小細(xì)節(jié)

  • 好多程序員背景的 PPT 在配色和字體大小上, 用戶體驗不是特別好, 比如: 藍(lán)底黑字, 大段字體很小的代碼, 這點在轉(zhuǎn)正預(yù)講的時候自己也犯過類似的錯誤, 所以, 體感也比較強(qiáng).
  • 一個好的, 令人印象深刻的演講, 不是講一些共識, 而是講些不一樣的觀點. 即使是相同的觀點, 也需要有不同的角度或維度, 去解讀自己的不同觀點. 相同的觀點能包裝成不一樣的產(chǎn)品也不錯.

References

  1. Weex團(tuán)隊負(fù)責(zé)人:我眼中的Weex和Weex開源那些事
  2. 云棲社區(qū)開發(fā)者技術(shù)峰會——開源技術(shù)專場
  3. Ruff 文檔
  4. 小米 IoT 開發(fā)者平臺
  5. estimote, iBeacon是什么 iBeacon怎么用
  6. 前端的職業(yè)危機(jī)感 by 自己
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容