利用purecss和zepto构建响应式网站

目前打算推出一个针对pc和移动端的响应式网站，花了点时间考察了下目前的各类方案。做游戏开发时间太长了，没想到短短几年WEB前端技术已经突飞猛进，选择实在是太多了，最终列出几个组合方案：

1. bootstrap + jquery：扩展组件和js组件够多，引用的js库体积偏大。
2. vue + vue扩展组件库：vue是MVVM框架，抛弃传统js库直接操作dom方式，使用数据绑定方式更新UI，也可以加入router等模块，直接在单一页面完成整个展示.
3. react全家桶：类似vue，用过vue基本可以无缝切换到react。
4. purecss +zepto：足够轻，可方便扩展。

最终我们选择purecss +zepto方案，主要是因为我们网站功能不多，偏重搜索和展示，而该方案有如下突出的优势：

1. purecss +zepto足够轻量，如果打包资源太大，无疑会影响首次浏览体验，而不管是直接引入bootstrap等等库，还是webpack打包库，对我们来说都太重了；
2. purecss对各类浏览器兼容性非常好，且zepto专为移动设备优化过，为微信开发css框架weui推荐使用；
3. purecss扩展性非常好，我不想为了一两个组件而下载一个几百K的库，自己扩展前端组件非常方便。

purecss是基于Normalize构建的，设置初衷非常明确，就是兼顾兼容，简洁，扩展三个方面。所以只包含：基础、栅格、表单、按钮、表格、菜单几个必用项。而使用传统的PNG或svg矢量图，我们统一使用icon-font来替代。其余需要的一些组件，比如分页，都是团队自己基于purecss定制开发的，也费不了多少时间。我们甚至在开发中，尝试导入bootstrap中部分组件，也能与purecss一起工作。而你仅仅需要做的就是引入如下几个文件而已。

其中pure-min.css是基础文件，grids-responsive-min.css是响应式网格框架，可根据需要增加。而涉及服务器端渲染部分，由于我们用的是express框架，使用pug（jade）模版的mixins来辅助完成。

现在很多前端团队，一直在追求最新技术。react,vue固然功能强大，不管是前端渲染还是后端渲染都他们的身影，但我想说的是，技术最终还是为了项目服务，不要为了技术把简单的事情复杂化了。就我们使用后的感觉，purecss其实已经足够大部分响应式网站前期使用。