前言:

在一个喜欢尝鲜的团队里面工作，总会碰到这种情况. 前一个项目用的这个框架这种构建，下一个项目就变成新的框架那种构建，上来就 blablabla 先学一通，刚觉得安心，接到个另外需求，到手一看. 又变了一套 T,T ， 又要重复上述步骤.. 如果能在各种框架和开发思路里面游刃有余，当然是最好的，可是多少总会对开发同学产生一些影响，那么各个框架之间的差异到底有多大呢？切换来去又会影响到哪些开发体验呢？且看我边做示例边分解…

原文地址

最近，项目用了 React，配套使用了 Webpack，毕竟热替换（react-hot-loader）吸引力确实高，开发模式下使用 webpack 构建其实也够用，并且相对 gulp-webpack 来说，模块的编译等待时间大大缩小，这是生命啊！ 发布时，借助 gulp 来进行其他方面的处理，如合图，打包等。或许把这些边幅修一修、支持下，Webpack 估计就要逆天了吧？

写在最前

我们都是前端工程师，无论你现在是页面仔，还是 Node 服务开发者，抑或是全端大神，毋庸置疑的是，我们都是前端工程师，我们生来就对追求页面的极致拥有敏锐的触觉，无论是页面实现方式的高大上、页面的极致的性能还是页面完美的展现，都是我们孜孜不倦的追求目标。即使这些在别人眼里，只是跟其他的页面一样没什么不同，但我们却能为其中那只有我们才知道的一抹别致而窃喜。

而今天我要讲的，就是我们最熟悉的老朋友，CSS。不讲枯燥的语法，抛开 js，让我们一起来看业务中那别致的纯 CSS 实现，让我们一起来追求那更好的页面实现，希望我带着你走完这段旅程后，你能收获一些惊喜甚至灵感。

做移动 web 页面，受移动网络网速和终端性能影响，我们经常要关注首屏内容展示时间（以下简称首屏时间）这个指标，它衡量着我们的页面是否能在用户耐心消磨完之前展示出来，很大程度影响着用户的使用满意度。

怎么获取首屏时间呢？

我们经常要先问自己：页面是怎么加载数据？

A：加载完静态资源后通过 ajax 请求去后台获取数据，数据回来后渲染内容

在 2014 年，W3C 公布了 service worker 的草案，service worker 提供了很多新的能力，使得 web app 拥有与 native app 相同的离线体验、消息推送体验。
service worker 是一段脚本，与 web worker 一样，也是在后台运行。作为一个独立的线程，运行环境与普通脚本不同，所以不能直接参与 web 交互行为。native app 可以做到离线使用、消息推送、后台自动更新，service worker 的出现是正是为了使得 web app 也可以具有类似的能力。

素材：

期望效果：http://v.youku.com/v_show/id_XMjY2NTc1MzYw.html

作为前端开发，或多或少都会接触很多前端构建工具，最近的业务使用到了百度 FIS 团队的 fis3，想和大家分享下我所理解的 fis3。

使用方法简单说

首先，你需要安装 node 和 npm

然后，使用 npm install -g fis3  命令安装 fis3，安装完成是这样的

表示安装成功。

然后我们可以通过 fis3 release -w 来对代码进行监听。

注：fis3 默认内置了 fis3-command-release 插件，提供了文件监听和浏览器自动刷新功能，在 release 的时候添加-w 或-L 参数就可以，这样可以很方便的部署代码。

当你需要使用插件的时候，可以用 fis3 install -g 插件名 进行安装。

        2015.12.12  由 AlloyTeam  团队发起的 <AC2015> AlloyTeam  前端技术大会，在腾讯大厦 2  楼多功能厅成功举办。 AlloyTeam 团队希望将团队在业务项目、工具和开源项目中的技术积累，借助 AC 大会 的平台将每一年的收获分享给业界同仁。

说到 websocket 想比大家不会陌生，如果陌生的话也没关系，一句话概括

“WebSocket protocol 是 HTML5 一种新的协议。它实现了浏览器与服务器全双工通信”

WebSocket 相比较传统那些服务器推技术简直好了太多，我们可以挥手向 comet 和长轮询这些技术说拜拜啦，庆幸我们生活在拥有 HTML5 的时代~

这篇文章我们将分三部分探索 websocket

首先是 websocket 的常见使用，其次是完全自己打造服务器端 websocket，最终是重点介绍利用 websocket 制作的两个 demo，传输图片和在线语音聊天室，let's go

  一、远观：认识 WAAPI

当我们谈及网页动画时，自然联想到的是 CSS3 动画、JS 动画、SVG 动画、APNG 动画等技术以及 jQuery.animate() 等动画封装库，根据实际动画内容设计去选择不同的实现方式。然而，每个现行的动画技术都存在一定的缺点，如 CSS3 动画必须通过 JS 去获取动态改变的值，setInterval 的时间往往是不精确的而且还会卡顿，APNG 动画会带来文件体积较大的困扰，引入额外的动画封装库也并非对性能敏感的业务适用。目前情形对开发者而言，鱼和熊掌似乎不可兼得，既希望获得更强大便捷的动画控制能力，又希望性能和体验上足够流畅优雅，如果能有一种浏览器原生支持的通用的动画解决方案，那将是极好极好的呢。