前端的完全学习基础就是1——3若要接着升到中级,则需要考虑4——6。
如果需要接着升级7到10.
- HTML
HTML5新特性 , 浏览器的标准模式和怪异模式, xhtml和html的区别, 使用data的好处, html模板语言, IE6 bug和一些定位写法, 渲染知识, 标签, meta
-
CSS
动画, 布局, 响应式设计, 预处理器, 命名方案, UI框架, 选择器, 小知识点, 盒子模型 -
javascript
基础的概念:页面渲染原理,白屏,async,defer
重要概念:原型链,函数指针this,作用域,闭包,时间冒泡,异步队列
ES3-ES5:数据类型,运算符,流程控制语句,函数,内置对象,定时器。
Dom操作
BOM:history, location ,navigator ,localStorage, cookie
较为新鲜的知识:
ES6:promise ,新特性以及如何区分ES6和ES5,let和const的优点,箭头函数,以及他的this,generator是什么,async/await实现原理, ES6和commonjs模板化规范区别。
其他编程语言:TypeScript
Web Worker -
框架与工具
Vue:组件—Vuex,Vue router,nuxtjs。 虚拟Dom
React:React Native, Reactjs
Angular
jquery和 Zepto
lodash与 Underscore -
开发与调试
开发工具:Vscode, Webstorm, Sublime, Chrome调试工具的使用,Git&GitHub的使用,markdown写作。
单元测试:Mocha
数据模拟:mockjs, Easymock, swagger.
功能测试:nightwatch -
工程化
打包工具:Webpack, parcel, Gulp, Browserify
转译工具:Bbbel. -
模块化
分三个部分:AMD, CMD, CommonJS -
HTTP与HTTPS协议
请求:GET, POST, OPTION
响应:2xx,3xx,4xx,x
报头:普通报头,实体报头,请求报头,x响应报头
版本:http1.0 http2.0
请求方式:XHR, FETCH
策略:还可以接着分:同源策略。跨域:CROS,JSONP,FETCH no-cors -
优化:可以分搜索优化,性能优化。
搜索优化:Web语义化,SEO
性能优化:网络性能优化,图片优化,JS和CSS优化----压缩
协议层优化,存储优化。
存储优化:本地存储,缓存{浏览器缓存机制,H5离线缓存}。
本地存储:localStorage,SessionStorage,Cookie.
浏览器缓存机制:Cache-Control, Expires, Last Modified
H5离线缓存:Manifest file
之后的离散知识:1后端知识。2移动开发。3监控与分析。4安全性 5软实力
- 新技术
后端知识: 1python. 2java 3php .4NODEJS:框架{express,koa},同构,架 构-----Restful.
移动开发: 微信小程序开发,H5页面开发
监控与分析:异常监控 ,格式监控 ,性能监控,网络监控 ,日志监控
异常监控:Fundebug,Betterjs.格式监控:EsLint,Jslint,JsHint.性能监控:WebPageTest,PageSpeed,PhantomJs,Chrome Tools.
网络监控:Fiddler,Charles
日志监控:LogRocket,LogLine
安全性:XSS攻击,Clickjacking攻击,CSRF攻击,Cookie劫持。
软实力:结构化问题,STAR原则,SMART原则。
新技术:WebAssembly,Material Design,WebRTC .