brunch构建工具三、开发技巧、调试、UI框架设计

2015-2016前端知识体系

对应技术博客： ，博客持续更新中~

一、框架与组件  bootstrap等UI框架设计与实现  jQuery、zepto使用原理以及插件开发  mvc/mvvm框架原理设计，vue/angular/avalon等  polymer/angular2思想与设计思路  reactjs原理与使用  commonJS/AMD/CMD  loadJs模块化加载原理与实现  polyfill、shim原理与实现  virtual Dom、Incremental DOM  shadow dom  webwork与service Worker  ES6转ES5、Babel与ES6开发规范体系  Isomorphic JavaScript  双向数据绑定  browserify运行原理  performance timing  组件UI与js组件规范化  immutable JavaScript  generator与promise原理与使用 二、构建生态  grunt/gulp开发环境任务编写  npm、jspm、bower包管理工具  r。

js、browserify、webpack、Rollup打包工具使用  fis3构建与插件开发、构建环境、fis3构建离线包  web Component：rosetta-org、x-view、Q、riot、nova  brunch构建工具 三、开发技巧与调试  fiddler加willow基础组合调试  werien、vorlonjs远程调试seo模块的基础知识，chrome inspect  mockjs，F。M。S(Front Mock Server)模拟调试使用与cgi自动调试  macha/phantomjs/casperjs/karma测试自动化任务使用  自动化UI测试，海豚  node-supervior、node-inspector、karma  开发发布系统流程  sublime高效插件  代码自动化检查fecs 四、html、css与重构  jpeg、webp、apng、bpg图片  iconfont使用与实现原理  页面响应式设计  css重置  sass/compass/less/postcss常用语法与使用  media query与常见页面尺寸了解  em,rem原理与实现  code4ui、code4app、初页、maka等  css3动画  css网格布局  搜索引擎与前端SEO  浏览器缓存种类，resources,webSQL,indexDB, localstorage,cookie,app cache,cache storage  UI框架 五、native/hybrid/桌面开发  ionic移动开发方案  nativescript移动开发方案  react Native移动开发方案  android/ios原生开发与框架  桌面应用开发 六、前端/H5优化(另一个图已给出)  yslow、pagespeed  移动web性能优化 七、全栈/全端开发  express/node club + mongodb、thinkjs等框架  node。

js直出  实时web开发，meteor/express。io  MEAN(mongodb/express/angular/nodejs)  http与http2协议、bigpipe、pipeline  离线缓存seo模块的基础知识，cookie、localstorage、indexdb  cdn与dns 八、研究实验  WebAssembly、webTRC、typescript  Material design规范的前端框架  AMP-HTML规范 九、数据分析与监控  badjs数据上报  点击热力图clickHeat、heatMap  js加载失败优化方案  百度alog数据上报 十、其它软技能  axure 原型图设计  xmind脑图管理  效率管理  can i use、github  知识管理/总结分享  产品思维与技能 十一、前端技术网站  技术社区  行业会议

另外说明下，这里不仅仅是概念的罗列，过去也有些人有类似的总结，但是偏基础和概念罗列，没什么深度，这里有较多原理性的概述，博客有对应文章，较新热门的技术我的博客里也有很多，大家可以结合起来看，目前博客大概写了50%的总结文章。后面也会根据这个图去补齐我博客里的知识板块。

持续更新中，如果觉得不错，请点star支持下，甚至在您的团队里扩散下，谢谢~

项目地址：