2015年技术总结_html/css_WEB-ITnose

此文章同步连接：  https://github.com/p2227/p2227.github.io/issues/2 # 2015年技术总结## 各个技术栈的实践* `ES6+babel` 的开发模式广泛应用在开发上，多了很多语法糖* `react` 组件化的开发，使得前端以往界面复杂，组合多的问题有了新的突破与解决* `redux` 函数式编程，能很方便地进行解耦与测试* `postcss` 应用于项目中，体会到一个all in  js的原则，连css/html都先经过js处理，再输出## 综合利用各种资源解决问题* 综合利用npm提供的集中的js插件管理平台，容易找到轮子，并且应用于自己的问题解决上* 综合利用不同的框架和库去搭建一个适配业务的框架，其实不管是`backbone+grunt`, `requirejs+ng`,  `react+redux+webpack`，各种组合，归根到底都是一些基础的html/css/js问题，一些业务逻辑的问题大都能自己思考解决。* 两个一开始独立开发的项目，到后期突然有需求要合并在一起，此时项目之间的通讯对接问题，就需要综合各种知识去解决了，除了前端，还有各种http的知识也要应用上。* 在做了差不多一年的手机项目时，也做了一个PC端的，发现因为前面有过[总结](http://www.cnblogs.com/p2227/)，很多东西能立马回顾起来。## 前端性能、缓存方面的突破在过去的一年里，项目组内综合了http缓存、manifest和webpack的hash指纹技术，制定出了一套webapp的按需加载，增量更新的打包方案。大大减少了webapp的二次加载的时间和更新的流量。其实我觉得还能综合利用localstorage技术去再做一步缓存。## 重视代码测试* 利用`mocha`,`Karma`等框架进行前端功能的单元测试，减少BUG重复出现的概率。* 要想用好react的组件化，测试用例也是必不可少的，否则你无法预测对通用组件的修改会否影响到以前的功能。* redux的引入，令到业务逻辑的测试非常简单。* 测试用例也是一个很好的API说明。一些库或者代码文档不全，源代码又不太好阅读时，看懂其中的测试用例也能很好地理解其中的功能。## 要有耐心、沉着地去写代码前端这一年，出现了很多新的框架与技术，当要应用到项目上时，总要有一段学习与尝试的过程。这段时间内需要掌握很多新的东西，这些东西往往不是一两行代码就会有效果的，而且经常会与原来项目中的东西冲突，需要自己去理解并想办法解决。所以一定要有耐心、不要老是想着“看看效果怎么样再说”，这样反而很容易把时间花在刷新、定位错误等重重复复的事情上。比如我现在要把redux引入到项目中，就一定要把store,dispatch,action,reduce等所有的东西都要引用进来，才会有效果，如果写一行代码又看一下效果，另外一行又想看，会导致事倍功半。## 未完成的东西因为实在有很多新的东西了，在这一年里面还有很多东西没能体验利用到*  `react-native` 利用js去写原生应用。 *  `react同构技术` 的尝试，利用js去写服务端的程序。 * 一个性能监控、用户行为收集的系统。前面既然写了一些缓存利用、性能提升的代码，那么这些代码最终达到一些什么样的效果，如何去量化这些效果呢，如果没有一个反馈系统，确实也是不好说的。 ## 最后的话以上是本人的2015年技术总结，希望在新的一年里面能有更大的进步！