參加2015年8月8日上海第二屆 CSS Conf 大會是個什麼樣的體驗?

比如遇到什麼好玩的事情,志同道合的小夥伴,都可以說說。


職業寫流水賬的來了!

這次首先說正事吧,我CSS方面比較薄弱,只能盡自己可能去聽了,說得不對的歡迎大家打我。

一、手機淘寶CSS實踐啟示錄

這個主題是勾股講的,老朋友了,內容我感覺很不錯。主要講的是屏幕適配,採用何種方式作為基準,然後不同比例的屏幕,採取橫向固定,縱向斷點(響應式)的思路。另外對於字體部分,需要特殊對待,在更大文字跟更多內容之間權衡,所以整個方案,布局之類都是用的相對的大小,而字體是用px比較合適。

二、New W3C CSS Checker

著名老外Mike Smith講的,並且配有職業翻譯,著名的高博同學。其實這個主題不翻譯也沒關係的,只是可能大家會抓不住笑點。高博翻譯得挺好。

這個東西主要是用來檢查CSS的一些編寫錯誤,比如說,拼寫錯誤,漏掉的分號,括弧之類,或者屬性名,屬性值寫錯。老版本的這個東西,是Java寫的,而且很多年不維護了,跟不上形勢的發展,所以打算搞新的。

另外提到Mozilla也在搞新的瀏覽器核心,忘了叫什麼了,用於取代Gecko,使用Rust寫的,之前版本是C++。然後談了一陣Rust,這個東西的好處我大致知道,語法感覺像C++跟Go之類的合體?目前這個新核心支持到CSS2.1,我感覺進度還是不樂觀啊,雖然兩年做到這個程度,但是要追上現在的版本,那還得好多好多好多年吧,畢竟後面東西比以前的多多了?(我說得不對請打我,這是個人認知)

三、企業CSS應用

這個主題,感覺標題起得不好,而且內容不夠格叫這個標題。在我看來,如果講這個標題,至少要有一半篇幅花在樣式與組件的合作、工作流程、壓縮合併策略等方面,但實際上只談了非工程化的方面。

其他部分沒有什麼特別的,有一點是很好的,就是強調了attribute選擇器的使用,覺得應當優先用它,而不是class。這一點對我很有啟發,而且我覺得說得非常有道理。他用angular的一個directive演示了例子,我覺得不光angular,就算是其他不管什麼框架實現的自定義屬性都是可以的,比如vue。

用屬性選擇器,確實可以把選擇器組織得精鍊很多,而且復用粒度也會更好(因為自定義屬性的配合)。後來提問的時候米粽提了個是否要用data-開頭做自定義屬性,我覺得問題不大,雖然那樣可以規範一些。

四、CSS預處理器老調新彈

這個是 @鄭海波講的,說實話,我之前對他的印象停留在regular框架上,以為他是一個技能偏向js的人,但聽了這一場之後,才感覺他技能太全面。

postcss這些東西,我之前都只是大致了解,偶爾在 @一絲 的微博上看見,然後好奇點進去看看。主要問題是我在CSS這條線上太薄弱了,也沒有實踐過LESS,SASS之類的東西,只能跟著感覺聽。聽了都覺得很有道理,然而說不出所以然來, @顧軼靈跟一絲, @賀師俊可以點評下……

五、高性能CSS動畫

360的女工程師講的,整個內容其實不算多難,但是總結得非常好,組織得非常好,講得更是非常好。具體知識點不太好總結,比如如何使用Chrome的Timeline標籤頁查看動畫運行狀況,比如reflow和paint的各種情形。沒去的建議看錄像。

六、重拾 CSS 的樂趣

特別好評!這個主題是CSS魔法講的,我從未見過能講得這麼好的人,演講技巧max,情懷max,趣味性max,選題也非常好,請大家看錄像,不解釋。

七、移動下的CSS布局

這個主題,感覺跟勾股的相比,過於普通了。

八、中文排版需求

這個可惜我錯過了,當時在外面跟 @寸志和 @郭達峰聊天,後來聽有人說非常好,打算後面回顧一下錄像吧。有看過的同學歡迎說一下感想。

特別聲明,我是CSS渣,以上總結不代表分享者真實水平,只代表個人渺小的感受。

=======================================================================

好了,正經話到此為止,可以痛快水了。

第一屆CSS conf我沒去,因為自己是CSS渣,而且地點在北京,感覺略遠。這次在上海,而且上海有sofish這麼可愛的人,當然是要去一下的。

我是周五中午到的,在路上看到很多好看的雲,下午在附近轉了下,下了點雨,天氣悶悶的,晚上吃了小楊生煎,決定把這個東西跟湯包一樣列入我的禁忌食品,因為我性子急,吃這種東西一定會被燙到,好慘啊。

吃完回去一身汗,洗了個澡,把T恤洗了下,沒多久,看群里說到 @小雪 快要到了,然後鄭海波在小楊生煎,決定去找他們聊天,但T恤沒幹,直接穿著濕的過去了,反正天熱也無所謂。

一聊發現鄭居然跟我住一個店,小雪住附近,就一起送她過去了,然後聽到 @林小志喊吃夜宵去,就三個人一起走過去。憑藉超強的方向感定位感,順利找到,在場的除了小志,還有大漠,情封,林毅,還有特別清秀可愛的軌跡妹子!一聊又聊了兩個小時,聊得好high,我要減肥,只喝了點雪碧,什麼都沒吃,他們吃燒烤和龍蝦好開心。

周六早上打車去會場,發現居然在攜程旁邊,到得略早,看到已經到了一些人了,比如裕波,還有我司一些同事,統計了一下,驚奇地發現我司居然來了10多個人。旁邊有個人抽獎抽到不知哪家,好像upyun的一個充電寶,特別特別可愛,我也去試驗了一下,只有滑鼠墊……不過拿了一件7牛的T恤,回去試試。

這時候微信群裡面已經亂得不行了,各種紅包,各種貼圖,叔的低端安卓機都快卡死了。。。照例來了很多人,比如小雪,比如 @yuanyuanVivian,比如 @顧軼靈,比如米粽,比如賀老,已經無法一一列出了,後來女神 @Ovilia穿一身鮮艷的裙子,攜一名閨蜜款款入場,吸引無數眼球。

另外,群里的人們,你們這麼黑我真的好嗎?中間上了一次廁所,回來發現兩句:民工哥跟一個妹子一起出去了。民工哥又跟一個妹子一起回來了。………………你們節操呢???

中午吃飯,這個飯菜,是故意的嗎,因為我不吃海帶不吃魷魚不吃木耳,所以……同事看了看我跟旁邊妹子的飯盒,說你倆怎麼回事,一個光吃了菜,一個光吃了飯……

