FEDAY第二届前端开发者大会回顾

使用React、Redux和Node.js构建通用应用

演讲者是来自Facebook的Stepan，他为咱们介绍了怎么样用Node和React、React-Router、Redux等技术，创建一个通用应用(Universal APP)或者同构应用（Isomorphism APP）。

历史

他先从2008年讲起，从那时的Rails包揽路由、验证和视图相关的工做，而JS则只用来写一点点貌似很酷（？）的动画。到后来backbone、ember、angular等等技术和框架的出现，JS已经能够作到解决路由、验证和视图等这些之前是Rails作的工做。

同构的好处

1. Code Sharing（代码模块能够共享）

2. Perceived Performance（有些脚本能够放在前端来执行，体验更好）

3. SEO（搜索引擎对单页面应用的收录还不够好）

代码示例

用一系列代码示例来解决了如下问题

1. View共享： react-dom的ReactDOMServer.renderToString()

2. 路由共享：client端用react-router的browserHistory, server端则使用 match 功能（服务器端作配置是为了解决浏览器端禁用 JS 后，页面还可否渲染出来的问题），server端和client端能够共用一套路由的配置文件，能够参照ServerRendering

3. 数据： 可使用redux等数据流的库，在服务端渲染时将data赋值给window.__DATA__

4. 初始化数据： 这里提到在一些须要拉取数据的组件里，封装一个fetchData的方法，而后在初始化应用时能够调用一个fetchAllData方法实现组件的数据初始化。介绍了一个isomorphic-fetch的库，能够在浏览器端和node端使用fetch api, 这样能够实现一个api封装的文件能够在server端和client端共用。

一些代价

1. 从各个平台迁移到node+react同构仍是须要作大量的工做

2. node是单线程的，能够考虑使用Clousure

微信Web APP开发最佳实践

演讲人是来自微信的江剑锋

微信应用使用Web APP的状况

有微信城市，微信搜索结果等

微信JSSDK

JSSDK给开发者提供了调用微信功能和手机功能的能力。
为何作一个静态页面，也须要进行服务端签名呢，这里JF介绍说主要是为了安全。
开发者可使用微信的测试号来测试（域名没备案也能够测）。
小提示：
签名失败的缘由，注意在取url加密时不要后面的hash，还有就是contentType注意设置为json

微信用户分布

能够看出使用2G网络用户有8%之多

X5内核

抹平不一样Android机型的webview差别，减小适配的工做量

目前的X5内核坑仍是很多的：

1. 缓存很严重，甚至html文件也会缓存，清理缓存有个黑科技：在聊天框输入//triggerWebViewCacheCleanup

2. flex布局部分不支持，不支持flex-wrap等，可使用老写法

3. 动画卡顿，伪元素不支持动画效果

4. 视频：controll控制条必须存在（产品层面考虑，防止用户没法关闭视频）；autoplay无效，能够用touchstarts事件触发；currentTime不许

5. 可能出现cookie或者localstorage失效，多是内存不足、进程被杀、微信主动杀或用户主动清理形成，能够多管齐下，同时启用两种方案

WeUI

快速打造一套微信风格的UI界面

微信调试工具

还提到了weinre

X5内核升级了

这个月底，微信X5内核将全量从webkit内核升级到blink内核，用户无须升级客户端版本就能够升级到最新内核，上面的坑基本没有了~

• 标准缓存

• 支持flex

• canvas支持css背景色

• filter:blur()有效

• 动画卡顿

• 伪元素支持动画

• autoplay有效

React Tips

演讲人是Fackebook前端工程师黄士旗。

Container Component

Flux Store & Reduce Store

Functional*

HOC高阶组件

High-order Components 高阶组件，本质上就是 Decorator 模式在React的一种实现，Debug友好

Composition over inheritance

RxJS

强烈推荐这个网址，https://github.com/ReactiveX/learnrx，学会了Rx以后你会发现JS原来还能够这么写。

如何提早运用下一代Web技术提高Web性能和安全

主讲人是陈子舜(PuterJam)。

一个常见的前端面试题

HTPP/2时代的Web性能