資訊專欄INFORMATION COLUMN
摘要：使用和構(gòu)建通用應(yīng)用演講者是來自的，他為我們介紹了怎么樣用和等技術(shù)，建立一個(gè)通用應(yīng)用或者同構(gòu)應(yīng)用。開發(fā)者可以使用微信的測試號來測試域名沒備案也可以測。如何提前運(yùn)用下一代技術(shù)提升性能和安全主講人是陳子舜。一個(gè)常見的前端面試題時(shí)代的性能
使用React、Redux和Node.js構(gòu)建通用應(yīng)用
演講者是來自Facebook的Stepan，他為我們介紹了怎么樣用Node和React、React-Router、Redux等技術(shù)，建立一個(gè)通用應(yīng)用(Universal APP)或者同構(gòu)應(yīng)用（Isomorphism APP）。
歷史他先從2008年講起，從那時(shí)的Rails包攬路由、驗(yàn)證和視圖相關(guān)的工作，而JS則只用來寫一點(diǎn)點(diǎn)貌似很酷（？）的動(dòng)畫。到后來backbone、ember、angular等等技術(shù)和框架的出現(xiàn)，JS已經(jīng)可以做到解決路由、驗(yàn)證和視圖等這些以前是Rails做的工作。
同構(gòu)的好處Code Sharing（代碼模塊可以共享）
Perceived Performance（有些腳本可以放在前端來執(zhí)行，體驗(yàn)更好）
SEO（搜索引擎對單頁面應(yīng)用的收錄還不夠好）
代碼示例用一系列代碼示例來解決了以下問題
View共享： react-dom的ReactDOMServer.renderToString()
路由共享：client端用react-router的browserHistory, server端則使用 match 功能（服務(wù)器端做配置是為了解決瀏覽器端禁用 JS 后，頁面還能否渲染出來的問題），server端和client端可以共用一套路由的配置文件，可以參照ServerRendering
數(shù)據(jù)： 可以使用redux等數(shù)據(jù)流的庫，在服務(wù)端渲染時(shí)將data賦值給window.__DATA__
初始化數(shù)據(jù)： 這里提到在一些需要拉取數(shù)據(jù)的組件里，封裝一個(gè)fetchData的方法，然后在初始化應(yīng)用時(shí)可以調(diào)用一個(gè)fetchAllData方法實(shí)現(xiàn)組件的數(shù)據(jù)初始化。介紹了一個(gè)isomorphic-fetch的庫，可以在瀏覽器端和node端使用fetch api, 這樣可以實(shí)現(xiàn)一個(gè)api封裝的文件可以在server端和client端共用。
一些代價(jià)從各個(gè)平臺遷移到node+react同構(gòu)還是需要做大量的工作
node是單線程的，可以考慮使用Clousure
微信Web APP開發(fā)最佳實(shí)踐演講人是來自微信的江劍鋒
微信應(yīng)用使用Web APP的情況有微信城市，微信搜索結(jié)果等
微信JSSDKJSSDK給開發(fā)者提供了調(diào)用微信功能和手機(jī)功能的能力。
為什么做一個(gè)靜態(tài)頁面，也需要進(jìn)行服務(wù)端簽名呢，這里JF介紹說主要是為了安全。
開發(fā)者可以使用微信的測試號來測試（域名沒備案也可以測）。
小提示：
簽名失敗的原因，注意在取url加密時(shí)不要后面的hash，還有就是contentType注意設(shè)置為json
可以看出使用2G網(wǎng)絡(luò)用戶有8%之多
X5內(nèi)核抹平不同Android機(jī)型的webview差異，減少適配的工作量
目前的X5內(nèi)核坑還是不少的：
緩存很嚴(yán)重，甚至html文件也會(huì)緩存，清理緩存有個(gè)黑科技：在聊天框輸入//triggerWebViewCacheCleanup
flex布局部分不支持，不支持flex-wrap等，可以使用老寫法
動(dòng)畫卡頓，偽元素不支持動(dòng)畫效果
視頻：controll控制條必須存在（產(chǎn)品層面考慮，防止用戶無法關(guān)閉視頻）；autoplay無效，可以用touchstarts事件觸發(fā)；currentTime不準(zhǔn)
可能出現(xiàn)cookie或者localstorage失效，可能是內(nèi)存不足、進(jìn)程被殺、微信主動(dòng)殺或用戶主動(dòng)清理造成，可以多管齊下，同時(shí)啟用兩種方案
WeUI快速打造一套微信風(fēng)格的UI界面
微信調(diào)試工具還提到了weinre
X5內(nèi)核升級了這個(gè)月底，微信X5內(nèi)核將全量從webkit內(nèi)核升級到blink內(nèi)核，用戶無須升級客戶端版本就可以升級到最新內(nèi)核，上面的坑基本沒有了~
標(biāo)準(zhǔn)緩存
支持flex
canvas支持css背景色
filter:blur()有效
動(dòng)畫卡頓
偽元素支持動(dòng)畫
autoplay有效
React Tips演講人是Fackebook前端工程師黃士旗。
Container Component Flux Store & Reduce Store Functional* HOC高階組件High-order Components 高階組件，本質(zhì)上就是 Decorator 模式在React的一種實(shí)現(xiàn)，Debug友好
Composition over inheritance RxJS強(qiáng)烈推薦這個(gè)網(wǎng)址，https://github.com/ReactiveX/learnrx，學(xué)會(huì)了Rx之后你會(huì)發(fā)現(xiàn)JS原來還可以這么寫。
如何提前運(yùn)用下一代Web技術(shù)提升Web性能和安全主講人是陳子舜(PuterJam)。
一個(gè)常見的前端面試題 HTPP/2時(shí)代的Web性能文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/78980.html
摘要：前戲補(bǔ)上參會(huì)的完整記錄，這個(gè)問題從一開始我就是準(zhǔn)備自問自答的，希望可以通過這種形式把大會(huì)的干貨分享給更多人。 showImg(http://7xqy7v.com1.z0.glb.clouddn.com/colorful/blog/feday2.png); 前戲 2016/3/21 補(bǔ)上參會(huì)的完整記錄，這個(gè)問題從一開始我就是準(zhǔn)備自問自答的，希望可以通過這種形式把大會(huì)的干貨分享給更多人。 ...
摘要：建立該倉庫的目的主要是整理收集學(xué)習(xí)資源，統(tǒng)一管理，方便隨時(shí)查找。目前整合的學(xué)習(xí)資源只是前端方向的，可能會(huì)存在漏缺比較好的資源，需要慢慢的完善它，歡迎在該上補(bǔ)充資源或者提供寶貴的建議。 說明 平時(shí)的學(xué)習(xí)資源都比較的凌亂，看到好的資源都是直接收藏在瀏覽器的收藏夾中，這樣其實(shí)并不方便，整理在云筆記上，也不方便查看修改記錄，索性就整理在 github 上并開源出來，希望幫助大家能夠更快的找到需...
摘要：但是在不同的項(xiàng)目中不同的維度權(quán)重時(shí)不一樣的沒有統(tǒng)一的原則去解決一個(gè)問題要自身實(shí)踐來測試選擇原則妥適性原則避免過渡實(shí)現(xiàn)，暫時(shí)用一些，現(xiàn)在還可能用不到，或者用的不多庫來滿足當(dāng)前需求。 這個(gè)兩天看了張克軍（豆瓣前端專家、前端布道師）在FEDAY的主題分享覺得對中大型項(xiàng)目開發(fā)很有幫助所以在這里分享給大家后面會(huì)有視頻地址。下面介紹重點(diǎn)內(nèi)容。這里分享的項(xiàng)目是指公司實(shí)際產(chǎn)品開發(fā)，協(xié)同人數(shù)比較多，更加...
閱讀 1389·2021-10-11 10:57
閱讀 2105·2021-09-02 15:15
閱讀 1710·2019-08-30 15:56
閱讀 1260·2019-08-30 15:55
閱讀 1216·2019-08-30 15:44
閱讀 1037·2019-08-29 12:20
閱讀 1412·2019-08-29 11:12
閱讀 1129·2019-08-28 18:29