吃完飯見到了梁傑,聊了一會,他又掏出一本程序員健康的書要送我,我說買過了。。。還是送別人好。下午又來了好多人啊, @一絲 ,小豪,還看到winter了,感覺這貨又肥了,目測得有200斤了吧,手裡拿一把摺扇,上面五個什麼字的,居然給忘了:朕心寒至極?點頭豬也在旁邊一個勁笑,感覺她越來越呆萌了。

五花肉也出現了,一來就是:叔叔叔叔。。。我照例畫了個圓圈。然後看到那個誰了,id叫次碳酸鈷,特別萌的人,也是餓了么的,多可愛啊。

哎,說起餓了么,好像發現漏了什麼很重要的事:sofish今天領證了!在此特別恭喜小魚和ciao,祝白頭偕老,一生幸福!

然後就是跟寸志和郭達峰聊,跟這兩個2貨互黑,然後很乖的 @題葉也出現了,一起聊了會,全體拍了個合影就散了,他們大部隊吃飯去了,我跟同事一起吃完回了賓館,等小雪和鄭海波吃完回來又聊了很久到12點。每次出來都有碼農可以聊好開心啊!

=====================================================================

中午就要回南京了,估計上午也是一直睡覺的狀態。回顧這兩天,收穫滿滿,有此類活動還是要堅決出來參加,雖然我是CSS渣,但我至少得知道大家都在搞些什麼啊,不然以後做技術選型就麻煩了。

在前端領域,每年新的好玩東西太多了,多出來看看,聽聽,會很有好處,跟人聊也是很快樂的,我就喜歡跟年輕的有激情的碼農聊,就像上次跟小宇聊,產生很多靈感。

另外這次活動,由於領域的特點,妹子好多啊,當然叔叔只看代碼,並不關注這些。

好像寫完了,那就這樣。感謝邀請。


首先感謝兩們同學謝邀。

我也是第一次參加CSS Conf 大會,我們首先要感謝的是@裕波 的付出,而且堅持這麼多年一直為前端組織分享會。

至於大會分享的主題, @徐飛 已做了詳細的描述,我也不做過多闡述,只是聊聊自己的感受。

1、CSS Conf大會當初是只在國外有,而在國內是這兩年出現的,這要感謝 @裕波和 @sofish的付出。讓大家有這樣的一個機會讓大家聚在一起聊技術,聊人生。

2、第二個是我想說說參會者。可能每一位參會者都有著不同的目的去參加。了解技術、膜拜大牛、為團隊招人等等,但不管是出於哪種目的,我們都應該尊重舉辦方的付出。在國內我去參加的前端分享會都會有這樣的現象:

  • 報名了不來參加,哪 @裕波大大的話來說,誠信何在。縱使你有千般理由,你可曾想過,舉辦方是根據報名的人數決定會場的大小和相關事宜,如果都是如此,你自己會有怎麼樣的想法...
  • 分享結束,但未到最後環節,就開始離場,難道這麼幾分鐘就對你真的很重要嗎?怎麼就不尊重一下人家的感受呢?
  • 你是來參加會議的,不是來拿禮品的。縱使你是沖著禮品而來,你沒有中。能怪主辦方嗎?主辦方沒有義務為你準備任何禮物,也沒有任何義務給你任何禮品?而且一你沒付費,二你沒有為大會做出任何的貢獻,你有何權利要這些

3、感謝分享嘉賓的主題,因為你們為分享準備主題之時花費很多的時間。 @CSS魔法 為了給大家準備分享,在會場上還在不斷的修改PPT,為的就是給大家帶來最好的分享,最好的內容。就我個人而言,我在聽 @CSS魔法的分享就學到很多,CSS技術不多說,他的PPT的製作就讓我非常的折服,最起碼我自己未曾做到這一點。

4、 希望廣大前端愛好者給自己留下一片凈土,珍惜這樣的活動。

---------------------------------------這是分割線--------------------------------------

這次參加活動,除了見了老朋友還認識了很多新朋友,雖然有很多新朋友從未謀面,當您跟我打招呼的時候,我真的感到很意外也很高興。雖然我跟您聊得不多,但您一直在支持在下,這是我的福氣,這也將是我自己在前端路上一直走下去的動力。

另外在會議結束之後,得知Mike Smith對W3cplus(W3CPlus | css3教程-css3實例-css3動畫)站點的貼紙感興趣,這讓我感到非常的意外。而且還有幸能與Mike Smith一起合影:

但感到遺憾的是,自己英文太差,不能像其他同學 @高博 、@羨轍、 @米粽、@小雪 等同學和Mike Smith做技術交流與溝通。另外還有點感到欣慰的是同學們對《圖解CSS3》(《圖解CSS3:核心技術與案例實戰》)喜歡,特別是有一妹紙特意找 @林毅 說要這本書。

只是希望這本書不會誤人子弟,也趁此機會感謝支持這本書的同學們,正是因為有你們們,我一直有動力,並且努力讓自己變得更強大。今天順利到家,最後向波波致敬,向分享的嘉賓致敬,讓我受益良多。也希望有一天,我也能會這樣的大會上分享。


============ 先說正事,技術分享筆記 ============

## 手機淘寶 CSS 實踐啟示錄 勾股

&> slides: XIU Slider Player

我司勾股老師講手淘在 CSS 領域的一些實踐,理念,開源產品以及工作流。

- zorro開源 http://zorro.io/

- 推薦本書 flexible web design

- lib-flexible https://github.com/amfe/lib-flexible

- responsive vs. flexible

- 高度設斷點 vertical responsive

- 手機淘寶前端的圖片相關工作流程梳理 · Issue #8 · amfe/article · GitHub

## New CSS Checker - Mike Smith

&> slides: http://img2.w3ctech.com/css-checker.pdf

&> New css checker repo: http://github.com/w3c/css-checker

一句話總結:

請關注 css-checker,我會用 rust 寫哦。rust 這個可有意思啦,是新語言,有很多很好的特性。比如函數式編程。應當嘗試一下。

花絮:雖然其實現場的語速和信息量翻譯並不是十分必要,但 @高博 老師翻譯的很好哇,比如問到現場有多少人知道rust,會場有一些人舉手。Mike: You guys rock! 高博譯:給你們點贊~

## 企業 CSS 應用 - 展新

&> slides: http://www.zhanxin.info/ppt/cssconf/

