2018年10月14日,第七屆IMWebConf前端大會在深圳科興國際會議中心成功舉辦。今年大會現場參會人員近500人,線上直播參與人數累積近千人。
前端
IMWebConf 是由騰訊前端 IMWeb 團隊發起的國內頂級前端技術領域開發者大會。今年大會依舊匯聚了許多前端大咖,而且議題更加緊貼前端前沿熱點,深刻探討一線前端技術。大會邀請了國內外講師19名,包括W3C Webapps 組聯合主席Chaals Nevile、英特爾高級工程師閆紹博、Adobe 資深 UED張文婷等技術專家,以及來自百度、阿里巴巴、美團、經典、小米、騰訊等國內一線科技公司的頂級開發者,總計探討了17個議題。
vue
今年大會分爲了Web前端領域的標準與前沿、小程序快應用、Native 跨端融合、Node 服務與性能、可視化與動畫五大會場。各會場均座無虛席,講師們的分享內容詳實而有深度,引起了觀衆們踊躍討論。圓桌會議環節,觀衆更是與大咖們面對面交流,從業務場景的問題解決,到各大開源框架的深度探究,現場氛圍持續爆棚。會場貼心的茶歇也讓你們感覺到了大會主辦方的用心。話很少說,接下來讓咱們趕忙回顧下各大會場的精彩內容吧
java
會議開場由騰訊技術總監王輝發表開幕詞,向你們分享了在前端前行道路上的經驗和感悟,爲大會拋磚引玉。引用國學大師王國維《人間詞話》的「人生三境界」,王輝講述了從開始接觸前端的迷茫到掌握基礎的「立」,到遇到困難也堅持奮鬥執着追求的「專」,最後培養出本身創造性的獨特頓悟的「得」,此爲「前端三境界」。node
第一場分享是來自 W3C Webapps 組聯合主席 Chaals Nevile 帶來的《Web Standards》,Chaals 從 Web 和 W3C 的關係講起,介紹 W3C 近期工做亮點,包括可用性、國際化、隱私與安全、Web體系結構。緊接着經過 Appcache、Push API、AMP 講解了當前正在推進解決的問題以及 W3C 的標準化討論流程。最後介紹了 W3C 目前現有工做的優化、改進、創新、孵化和研究。web
第二場分享是來自英特爾的高級工程師閆紹博帶來的《XR on the Web》,開始分享以前紹博大神從 spec 的角度,呼籲開發者更多參與 spec 的討論,把聲音傳播到世界上更多平臺和領域。緊接着從開始對 WebXR 相關技術的介紹,咱們也能瞭解到 WebXR 設備 API 在更新和演進進程以及 WebXR 如何與 GPU 渲染、AI 等技術進行結合。最後演示瞭如何使用 WebXR API 和 WebGl API 構建一個移動端 Web 上 AR 應用。算法
第三場分享是《Make Web Quic》,是由騰訊高級工程師羅成帶來的分享。首先經過講述當前 HTTP2 和 TCP 的問題,引出 QUIC(Quick Udp Internet Connect) 協議的解決方案,其包含不少先進特性例如 0RTT 建連、連接遷移、傳輸控制和隊頭阻塞優化等。接着羅成大神重點分享了騰訊安全網關是如何經過 Nginx + Chromium 實現的 Nginx-Quic 框架,以及 QUIC 在騰訊業務線上的應用。小程序
早上的圓桌會議除了上面的三位大神,還邀請了 W3C web 標準技術專家,W3C 中國區經理吳小倩一塊兒與現場觀衆交流,解答疑問:後端
一、如何看待移動支付安全問題?微信小程序
Chaals: 表示本身不是這方面的專家,可是 W3C 有專門的成員來完成這方面相關的研究和推動,移動支付給用戶最重要的一個特性就是簡單與安全。緩存
二、中國是以什麼的角色參與 W3C 標準的制定?
W3C 的全部標準流程都是免費公開參與的,放在 GitHub 上面的,你們能夠找到本身感興趣的 Issue 進行討論。
三、W3C 的資金來源?
Chaals: 會員制和會員資助,若是不存在 W3C 組織,會員們須要花費更多資源來推動標準化工做,因此仍是會產生 W3C 組織。
四、服務端不支持 quic 如何降級,應用層支持的成本是什麼狀況?
羅成: quic 協議轉換成 http1,承擔的更多的是一個網關的職責。應用本身實現的成本很高,目前現有的開源解決方案都不是很完美,Nginx-Quic 框架目前沒有開源的計劃,還在持續的更新迭代。
第一場分享是由騰訊高級工程師、WePY 負責人龔澄(Gcaufy)給你們帶來的議題《WePY - 小程序敏捷開發實踐》。Gcaufy 首先給你們介紹了 WePY 的開發背景、設計思想,而後結合各類有趣的例子解釋了 WePY 背後的一些原理,如模板編譯、數據綁定、髒檢測機制等。接着又提出了 WePY 目前的一些不足,存在不兼容原生模板、髒檢測機制帶來的性能問題等,藉此引入了 WePY 下個版本的規劃。另外,Gcaufy 還爲咱們分享了 WePY 運營上的不少經驗,因此一個成功的開源項目不只要在技術上作耕耘,運營上也不能落下。
第二場是由美團前端技術專家、小程序開發框架 mpvue 負責人胡成全給你們帶來《mpvue 的發展和動態化方案探索》。講師首先介紹了 mpvue 的特性和原理,而後介紹了 mpvue 基於 vue 經過嵌入 runtime 實現的動態化適配方案及其原理。同時,mpvue 還圍繞 vue 引入一系列開發規範和最佳實踐,給開發者帶來良好的開發體驗。最後,結合目前的生態和不足,提出了將來的一些計劃。
第三場是由小米資深前端工程師、小米快應用前端負責人董永清給你們帶來的議題《快應用設計思路漫談》。講師首先介紹了快應用的設計思路,以及快應用和PWA等在渲染方式等方面的區別和優點。而後經過一個例子,從工程化實踐的方向上給你們演示了一個快應用從項目架構到開發再到調試的整個過程。最後,還提出了快應用後續的展望。
第四場是由騰訊前端工程師、IMWeb團隊成員劉華(Eden)給你們帶來的《基於 PWA 的性能優化實踐》。Eden 首先介紹了 PWA 的基本原理以及 Service Worker 的一些能力。而後,從 Web 頁面加載的整個過程開始分析,結合 Web 加載性能瓶頸,分別從 HTML 緩存、資源預加載、CGI 預加載等多個不一樣的方面,手把手演示如何把一個頁面的首屏加載速度優化到毫秒級別,真正作到 「頁面秒開」。整場演講圖文並茂、深刻淺出,即接地氣又不乏亮點。
「一次編寫,處處運行」(Write once, run anywhere, WORA),最先是Sun公司在跨平臺方面的宣傳口號,也表明着咱們做爲開發人員對於效率的極致追求。近幾年隨着移動互聯網的快速發展,移動終端設備的軟硬件、操做系統、開發工具鏈和技術社區等日趨成熟完善,在前端也涌現出各類跨平臺的開發方案。
第一場分享是由阿里巴巴技術專家張翰、申遠帶來的《Weex內核的原理和演進方向》。在分享中,介紹了Weex的基本狀況、內部結構、分析比較,申遠講述了 Weex in 2018 及相關特性。 Weex 目前已在「阿里系」應用以及社區內獲得普遍應用,WeexCore 也針對 Layout 性能和首屏等作了大量優化,優化後在速度性能、內存佔用方面的明顯效果。同時,Weex Render 基於 Skia,能夠實現更爲複雜的 CSS 效果。
第二場分享是由騰訊高級工程師趙宏罡、盛波帶來的《Hippy 框架設計與優化》。講師從前端和終端的角度介紹了 Hippy 的誕生,相比 RN 的逐條改進優化策略,使用場景以及未來的規劃等等。Hippy 相比 RN 在諸多方面都有優化,手勢方面,Hippy 改善了終端向前端持續發送手勢事件的行爲,解決了前終端通道被大量佔用的問題;通訊方面,Hippy 去除了 RN LastFlush的緩存;動畫方面,Hippy 使用 AnimateConfig 使得動畫一步到位,性能獲得顯著提升。Hippy 介紹到,它不只僅是一個框架,還提供一整套解決服務,包括打包管理系統、動態運營、隔離灰度、ABTest、差量發佈、強制更新、安全校驗、流控等等,幫助更好的管理髮布。
第三場分享是由京東李偉濤帶來的《多端開發統一框架 Taro 深度剖析》。講師介紹了 Taro 的歷史背景、設計思想、持續優化、開源探索以及將來規劃等。 Taro 致力於打造一個多端的統一框架,支持用 React 方式編寫一次代碼,可以生成在微信小程序、H五、React Native 等多端的應用,真正作到一處編寫,多端運行。在分享中,剖析了小程序當前開發的痛點和弊端,並闡述了用 React 來開發多端的設計思想,在Taro 中如何運用編譯原理將源代碼轉換爲多端代碼,並作到性能的持續優化。在開源方面,Taro 對 React 社區、小程序社區支持良好,UI完善,有着活躍的線上線下社區交流,在將來還會支持百度、支付寶小程序、快應用、更快捷的測試、同步調試、可視化頁面搭建平臺等等很不錯的新特性。
第一場分享是由阿里螞蟻金服技術專家高曉晨帶來的《螞蟻 nodejs 微服務實踐》,首先高老師給咱們介紹了微服務架構的優勢和微服務對於 node.js 的意義,而且從 node.js 與 java 的對比數據中分析 node.js 在 io 性能、啓動速度、內存佔用方面都是更優於 java 的。最後給你們介紹 rpc 框架的實現原理,包括協議部分、服務尋址、負載均衡、容災策略、動態配置和微服務化架構的運維經驗,乾貨滿滿。
接下來第二場是由騰訊高級工程師裴偉給你們分享《Tars.js 大規模商用實踐與應用》,在開始前裴老師先向你們瞭解了使用 node.js 作服務端的經驗,而後由淺入深地分享內容。裴老師很是詳細的介紹 Tars.js 是如何實現監控、RPC、日誌、配置和染色。其中對於服務的穩定性展開深刻探討,在生產環境中如何作負載均衡、無損重啓、服務監控,這些內容都是前端工程師剛嘗試使用 node.js 須要關注和學習的。裴老師還給你們點撥從前端到寫服務端最重要的是思想上的轉變。
第三場是騰訊高級工程師、IMWeb團隊成員葉亮給大帶來的《騰訊課堂 node 性能優化實踐》,爲了提升頁面的首屏渲染速度,相信不少小夥伴會給頁面作 node.js 服務端直出。葉老師給你們分享如何加速首屏渲染,從騰訊課堂使用的 java 端直出轉到 node.js 直出的過程,從模板選型、node server 框架選型有比較客觀的對比。最後進一步講解了如何使用 devtools 來分析 node server 的性能瓶頸,同時前端同窗推進後端同窗使用 protobuf 協議作通訊得到驚人的性能效果。作好 node server 容災也是服務端很重要的一環,葉老師舉例了在極端狀況下如何經過容災手段保證頁面是可用的。
第四場是來自阿里雲高級開發工程師黃一君帶來的《經過 Coredump 分析定位線上 Node.js 應用故障》。 Node.js 應用的內存泄漏和 CPU 佔用高問題是最多見也是最難排查的兩類問題,小編也常常遇到這些問題,排查起來很是棘手,黃老師給你們介紹了 core dump 和如何經過 LLDB 來分析 core 文件,經過 core 文件分析能夠找到類死循環和堆內存雪崩的問題。遇到錯誤日誌信息不足夠的 crash 能夠經過 AsyncHook 插樁作鏈路路追蹤等方式使人大開眼界。
第一場分享的是來自 Adobe 公司的張文婷,分享的話題是《動靜之間,數字之美》,開場介紹了動畫的幾種實現形式,CSS、SVG、JS,之間的優劣,講了一些基於上述技術的動畫解決方案如 GSAP、lottie 等。最後還首次公開一種黑科技,基於 font-varitation-setting 的動畫。整個分享乾貨滿滿,文婷最後也得到全場最佳講師的榮譽。
第二場分享是螞蟻金服梁文森給咱們帶來的《AntV-讓數據栩栩如生》,整個演講主要是講述了 AntV 生態下的 G二、F二、G六、L7 等各個庫的演化過程,能夠看出 AntV 對於可視化有不少深刻的探討和解決方案,而且因爲阿里濃厚的開源文化氛圍,這些組件都有完備的開源推動計劃,給整個社區帶來很大的貢獻。
短暫的茶歇後,最後一場分享是來自百度的宿爽給咱們帶來的《大數據可視化性能優化之道》,這個話題是以 ECharts 爲基礎,給你們講述可視化性能方面的議題,提出了很多性能優化的手段,有基於場景特色的、程序層面的、用戶感觀上的、數據加載上的,也有不少實用的手段如算法、重用對象、Web Worker、TypeArray、二進制加載等。能夠看出 ECharts 在這上面作了不少性能方面的優化。最後,講師也坦承 Echarts 存在一些不足之處,如文檔、未能及時實現的 feature 等,講師也但願你們以 PR 的形式爲開源社區貢獻本身的一份力。
特別感謝本次大會合做夥伴的鼎力支持:
感謝各位講師的精彩分享與參會小夥伴的確定,是你們一塊兒鑄造了這場前端領域的技術盛宴。
感謝 IMWeb 團隊全部的小夥伴們,對於大會的每一項準備工做,你們都專一而細緻,盡職盡責。
ImwebConf 2018 圓滿落幕!
ImwebConf 2019,讓咱們一塊兒期待精彩繼續!