今年第三次參加 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) 等等, 更多地站在用戶的角度想問題, 得到的也會更多.
- 開發(fā)者體驗, 開發(fā)者的體驗其實有了很多的表現(xiàn), 其實也體現(xiàn)在工程效率和開發(fā)效率上, 比如: VSCode 替代 Sublime, 還有最近出的 Parcel 打包工具, 也是在某種程度上解決了開發(fā)中對 webpack 某些痛點(當(dāng)然, 打包效率的提升可能會更關(guān)鍵些), 還有很多的
生態(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的疑問, 簡單寫一下聽完老師后的感想和自己的理解:
- 首先, 我們得跳出當(dāng)前前端的技術(shù)棧和業(yè)務(wù)的限制, 很顯然, 以目前前端的知識堆棧和能力, 沒有特別好的切入點來涉足 IoT 這個領(lǐng)域. 所以, 一個好的建議是, 做好該有的知識儲備, 以目前的狀態(tài)進(jìn)入 IoT, 注定是被淘汰的那一批.
- 其次, 目前沒有一個好的技術(shù)方案來讓前端參與進(jìn)來, 甚至是像
天貓精靈的無屏設(shè)備, 前端的角色顯得更為尷尬, 所以, 簡單說, 一篇空白, 等待自己去探索出一條前端之路. - 如果非要和物電的同學(xué)進(jìn)行正面競爭, 為什么不差異化發(fā)展, 做連接的工作呢? 既然端上被他們牢牢掌握著, 我們將他們作為基礎(chǔ)服務(wù), 將自己做為一個連接的角色, 整合端的能力? 做一個用戶的連接者? 有用戶的地方, 就應(yīng)該有前端哈?
- 單片機(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)品也不錯.