大概介紹了下支付寶的 UI 層面的產品,譬如之前的[AliceUI](Alice - 寫樣式的更好方式)以及最新的[Ant Design](http://ant.design/),當然 ant design 只是一張 ppt 帶過,在演講前我還以為會重點講一下,期間還說到 css 的 attribute 選擇器的使用,這一點倒是蠻少人會使用。

## CSS 預處理器老調新談 - @鄭海波

&> slides: http://leeluolee.github.io/css-conf/

覺得海波老師講的很清楚,關於預處理器解決的核心問題,以及遇到的問題,以及預處理器和所謂的 postcss 的關係。當然信息量很大需要慢慢消化。

## 高性能 CSS 動畫 - 黃薇

&> slides: http://melonh.com/sharing/slides.html?file=high_performance_animation#/

&> video: http://v.youku.com/v_show/id_XNzQ4MDE3ODQw.html?from=y1.7-2

這個錯過了,主要在外面和人聊天,只聽了一會兒,感覺確實講的很清晰,大家的反饋也是好評如潮。回頭補 ppt 。

## 重拾 CSS 的樂趣 - @CSS魔法

這個現場很贊啊,設計師出身的 CSS魔法,ppt 本身風格很贊,現場演講技巧也很好。講了一些所謂「奇技淫巧」,然而也是最初接觸 CSS 最讓人著迷的一些小快樂。比如用 CSS 畫圖標,畫圓角,實現一些奇奇怪怪的小東西。

## 移動下的CSS布局 - 施豐豐

這個演講也錯過了。回頭補ppt。

## 中文排版需求 - 劉慶

&> slides: http://img2.w3ctech.com/中文排版需求-cssconf.pdf

這個是驚喜,之前就在 @林小志 推薦下買了西文字體1,很吸引我,覺得字體特別有趣,開啟了一個新世界的感覺。這次的分享也是感受到了很多字體的奧妙和玄機。很有意思。而且我是會後才知道劉慶老師就是西文字體的譯者,於是吃飯的時候也找劉老師聊了一下表達了景仰之情,劉老師告訴我西文字體2出版的消息,以及小林章本人今年可能會來中國分享,大概會在深圳或廣州。

============ 以下開始水文 ============

周五晚上,8點多到的上海。忘帶麵包沒吃晚飯已餓暈, @徐飛 蜀黍告訴我地鐵口有小楊生煎,於是就先去解決晚飯,正好第二天的講師鄭海波也在那裡,於是三個人面基+聊天。我們仨住的不遠,小楊生煎吃完晚飯,他倆送我回去。

之前就跟@林小志 約好了夜宵(小志哥說請吃小龍蝦喵喵~),於是我們仨就去和他們會和。也許是颱風影響,當天晚上上海很涼爽,看了下地圖目的地不算太遠,加上剛吃完飯,就決定散步消食走過去。到了地方,見了一眾人,其中有見過好幾次的大漠老師,還有第一次見的「網友」小志、情封和(美美的)軌跡妹子,以及初次見面的林毅老師。說是吃小龍蝦,其實大家都是晚餐後過來的第二輪,還是聊天為主,聊天扯淡很開心,一不小心就聊到12點多,然後大家各自回家。

周六早上,和鄭海波一起打車去會場(為什麼沒有徐蜀黍?因為他起的太早先走了……),路過攜程新樓凌空soho,很氣派嘛。遇到好多熟人,比如坐我旁邊的@yuanyuanVivian ,比如米粽,還比如我司的幾個同學,比如手淘的 chard,巧的是還有我團隊的小鮮肉也去了……總之好多人,中午和 chard 一起吃了飯,盒飯還挺不錯的,而且安排得很好,沒有出現想像中的排長隊的情況。辛苦主辦方 @裕波 。

下午聽完鄭海波的分享,女神 @點頭豬 說她到了,於是到後面去面基,遇到 @一絲 ,一絲姐姐居然跟我情侶衫哦,(就是第一屆 css conf 發的衣服啦),給他回顧了下海波老師說的「基情難續」,然後聽一絲和 hax 扯了一些關於 postcss 的東西,因為我也沒實際用過 postcss ,只是聽聽了。然後還見到了小志、大漠、溫特老濕、以及我司新來的張女神 羨轍 @Ovilia,男神 早弦 @馬天翼 等……

後來五花肉來了,然後在她介紹下第一次見到 @寸志 ,第一次見面:我沒認出來寸老師,寸老師不記得微信加過我。也算是扯平……

後來看 Mike 一個人坐在那邊玩手機,於是鼓起勇氣去搭訕,問了一些上午分享之後的疑惑,比如我覺得 CSS Checker 應當和 gulp/grunt 之類工作流結合起來才更好,他給我推薦了兩個 w3c 的工具:w3c/web-platform-tests · GitHub 和 w3c/csswg-test · GitHub。然後說到 Rust ,我說我覺得函數式編程很難懂, Mike 倒是很熱心的推薦我嘗試一下,他說開始是會有點困難,但這是一種新的編程思想,值得一試。反正就聊了蠻久,也比較順暢,還挺開心的。

之後去和徐飛、寸志、郭達峰聊了一會兒,然後時間就不知不覺過去了,一天的會議結束,大家合影留念。這時候很意外的是 Mike 忽然過來跟我說:「我跟小倩說你她居然不認識你,我一定要介紹你們認識。」然後就介紹我倆認識。覺得很神奇啦,其實我和小倩早就微博互粉,我也曾多次旁聽 w3c 中國工作組的 skype 電話會議,但和她一直沒有正式見面認識彼此這樣。

然後大家一起吃晚飯。晚飯的時候又認識了梁傑,就是久仰的當初翻譯swift的那位,以及一眾攜程廠工。期間搭訕了劉慶老師,前文已經說過,此處略過不表。小花絮是去中間桌敬酒,Mike說:「To PHP」,一桌碼農頓時get了笑點(也算是笑點很奇怪吧……)

吃完飯和海波老師一起打車回酒店,又繼續跟徐飛聊天,又聊到深夜,聊得也是很愉快又很感慨。作為小輩,真的蠻慶幸在這個開放的時代,可以有很多的機會和前輩大拿交流,乃至成為朋友,從他們身上看到很多值得學習的地方,讓他們所以成為大拿的地方。

去之前,我跟老闆說我要去 CSS CONF ,他問這是你未來的方向嗎?我說我還沒想好誒,感覺 CSS 領域並沒有太多東西,我個人還是希望發展的更全面一些。老闆說其實還蠻多東西的可以研究的。這次 CSS CONF 還是很開心的,聽到了很棒的分享,見到了一些老朋友,認識了一些新朋友。我希望,自己可以更努力,成長的更快一些,做一個好的碼農。

p.s. 真的是很圓滿很開心的一次旅程啊,除了……會議結束當天晚上就有點不舒服,開始有輕微的咳嗽。於是晚上聊天的時候大部分時間都在聽以及一直在喝熱水。然而還是挺嚴重的,咳嗽加嗓子疼加暈暈沉沉的,到今天還沒完全好。。。太開心所以人品守恆嗎 ?_?

ps2 同步到blog:第二屆 CSS CONF 小記

ps3 第一屆css conf 的blog:CSS CONF小記


作為一個再普通不過的寫代碼的,也記一下自己的聽一天下來學到的一些東西吧,也算是給自己一天經歷的一個交代。

第一個「手機淘寶css實踐啟示錄」。這個聽完之後留下最深印象的是將手機屏幕寬統一按10rem來處理,通過js在頁面渲染之前寫viewport。其實之前有看過溫大一篇文章談到過手淘使用rem的和用js寫viewport,自己平時也用開發者工具看過手淘頁面最終輸出的html(應該全是js輸出吧…),也注意過這個頁面在devtools裡面顯示出的高寬跟普通網頁有差別,一直也不清楚具體原因,當然自己也沒深究。今天聽了勾股的演講算是明白了一些吧,對我有很大啟發。當然還談到了新的vw,vh單位,還沒聽到過,又學到一點。勾股還講到一個處理圖片的工作流,我覺得也是很有啟發性的。在實際工作里,我是在一個小團隊裡面,做的也只能算是小項目,目前對於圖片都不涉及有放cdn上要單獨發布的需求。但是針對圖片一樣有很多問題,包括演講里提到的那個有可能無限循環的圖片工作流。我也使用過gulp的一些插件來處理圖片,像很普通的壓縮imagemin,生成sprite的spritesmith這些,但總體用下來的感覺一是確實不太好用或者用了也沒帶來巨大好處,二是就算解決了一些問題也是單點的,最終還是不能形成一個有效的工作流程。演講里提到了他們自己探索出的一條路子,至於路子具體是什麼我現在都給忘光了…但是也忘了記一下筆記,可能光自顧自點頭表示強烈贊同了吧…只能等有機會拿到ppt再複習下。

第二個是「new css checker」。老外大叔講了css validator/checker 的歷史追溯,現狀以及未來工作展望等。整個聽下來介紹性質更強一些,就不多展開了(主要自己也沒特專心聽)。不過對自己能聽懂英語演講80%算是及格吧,因為大叔語速真的好慢。但是值得一提的是演講里提到Rust,說是專門為寫servo而創造的。這點蠻讓我驚訝和感興趣。因為平時也看到有文章,包括知乎里好多問題題目都有有關Rust的,特別是最近老看到這詞兒,但是從來沒點進去看過。當時立馬百度百科看了看,對於為了寫新內核而創造一門語言這事兒我感覺很有意思,反正是勾起了我對rust的興趣。以後有機會看看,畢竟人家說的很牛逼的樣子。

第三個是「企業css應用」。這個演講給我印象最深的必然是attribute優先原則以及component的選擇器用attribute+element這些。這個真真是讓我眼前一亮,因為開發中我真是遇到過因為css specifility 沒有規劃好而導致覆蓋css的時候要用很大權重的選擇器。之所以感受這麼強烈是因為就是曾經自己沒有設計好導致開發的時候自己吃自己的shit。為了能夠有一套自己的手機樣式,js插件庫等方便我們自己小團隊,我自己動手當時主要參照ratchat和ionic的樣式寫過一個算是基礎css的東西。畢竟水平太次所以整體上對選擇器權重沒有把握好最終讓自己吃到了 。於是當我聽到attribute優先這詞兒的時候我真的是眼前一亮,感覺馬上就知道下面要講什麼了…當然這個是在基於angular的例子上來談的,對於傳統的不使用像angular一樣能支持自定義屬性的框架,如何去優雅正確的用好attribute我覺得還是有探索和實踐空間的。

第四個是「css預處理器老調新彈」。這個演講前面談到的sass,less,stylus預處理器,後面講到的是postcss。前者這些預處理器我只用過sass,寫scss。海波老師提到的mixin,@extend等一些坑和容易犯的錯誤等等自己在學習sass和寫scss的時候都遇到過,所以基本都知道,前半段聽起來沒什麼壓力。後面講到postcss,說實話我只用它來加前綴和壓縮過,還真不知道也算是預處理(後處理?)。因為自己對postcss不是特別熟,加上中午剛吃飽喝足,我聽著聽著就天外飛仙了,後來演講結束的掌聲把我叫醒了…

第五個是「高性能css動畫」。這個演講貌似是受到了大家的一致好評,因為整個演講確實很精彩,充滿乾貨。很巧合,我前段時間還真好好在網上找了好多資料學習過怎麼實現高性能如絲般順滑的css transition/animation,requestAnimationFrame以及瀏覽器reflow,repaint的知識。不過聽完演講發現自己學的還真不夠,漏了諸如layer,layout,瀏覽器cpu/gpu如何協調工作進行繪製的。總而言之就是知道的讓我加強了印象,不知道的給我指明了方向。希望ppt能儘快出來能讓我重溫一下裡面的知識。不過我有個問題沒能夠現場提問,就是,既然已知reflow我們應該盡量避免,但是聰明的瀏覽器啊它在我們改變元素樣式的時候又會cache住統一apply然後再計算。所以在寫transition的時候改變ccs class的時候往往進行一次force reflow。這兩件事感覺有點相悖啊,哪裡是個平衡點呢?不知道有沒有大神解答下困惑?還有一件事兒就是我在了解reflow,repaint這些知識的時候基本都是網路上各種零碎搜索到的,一直苦於沒有找到一個詳細講解瀏覽器如何工作的文檔或資料。不知道有沒有大神知道能夠推薦一下?其實因為不僅僅是學好css學要了解瀏覽器工作原理,寫好html,尤其javascript同樣非常重要。

第六個是「重拾css樂趣」。這個演講也非常精彩同時趣味性十足。確實相信很多朋友都有用css畫圖形的經歷,包括我在內,甚至我github上還有一個當年第一次知道三角形怎麼畫出來後寫的一個「arrow」示例repo。整個演講真的是做到了帶領大家找回對css「最初的悸動」。演講最後了兩個例子也非常精彩,也很有指導意義。最後就是我覺得我應該把推薦的那三本好好讀一下…因為我學css一本書正經書沒看過,聽魔法說他當年把市面上所有css書買回來看一遍,就只能對自己說「你不弱誰弱」了…

第七個是「移動下的css布局」。這個演講給我印象最深的是margin top/padding top的那個屬性。這個我真是聽說,平時沒發現。看微信群里有人說這是常識我又自我批評了一下…其他的也談到了vw,vh新單位,還有flex,media query,大部分自己都算是了解,就不再展開談了。

最後一個「中文排版需求」。聽完我只覺得研究文字怎麼這麼好玩兒!我之前對於字體的認識也就是襯線和非襯線這水平了,沒想到還有那麼多講究在裡面,更別提對什麼宋體,黑體,仿宋楷體的追本溯源了。這裡面這麼多學問真的可以用讓我大開眼界來形容,新世界的大門open。我已經決定一定要讀一下《西文字體》,好好學習一下字。我覺得這是最讓我被驚艷到的演講,因為裡面提到的字的知識真的太美了!很遺憾結束後沒能和劉慶老師認識一下當面討教,只能微博默默關注學習了。

總算是都寫完了,手機碼字兒好痛苦。有理解或者認知上的錯誤希望大家指正。

最後再談一下自己對技術會議的感受吧。這算是我參加的第二個大型的技術活動,第一個是去年的d2。d2人更多,也因為自己第一次參加技術活動沒有太認真聽。這一次算是一天下來都在認真聽大牛們在台上分享(除了中午那會兒天外飛仙了)。來的目的很簡單,一是聽技術分享,看看大牛在做什麼,大公司在做什麼,不至於自己「閉關鎖國」,做井底之蛙。二是希望能夠認識有相同熱情的朋友,甚至是大牛,能夠在以後也能經常交流探討,持續的向他們學習。對於目的一算是基本達到了,而目的二隻能說隨緣了…(大家都很忙)也有自己不太放得開去主動認識更多的朋友的原因,雖然好多微博大v大牛都來了,還是沒能上前當面叫談認識下自己也是蠻慫的…這個時候多麼希望自己是個花枝招展的姑娘啊,然後就自帶社交屬性了…

總的來說收穫還是很多的,組織者花費了很多心思和勞動來給大家提供這樣的機會真的是要非常感謝他們,關鍵是免費還管中午飯還發那麼多書獎品,為他們點贊吧!


中國第二屆CSS Conf總結

面基約哪最合適?當然是css conf !

一是可以面基,二是開個大會見面不至於尷尬,還有東西可聊。所以聽的時候可認真了。

很多沒來的朋友聽說黃薇老師講的特別贊,要我給他們再講講,不過我也不可能情景再現,就把我知道的,還記得的記錄下吧!方便那些仰慕黃薇老師的小夥伴們~

首先,黃薇老師開場給我們看了兩個動畫,一個是30fps,一個是60fps,兩個都很好,但是60fps的更好。(fps:frames per second 每秒幀率)

關於fps: https://frames-per-second.appspot.com/ which is better?

What is Frames Per Second (FPS)? what is fps?

所以如果我們想要做到「絲質順滑」的動畫,就要達到60fps,那麼意味著我們只有16.7ms(1000/60)來繪製會每一幀,如果我們使用setTimeout或者setInterval來控制繪製那麼問題就來了。

首先,這兩個計算延時的精度都不夠。延時的計算依靠的是瀏覽器的內置時鐘。而時鐘的精度又取決於時鍾更新的頻率(Timer resolution)IE8及之前的IE版本更新間隔為15.6ms。假設你設定的setTimeout延遲為16.7ms,那麼它更新兩個15.6ms才會延時觸發。這意味著無故延遲了14.5ms;(15.6*2 - 16.7 = 14.5 ms);

那麼即使我們假設setTimeout 沒有延時,甚至能把時間縮短至16ms,會發生什麼呢…

在22s時丟幀了。所以我們的渲染時機要怎麼選擇呢……?

答案是:requestAnimationFrame

為什麼是requestAnimationFrame呢?因為它可以自動調節幀率,降低幀率總比丟幀好吧…

關於requsetAnimationFrame:Window.requestAnimationFrame()

中文版:window.requestAnimationFrame

(算了我不記得順序了,想到什麼說什麼吧… = =)

那渲染時機我們已經解決了,接下來就是渲染過程。

我們通常寫的代碼並不會所有都顯示在屏幕上,瀏覽器會根據需要生成自己的render tree

圖片來自:瀏覽器的工作原理:現代網路瀏覽器幕後揭秘

簡單來說DOM Tree 和 Render Tree的區別就在於沒有了header

好了!拿到了Render Tree之後瀏覽器就要開始繪製了!

瀏覽器繪製也有三個過程:

當我們的動畫觸發的越早,代價就會越高。

黃薇老師分了三部分講:

首先是layout:

就像畫畫一樣,我們首先要畫個框框定個位置,然後慢慢的填補細節最後組合成一幅圖。layout做的就是畫畫的第一步:草圖(定位)

觸發layout有這麼幾種屬性:width,left,margin,display,border…

我們經常會做這樣的動畫,一個矩形向上移npx,如果使用position,left來實現動畫,那麼每走一步就會觸發一次layout,這樣的性能非常不好,解決的辦法就是用translate來控制元素的位置。因為這樣就不會觸發layout。

為什麼translate會快呢…因為他開掛了!他走的是GPU,如果將CPU和GPU的繪製速度做對比的話,那麼CPU就是一筆一划慢慢畫,GPU就是蓋章蓋章蓋章。

那我也想這麼快怎麼辦!那就要盡量避免觸發layout和paints階段。在有必要的時候觸發composited,開啟硬體加速吧!

通常人們會用這些屬性來強制開啟硬體加速:opacity,translateZ(0),translate3d(0,0,0);

但是也要記住:是在有必要的情況下! 不能濫用。

關於will-change: will-change - CSS

關於will-change中文版:will-change - CSS

關於觸發layout, paints, composited的CSS屬性請參考這裡:https://docs.google.com/spreadsheets/d/1Hvi0nu2wG3oQ51XRHtMv-A_ZlidnwUYwgQsPQUg1R2s/pub?single=truegid=0output=html

參考:Jank Busting for Better Rendering Performance


如果你不牛逼,就算你認識再多牛人,都跟你無關。


額……被 @i蒹葭從風 邀請,然後又被 @徐飛 給AT了……然後知道了知乎上有這個話題……

=========================================

說一點點個人的感受吧,關於會議上的內容,我聽的不是很多,關心的也不是很多,原本過去只是想多關注一下中文排版的分享。對於頁面的文字排版個人感覺還是挺有意思的,然而現在CSS在中文排版上存在著很多不足,感謝為中文排版而努力的同學。

昨晚洗澡的時候大概回顧了一下,然後洗完就趕緊稍微記錄一下,打算寫一點流水賬……

----------------------------------------------

關於會議的內容,原本打算聽一下字體排版的分享後就可以的,不過很意外的被 @CSS魔法 的分享給感染了。對於CSS而言,在早之前有人問我為什麼要一直寫CSS之類的,我除了說明一下自己笨,不懂程序以外,另外就是我會說,CSS好玩,就像七巧板可以通過幾個不同的屬性來拼湊出各式各樣的效果。

--------------------------------------------------

最後,通過這次大會,又見到了不少來自遠方的朋友,還是挺開心的看到那麼多大牛中聊天,雖然有幸旁聽,不過還是膽顫心驚的,聽不懂啊……


作為一個前端菜鳥,來參加這樣高手雲集的大會,真是開闊眼界~~

第一部分:與技術無關的……人生體驗

  • 當颱風要來的時候,上海的室外氣溫還是蠻舒適的。

  • 會場在虹橋國際會議中心,這是一個舉辦大型室內會議的專業場所,因此空調非常給力,我的關節炎發作了好幾次。
  • 當一個微信群的人數達到500人時,裡面一定有好幾隻土豪(這裡的土豪特指那種喜歡發紅包的生物)。那麼這時候安卓機+移動2.5g就明顯跟不上土豪的節奏了。所以,要換4g,馬上換!
  • 妹子程序員原來都是去寫CSS了啊,哈哈哈哈哈哈哈哈哈哈。以後互聯網公司在招男程序員的時候可以添加這樣的文案:「我司女生上廁所都是要排隊的。」
  • 關注拉鉤網微信公眾號後,他們送了一個綠色的紅包,嗯,綠色的紅包。。。裡面一張綠色的人民幣。就不能有點紅色嘛!!!
  • 關注了又拍雲公眾號後,抽獎只拿到一個滑鼠墊。可是我並不用又拍雲,也不用滑鼠墊,下一步要用七牛雲存儲,所以打算去玩玩七牛的遊戲。但是當我看到他們的攤位上面放了幾張表單時,我就打消這個想法了……
  • 午飯……我沒吃飽。但畢竟是免費的午餐,哈哈哈,還是很開心的。

第二部分:技術體會

  • 手機淘寶CSS實踐啟示錄:可以把這本書弄來一讀:《靈活web設計》(Flexible Web Design)
  • W3C CSS Checker: 以Mike Smith的語速,這個對我來說其實不用翻譯,不過翻譯的存在倒是增加了不少樂趣。之前寫CSS基本不會去進行校驗的,以後可以關注下。另外,就是了解到Firefox的引擎Gecko正在重寫中,新引擎的名字叫做Servo,而為了寫這個新引擎,Mozilla的工程師們發明了一個新編程語言Rust。Smith覺得現場知道Rust的人遠遠沒有達到他預想的數量……也許國外的程序員真的是很厲害呢。

  • 企業CSS應用

  • CSS預處理器

  • 美女程序員做的那個高性能CSS動畫的分享太贊了。之前自己對瀏覽器重繪、重排也只是停留在「聽說過」的層面,現在對這倆概念的認識要更深入了。PS:重繪、重排也是很多面試官喜歡問的基礎問題。
  • CSS魔法,主旨是回歸CSS本身。也確實,一整天下來,都是在講工作流、工具,又是less,又是postcss的,反而不去關注CSS本身,這次大會要是沒有這個演講,就不用叫CSS Conf了,而是可以叫做CSS Tools Conf。這個分享讓我想起來兩年前,我剛開始進入前端領域的時候,總是很喜歡拿瀏覽器調試樣式,看各種不同的效果、動畫。這就是CSS的樂趣吧,縱然CSS的設計有這樣那樣的能力不足,但CSS+HTML可以說是目前最好的UI解決方案了。主講人的有一句話很勵志:「為了學習CSS,我把當時市面上所有的CSS書籍都買來讀了一遍。」是吧,這樣的人,不牛逼沒天理。當然不推薦現在的同學也這樣做,因為那時候的CSS書籍還是要少一些。現在,市面上太多濫竽充數、粗製濫造之書了,買來都沒法擦屁股。
  • 移動下的CSS
  • 中文排版需求,做這個分享的人是設計師出身的,感覺他的知識面跟普通程序員確實不一樣,其對中文字體的歷史沿革也都有研究,而且還能與日韓越、西文進行對比,這個就是「純」程序員了解比較少的了。所以感覺這個分享也非常好。以後的開發者大會,也許可以邀請一些後台出身、設計師出身、美工出身甚至市場、運維等等領域的朋友來分享一些交叉領域的東西,大有開闊眼界之感。

當然啦,我現場還是記了不少筆記的,但,真的只是一句一句的碎片而已,完全不成體統。不過出於習慣,還是把它貼到自己的博客里了:2nd {CSS} Conf 參會筆記

第三部分:隨手拍

圖1: 會場外的各種廣告牌

圖2: 大會開始前的會場

圖3: 這個是在散場後拍的。感覺攜程很有錢的樣子啊

圖4:這並不是我拍的,而是從現場的微信群里保存下來的。CSS魔法推薦的「目前CSS領域最值得一讀的書籍前三名」。回家後立馬下單買了中間那本《精通CSS》,後面那本的話,等引進吧。


中國第二屆CSS Conf總結 會議的總結資料會在這裡統一公布。

目前所有演講資料已經更新完畢,包括視頻!


說一些和技術不相關的內容,在基層醫院做醫生十餘年,參加了很多醫療技術會議,而今年參加了好幾個互聯網技術的會議(sf杭州,phpcon,還有這個),吐槽一下異同:

1、演講者的年紀與技術讀解能力

互聯網技術會議的講者都非常年輕,除了年輕之外,對於技術的讀解能力非常強,都能形成自己的觀點和思維體系,並用合適的方法表達出來。

對比於醫療的會議,能夠有能力這麼講,或者說敢這麼講只有醫療專業委員會的主委級別的了。年輕的講者也有,但是鳳毛麟角。

究其原因,對於醫療技術,在大部分醫院大家做的可能非常多,但是獲取信息的渠道相比而言就要窄,加上發展歷史,交流與共享文化貧瘠是根本。

2、掌聲很誠摯

這個是最直觀的感受,CSS Conf的掌聲的頻次和誠摯程度是目前為止感受最強烈的:大家對於技術的渴求,對講者的感謝!

而在醫療技術會議上面,同一個專業的會議,每年不同地區都有會議,但一方面也是由於醫療技術的迭代相對穩(huan)定(man),另一方面受限於剛才講的第一點,在會場難得有出現這樣的掌聲。

3、小禮品的創意程度

sf杭州的那次是拿的最瘋狂的一次,抱枕、傘、T恤、杯子等等,剛剛上面看到還有短褲和人字拖,看來錯過了。猜想一方面是由於互聯網公司本身就有這種文化的資源有關係,另一個方面也是醫療行業的行業敏感性,特別在公共領域是比較忌諱出現醫藥公司的標誌性物品有關。

準備上班去了,會議的技術內容是非常非常實用的,感謝 ~


第一,作為剛進前端的菜鳥聽大神分享大多數都沒聽懂,慚愧。

第二,妹子好多,阿里的好多,大神公司的好多

第三,多個電視照顧看不見大屏幕的人,很贊

第四,微信群真的很耗電量啊!!!我早上沒電了,中午充個電,下午又轟炸沒電了

第五,在微信群一共差不多搶了十塊錢算不算,哈哈


十點多起床,十二點到,和未蒙面的基友和老同事去吃了個火鍋,三點回來,進去聽了一個小時。出來和叔叔本來是要華山論劍的,結果吐苦水互黑。議題結束開始抽獎,我進去拿了書包就滾了。

雖然沒聽多少,但感覺乾貨應該不少。再補 slide 和視頻罷。最開心的就是見了很多基友、黑友、老友和新朋友,看到大家,說說笑笑,最 happy!

總結:悄悄的我走了, 正如我悄悄的來; 我揮一揮衣袖, 不帶走一片雲彩。


1. 本來應該老老實實的作為聽眾坐在後面,還是忍不住拿出相機,然後拍到一隻非常非常漂亮的手。拍完之後我就後悔了,為啥不現場問一下聯繫方式呢?為啥不。。。死要面子害死自己呀!

2. 用手機拍到一張貌似哇鼻孔的皂片,然後擴散出去了,希望不要挨打。

3. 聽說很多知名的前端是設計師出身,像我們這樣的沒有半個藝術細菌的頓時重新認識了前端界、也改改變了很多對設計師的成見。

4. 會後搶到不少紅包,最大的一個紅包來自某付寶。

5. 微信聯繫人暴增,平時半年都不加幾個人的,說的最多的一句話是:「你好,我叫xxx,小明」。好像他/她們都不知道「小明滾出去」這個段子。

5. 悄悄的在微博上面關注了講字體的那位分享者。

6. 拍了一張會後的合影,可惜我只帶了50mm的定焦頭和,需要站得很遠很遠才能把所有人都裝進去。而且還不能把自己也放進去。


大會很好!主辦方做的也很不錯,純公益性質的。

講座和大會,知識帶領我們開拓思路,更多地東西還要我們在實戰中去領悟!

一、講座中好幾個講師提到單位,關於單位的用法,我之前博客也寫過:CSS的單位及css3的calc()及line-height百分比 ,單位中提的最多的是rem,我們公司也用rem。

但是大家在rem實戰中有沒有遇到過問題?

什麼問題呢?就是rem單位是計算出來的,有的瀏覽器第一次載入的時候,字體可能很大!刷新瀏覽器就會變好![因為這種情況在谷歌調試器中出現的概率較大,安卓和ios真機中出現概率較小]

所以我們的解決辦法是,在經常出現的地方,把原本來的rem單位改為px,就可以了!

不知道使用過的同學遇到過類似問題沒有!

關於截圖,因為我剛剛刷新了幾遍,沒有出現,等出現了截圖給大家!項目地址 房價點評網 房價走勢 房價評估 房產估價網

二、另外,自己感覺講座中的幾個讓我受啟發的是展新的「屬性優先原則」,但是細細思考,他之所以用屬性優先原則,是因為他的項目是angularjs,使用過angularjs的同學都知道,angular是mvvm的,html結構中屬性很多,什麼ng-model了等等,因此,他的屬性優先原則,很適合他的項目,但是不一定適合你的項目!

三、美女css動畫的錄製分析,我之前還真沒有用過!點贊!

四、給css魔法點贊,(坐我旁邊的小夥伴剛剛要走,聽到css魔法的演講不走了!)


1:千萬不要坐在空調直吹的地方,不然凍成汪。當然,哪怕不是坐在空調直吹的地方也有可能汪,比如今年的sf杭州場前端分會場那天……所以最好自帶外套,萬一忘了(你說我咋沒長記性呢……),備選方案:拿個100offer靠墊墊背,贏個coding抱枕捂肚,再摟著身旁的漢子or女漢子取個暖(咳)

2:要用4g卡or用WiFi,搞個微信搶紅包神器,不然就會發生這樣的情況:裕波發紅包抽獎——小夥伴們搶完紅包,獲獎人士上台領獎——我的微信才把啥都不剩的紅包刷出來,滿臉心酸

3:其實我好想湊上去跟大神女神們套套近乎啊,可惜咱這麼內斂的娃怎麼好意思呢,於是就在邊上看著大神女神們聊得天花亂墜虎虎生威(?),卻不敢上前——因為咱還沒把大神女神們認全啊,萬一發生大漠貘大魔法哥傻傻分不清、沖大漠叫貘大找魔法哥簽名圖解css3……我會不會被大神們封殺呀?不過hax是不會認錯的,畢竟特點這麼鮮明(咳)

4:終於知道為嘛之前參加的那些沙龍分享會啥的里的妹子那麼少了(其他的沒太關注,就記得今年上海sf場男女比約為20:1~25:1……這還是算上了主辦方自帶的五花肉,真心酸),原來妹子們都在寫css啊!教練我能不能洗點js重點css技能樹?

5:之前參加sf啥的已經領了文化衫、傘、本本、杯子滑鼠墊等等東東,這次又拿了個coding的褲子……如果再把coding的人字拖也拿到手,一身齊全,整個夏天都不用買著裝了……不過話說回來,人字拖什麼的當禮品真的萌大奶?感覺好奇怪,恩,太接地氣兒了……

嘛,總的來說就是仨字兒:新技能get? 尤其是黃薇女神講的css動畫這一塊兒,讓我刷新了對css的認知(從此以後誰在說css簡單我就拿這事兒去問他:"哎你知道聲樂分幾種唱……咳,你知道瀏覽器渲染頁面有幾個過程嗎?")

基本上就醬了(o(╯□╰)o畢竟我是一個人爬過來的……孤孤單單的,求基友和姬友啊~)。其他的一些好玩的事兒貌似都在微信群里了,比如大家爆料民工叔帶著一個妹子離開了,民工叔又帶著一個妹子回來了,五花肉看完微信群後氣勢洶洶的跑來現場找民工叔了(咳……等等,雖然我是開玩笑的說,可難不成五花肉醬真的是因此才來現場的?)……


我表示無望!!


希望這樣高水平的大會可以經常舉辦呀,這樣我們前端菜鳥也可以領略一下大神的風采,順便了解前端發展方向


據說這次大會的內容很棒!沒能去真是很遺憾…


湊個熱鬧.. 跟公司(Teambition... 自帶廣告...)前端同學一起去的,

我特意拉學了點 CSS 的設計師妹子一起去, 結果同行 8 個人居然有一半女生

大會聽起來還是有點壓力, 設計師妹子聽完上午就走了, 好可惜

因為是贊助公司, 特意留意了下門口展位, 密密麻麻都是人在搶獎品

就看 Coding, 又拍雲, 100offer, 七牛他們發禮品打廣告真的玩瘋了

我們市場的同學出了點意外來晚了, 總之風頭都被邊上展位的妹子們搶了

小 Tip 是下次參加會議請提早準備好充電寶, 還有提早買好流量, 準備好刷微信

我周五加微信的時候裡邊都兩百多人了, 熱鬧得不行, 民工叔叔 @徐飛 八卦好多

跟 深JS 那次對比, 微信群紅包也太多了點.. 體驗各種刷屏, 人數撐爆 500 上限

還有留意下會場插座的位置, 手機沒電也沒充電寶的話就指望插座充電了

依然跟 Strikingly 的達峰聊了 React, 感覺 React 還沒滲透到 CSS 大會有待努力啊

寸老師來的時候我在聽奇舞團講調試動畫的分享, 感覺質量好高, 就是太長好累

等到聽完才出去找寸志聊天, 為什麼我覺得他就一直是在外邊聊天沒聽過分享的,

他剛來的時候說在門口, 我出去的時候也在門口看到他跟民工叔叔聊天...

跟著寸老師見了仰慕已久的一絲姐姐還有張雯莉. 聊天的機會沒找到多少

我現在是 Clojure 社區的人了, 發個鏈接證明一下 http://clojure-china.org/

對 CSS 興趣不太大, 更多是希望公司同學多學點東西, 但是聽說有妹子聽睡著了..

我平時寫 CSS 都是 Chrome Workspace 自動生成的, 各種花哨的東西不想用

CSS Checker 由於我的 CSS 大多生成的, 並沒有興趣, 對 Rust 除了 LLVM 也沒好感

不過奇舞團那個分享真心不錯, 渲染過程各種 trick 也是解決奇葩 bug 必備良藥

栓蘿蔔的棍子...名字好長..的 mcss 好深好燒腦, 講得真好, 只是不在興趣點上

其他的演講, 有查 bug 漏掉的, 也有在外邊聊天漏的, 於是沒有聽全

比較喜歡的是最後一個劉慶(@Eric Liu)的字體排版, 前身今世之類的

網上關於字體的討論通常散亂, 少有脈絡, 更沒有這個分享那麼樣深入和連貫的

作為開發者, 補上這樣一堂課, 我感覺真的挺值的了, 感謝主辦方感謝演講者

另外就是會場的電視有點... 有多少同學仰著頭, 脖子累酸了, 結果累到睡著的, 自覺點贊

那些看不清的東西還是等視頻出來回頭翻一下, 還是挺有收穫的

貌似沒看到提前公布視頻幻燈片地址什麼的, 慢慢等了


明天颱風 天,早起。。。

-----------睡飽了回來更新-------------

筆記:

我的筆記是只有關鍵字的那種。。。我實在不好意思貼。。。

大會印象:

#注意,我要開始夸人了~~~

裕波 大大真人和照片完全不是一個畫風啊,要不是他在群里發過語音,完全認不出來啊,然後他拿起話筒剛開始說話,就聽出來了,聲音識別度好高的;

勾股 大大的髮型真不錯~藍色的上衣也好看~颱風很好,hold住了全場~

Mike童鞋和蠻拼的字幕組-高博大大的配合,怎麼說呢,「點個贊」翻譯的特別好!qa環節有個小夥伴問了蠻長一段技術問題(4連句好嘛)。。。字幕組淡定地應對了~

展新大大發言帶有些許廣東口音,和我一起來的一個小夥伴愛死這個味道了;

拴蘿蔔的棍子 聲音好聽講起話來抑揚頓挫地~

講css優化的女神瓜瓜--前端妹子的典範!強!人美!聲音甜!愛笑!請用一切美好的詞誇她~

css魔法:講的多好我就不說了!小夥伴們你們發現了嗎?魔法大大他不是「手握」話筒,而是「手執」話筒!演講功力可見一斑!

米粽粽大大長得很帥~

劉慶老師講課很生動,一邊笑一邊就長知識了~

上午看到了民工叔,民工叔穿深色衣服,和上次sf杭州站的白色襯衫是完全不一樣的氣質(辭彙貧乏,自己體會哈)~下午看到了hax和winter,賀老聽課好認真~winter前輩帶了一把扇子,小夥伴們都表示此乃合影利器,目測會成為爆款。

以上,如果有說得不恰當的地方各位大大擔待哈~~

這兒其實還有很多大神在那兒,只是中場時間緊,沒時間東晃晃西晃晃地看大神~

接下來,純水。。。

由於種種原因,我和另外倆小夥伴(一個叫土豪K,一個叫小童D)前一晚各自只睡了三五個小時(並不是加班,是參加了一個飯局),今早六點出門趕火車。。。在火車上已然困成doge。。。下了火車出了地鐵,不靠譜的小童童鞋信誓旦旦地要給我們帶路,然後我們就走錯一條街,後來土豪拿出手機開始導航,我們原路返回。。。小童童鞋很憂桑,因為我的電腦包一路是他幫忙背的,他把自己坑地不輕。。。

路上我們經過兩處鞋城的大樓,各種感嘆鞋城真有錢!

再後來就到來會場,簽到的地方好多人,土豪和小童一眼認出了大漠,我有些臉盲,看誰都臉熟,看誰都叫不上來(捂臉)。

必須得說一說貫穿全天激動人心的搶紅包環節!要麼搶不到,搶到就是一分的!土豪用他的6p把回程票都快賺回來了,我和小童兩個安卓用戶只能默默刷聊天記錄。。。看到紅包都不再激動!

雖然木有搶到紅包,氮素!「朕心寒之極」大大現身大會,土豪幫我拍了與寒之極大大的合照,有好幾張,目測可以做個gif!

這是我第一次參加國內這種頗具規模的分享會,得知業界許多大神都會粗線,足足激動了兩個星期。。。另外兩個小夥伴也很激動,他們表示css大會肯定比其他大會多許多妹子,果然~上午結束的時候女廁所排隊了。。。。。。。。。。。。。。。。。。。。

回程:

D小盆友第二天要搬家,所以我們一開始就計劃好當天來回的。。。傍晚拍了一張合照就匆匆回去了。。。說到那張合照。。。我們仨都被擋得嚴嚴實實(此處應有表情)。

然後在虹橋火車站等車的時候,紅包群又開始發紅包。。。我們仨都快沒電了。。。土豪的索尼移動電源愣是被我的爪機充幹了。。。

由於颱風的緣故,回杭的班車晚點了,還改了兩次發車時間,挺擔憂的,怕回不去了。去廣州的好多班車都停運了,遠道而來的小夥伴真可憐。。。

最後在火車上我們學會了唱《不可說》。。。不要問我是怎麼學會的。。。

THE END, THANKS!


推薦閱讀:

看自己幾年前寫的代碼是怎樣的一種感受?
比女朋友長的漂亮是怎樣一種體驗?
參加星辯是一種怎樣的體驗?
有一個智障傻逼但是又可愛的女朋友是一種怎樣的體驗?

TAG:前端開發 | CSS | X是種怎樣的體驗 |