IMweb Conf 2017圖文(部分)筆記 -- 上

AleCC發表於2017-09-16
IMWebConf 2017前端大會的發起方是騰訊公司,組織者是騰訊公司最專業的前端團隊之一IMWeb團隊,官網地址:2017.imweb.io/,難得的是騰訊副總裁Ross做開幕致辭,分享了自03年加入騰訊十幾年的開發歷程,生動而有趣的分享。

《騰訊IMweb Conf 2017大會圖文筆記 -- 下》
juejin.im/post/59bdd9…

本文多圖,行動網路使用者請注意! 文章為部分展廳記錄,每一場講座紀錄的 也是部分!

IMweb Conf 2017圖文(部分)筆記 -- 上

參會議程


IMweb Conf 2017圖文(部分)筆記 -- 上

個人總結:


IMweb Conf 2017圖文(部分)筆記 -- 上
IMweb Conf 2017圖文(部分)筆記 -- 上

有w3c經理分享web標準化的現在與未來,谷歌工程師分享PWA與AMP加速網頁,也有微軟經理分享TypeScript結合VScode優化開發效率,張巨集波分享新鮮編譯工具BuckleScript,天豬分享阿里內部node框架Egg.js+Koa,騰訊工程師唐俊俊分享第三方WebIM柔性優化,也看了王躍老司機分享的小程式核心架構剖析,Node末場狼叔分享經驗之談,大前端工程師的成長經驗...

圓桌會議交流如何成長和找到核心技術、慢慢擴充視野...

真的挺開闊眼界,給人以方向,還收穫了一個移動電源和一本書,這波不虧~


一、《Now and Future》-- W3C經理 Philippe Le Hegaret

演講PPT地址: https://www.w3.org/2017/Talks/0916-imweb/?full#1

主要講解的是Philippe的工作內容,管理著290左右的 Community Groups,以W3C的工作組劃分,一些標準的演變過程等。


IMweb Conf 2017圖文(部分)筆記 -- 上


IMweb Conf 2017圖文(部分)筆記 -- 上



然後最重要的是2018年會做哪些,這也是新的一年的學習大綱!


IMweb Conf 2017圖文(部分)筆記 -- 上

分為三大塊: 效能、安全、數字媒體。

IMweb Conf 2017圖文(部分)筆記 -- 上


IMweb Conf 2017圖文(部分)筆記 -- 上


IMweb Conf 2017圖文(部分)筆記 -- 上

然後接下來呢:


IMweb Conf 2017圖文(部分)筆記 -- 上


IMweb Conf 2017圖文(部分)筆記 -- 上
繼續提升安全性


IMweb Conf 2017圖文(部分)筆記 -- 上
更佳的效能表現


IMweb Conf 2017圖文(部分)筆記 -- 上
更好的web應用:PWA


IMweb Conf 2017圖文(部分)筆記 -- 上
更多關於渲染

更多瀏覽器渲染: drafts.css-houdini.org

---

更多目標:

IMweb Conf 2017圖文(部分)筆記 -- 上

會後圓桌會議有提問,W3C的標準是否落後於時代演變?

Philippe Le Hegaret回答:並不會,PWA早在六七年前就已經提出了。


二、《PWA+AMP - 移動web的現在與未來》-- 谷歌工程師Michael Yeung

IMweb Conf 2017圖文(部分)筆記 -- 上
PWA + AMP

不瞭解 AMP的可以先看看張鑫旭的這篇文章,《移動頁面加速google的AMP和百度的MIP簡介》以及官網 www.ampproject.org/zh_cn/。


開場自我介紹,以“使用者開啟網頁三秒鐘後無反應就會離開”的斷言作為開題,以移動端載入速度衡量使用者體驗的標準。
IMweb Conf 2017圖文(部分)筆記 -- 上


將移動端版本更新與web端相比,平均每個使用者更新下載APP的概率接近0.
IMweb Conf 2017圖文(部分)筆記 -- 上

然後介紹AMP是基於Google的快速構建HTML卻同時受限制的工具。這對於移動端電商是非常有利的,提升移動端搜尋排名,介紹了國內外廠商的使用情況,國內是餓了麼、阿里巴巴等。
IMweb Conf 2017圖文(部分)筆記 -- 上


IMweb Conf 2017圖文(部分)筆記 -- 上


接下來講的是使用者體驗的三個要輸:可靠、快速、吸引


額... 三個模組的分析的話,這裡很抱歉,認真看沒注意拍,一下子就過去了~


IMweb Conf 2017圖文(部分)筆記 -- 上
可靠、快速、吸引

然後談了談PWA(Progressive Web App)的優勢,著重講了難點Service worker,

主要講了區分好register、install、advanced等階段的控制。IMweb Conf 2017圖文(部分)筆記 -- 上


IMweb Conf 2017圖文(部分)筆記 -- 上


三、《TypeScript:高效可擴充套件的javascript開發經驗》-- 微軟程式經理/TypeScript專家 Limin zhu


IMweb Conf 2017圖文(部分)筆記 -- 上

首先自我介紹,專案相關等等~

IMweb Conf 2017圖文(部分)筆記 -- 上


開發者應該做些什麼神奇的事情呢?IMweb Conf 2017圖文(部分)筆記 -- 上

先看看js程式設計師的日常,這位微軟專家概括了日常時間分配。IMweb Conf 2017圖文(部分)筆記 -- 上

如圖所致大部分時間都在理解別人的程式碼和自己三個月之前寫的程式碼(由於js的弱型別導致的),那還有什麼時間去開發新功能呢,那有沒有辦法使得理解的時間縮短5%,維護的時間縮短5%,使得開發新功能的比例變成15%呢? 

這時候該TypeScript就登場了。

介紹了TypeScript的優勢,JS語言的超集。


IMweb Conf 2017圖文(部分)筆記 -- 上


VSCode這款微軟出品的大殺器派上用場了,一個demo.js 首行加上 

// @ts-check複製程式碼

這一神奇的程式碼,你的js就出現型別檢測/報錯提示了~ 


IMweb Conf 2017圖文(部分)筆記 -- 上

更多示例就沒拍到了,簡單總結就是通過IDE檢測你的TS程式碼增加型別識別,以達到提高目的的效果。

四、《BuckleScript:large scale JS programming - the next step after TypeScript》-- 張巨集波

這是一個非常新奇的東西,號稱編譯比TypeScript快很多,基於簡潔優雅的OCaml,甚至可以編譯組合語言在ARM機器上執行,這是一位可敬的編輯器開發者。

具體請看文章: (1年前)架構最快最好的To JS編譯器

(1年前)JavaScript無處不在,Bloomberg 開源BuckleScript 1.0 助力JS平臺大規模高效能軟體開發


為什麼沒有更多關於BuckleScript這個編輯器了呢,因為某人處於閒魚呆滯中~


------

IMweb Conf 2017圖文(部分)筆記 -- 上


以上是上午主會場筆記(好多漂亮的小姐姐有木有),難免有沒拍下來來的,輕噴就好。

分享的目的是分享一個視角來評判我們的前端之路,下午的晚些了,畢竟週六特困戶也不容易,嘿嘿~  By Ale-cc 2017.09.16


相關文章