前端开发需要具备的基本的技术栈:第一个以vue
、react为主的组件化开发,第二个以webpack
为主的工程化开发,第三个以node为主的全栈化开发。不管哪一个底层最底层的核心还是javascript
,所以学好js,掌握其底层运行机制才是前端开发中重要的知识点,而想学好js则需要我们跨过六座大山。
1.996 前端人如何持续学习
2. 如何对 P5/P6/P7 做职业规划和技术培养
H5与CSS3
1.开发中经常遇到的JavaScript问题整理(超实用)
2.阿里、腾讯最爱考的 JavaScript 基础手写题
3.字节跳动最爱考的前端面试题:JavaScript 基础
4.《大前端吊打面试官系列》 之原生 JavaScript 精华篇
js中的堆栈内存和闭包作用域,这里面包含了数据类型和数据类型转换以及我们的EC,ECtack
、我们的AO\VO\GO以及我们的堆栈内存以及我们的scope和scope Chain.
1.9种数据类型区别及相互转换
2.词法解析和变量提升
3.堆(Heap)栈(Stack)内存及垃圾回收机制
(1).图文并茂讲清楚 JavaScript 内存管理
(2).高级前端都会注意的开发细节
(3).由一道腾讯面试题聊聊 V8 引擎的垃圾回收
(4).高性能 JavaScript 引擎 V8 - 垃圾回收
(5).一文了解如何排查内存泄漏导致的页面卡顿现象
(6).前端常见内存泄漏及解决方案
4.JS底层运行机制:EC/AO/VO/GO
5.作用域(Scope)和作用域链(Scope-Chain)
6.闭包及其两大作用:保存/保护
7.高阶编程:惰性函数/柯理化函数/compose组合函数
8.BAT/TMD经典面试题深入剖析
9.jQuery源码解读 [ 基本骨架 ]
10.Lodash源码解读:函数防抖和节流1.coderwhy版2.珠峰版
面向对象程序设计。这里面包含了我们的构造函数,原型和原型链,以及this和函数的三种角色,基于面向对象设计插件和组件。
推荐阅读:
1.全方位剖析面向对象程序设计
2.构造函数(constructor)和 new 底层实现机制
3.原型(prototype)和原型链(__proto __)
4.函数3种角色及Function/Object的相互依赖机制
5.BAT/TMD经典面试题深入剖析
6.彻底搞懂this
(1).前端面试之彻底搞懂this指向
(2).This的5大场景及实战应用
(3).面试官:bind、call、apply 区别?如何实现一个bind?
7.call/apply/bind/instanceof/Object.create等源码剖析
8.JS中4大继承方案的深入解析
9.jQuery源码解读 [ 数据类型检测的封装及底层核心 ]
10.Lodash源码解读 [ 数组/对象的深拷贝和深比较 ]
就是我们的同步异步编程及浏览器渲染机制,这里面需要我们掌握同步任务、微任务和宏任务以及同步异步编程以及浏览器从头到尾的渲染机制以及这里面涉及到CRP
性能节点优化。
1.浏览器底层渲染机制
(1).浏览器渲染基本原理解析
(2).一名合格的初中级前端工程师需要掌握的浏览器渲染笔记
2.DOM树/CSSOM树/RENDER树
3.DOM的回流(Reflow)重绘(Repaint)及实战应用
4.BOM
面试官:说说你对BOM的理解,常见的BOM对象你了解哪些?
4.同步(Sync)异步(Async)编程
5.事件循环(EventLoop)和事件队列(EventQueue)
图解浏览器和 Node.js 环境下的 Event Loop
6.微任务(Microtask )和宏任务(Macrotask )
7.CRP关键节点性能优化(Critical Rendering Path)
(1).聊一聊前端性能优化 CRP
8.页面白屏优化之骨架屏技术(Skeleton)
9.BAT/TMD经典面试题深入剖析
第四座大山涉及到DOM
事件及涉及模式,这里面需要我们掌握事件,事件对象,事件委托相关的信息且能够了解DOM0
和DOM2
级事件绑定的本质核心区别
这个引发出我们js中常用到的设计模式以及在实战中的应用。
1.详细解读事件及事件对象
面试官:说说你对DOM的理解,常见的操作有哪些
2.DOM2级事件的核心运行机制
3.事件传播机制和事件代理
4.jQuery源码解读 [ JQ中的事件库 ]
5.观察者(Observer)和发布订阅(Pub-Sub)设计模式
6.单例(Singleton)和工厂(Factory)设计模式
7.代理(Proxy)和装饰(Decorator)设计模式
8.从零实现开源级插件组件封装DIALOG插件封装
9.BAT/TMD经典面试题深入剖析
10.京东放大镜、B站楼层导航、百度可拖拽登录框等多个经典案例
就是ES6+
的核心知识和源码分析,包含let、const这些基础知识箭头函数,解构赋值三个点的应用以及promise、asyncawait
、genrator
、iterator
进阶层面及源码层面的分析也是很重要的。
推荐阅读:
1.let/const和var的区别
2.箭头函数和普通函数的区别
3.class类和类的装饰器(Decorator)
4.Set/Map/WeakSet/WeakMap
Map 和 Set 两种数据结构在ES6的作用
5.Promise 和 Promise A+ 规范源码
(1)vue前端交互模式-es7的语法结构?async/await
(2)「一次写过瘾」手写 Promise 全家桶 + Generator + async/await
(3)8 张图帮你一步步看清 async/await 和 promise 的执行顺序
(4)我以为我很懂 Promise,直到我开始实现 Promise/A+规范
(5)Promise知识汇总和面试情况
(6)可能是目前最易理解的手写promise
(7)实现一个 sleep 函数,可从 Promise、Generator、Async/Await 等角度实现
6.Generator生成器和Interator迭代器
7.async/await及内部实现原理
(1)实现一个 async/await (typescript 版)
8.模块化发展历程:AMD、CMD、CommonJS、ES6 Module
9.Object.defineProperty和Proxy深度对比
(1)响应式数据的原理(双向数据绑定)[proxy和Object.defineProperty]
(2)面试官:你可以手写 Vue2 的响应式原理吗?
(3)美团面试官:你可以手写 Vue3 的响应式原理吗?
10.函数式编程和命令式编程
(1).函数式编程简述
11.ES6及其ES6以上的语法
JS语法 ES6、ES7、ES8、ES9、ES10、ES11、ES12新特性
推荐阅读:前端算法
推荐阅读
就是HTTP/HTTP前后端数据通信,包含了HTTP网络层面的知识不管tcp
的三次握手和四次挥手还是从我们http
、https
以及http1
.1和http2.0
之间 的区别,还是ajax同源策略请求还是跨域策略请求都需要详细学习。
推荐阅读 :HTTP常见面试题
1.HTTP1.0和HTTP2.0的区别
2.HTTP和HTTPS的区别
3.TCP的三次握手和四次挥手
4.DNS及DNS预解析(dns-prefetch)
5.强缓存(Expires / Cache-Control)和协商缓存(Last-Modified / ETag)
(1)前端缓存最佳实践
6.HTTP报文和HTTP网络状态码
7.XMLHttpRequest及内部核心操作
(1).面试官:Ajax 原理是什么?如何实现?
8.数据传输格式:FormData / x-www-form-urlencoded / raw / binary
9.Axios库及Axios的二次配置
(1)一步一步解析Axios源码,从入门到原理
(2)React系列十三 - axios库的使用
(3)面试官:Vue项目中有封装过axios吗?怎么封装的?
(4)面试官:你了解Axios的原理吗?有看过它的源码吗?
(5)学习 axios 源码整体架构,打造属于自己的请求库
(6)77.9K 的 Axios 项目有哪些值得借鉴的地方
(7)【Web技术】920- Axios 如何取消重复请求?
(8)625- Axios 如何缓存请求数据?
(9)Axios 如何缓存请求数据?
(10)Vue 中 Axios 的封装和 API 接口的管理
(11)Vue项目中,关于Axios使用的总结
10.基于Promise从零封装Axios库
11.Fetch及Fetch库的封装
12.N种跨域解决方案及底层原理
CORS 完全手册之 CORS 详解
13.前端性能优化方案汇总(全面深入分析+实战演练)
JS实际开发项目中的编码小技巧
第二部分:Vue2.0的基础知识与核心原理
第三部分:Vue生态及进阶(vuex / vue-router)
第四部分:Vue综合实战和性能优化
第五部分:Vue3.0基础知识与实战应用
第七部分:React生态及进阶(redux / react-router-dom)
第八部分:React综合实战和性能优化
1.Vue 在哪些方面做的比 React 更好?
2.React 与 Vue 框架的设计思路大 PK
3.用了 5 年 React,我不喜欢 Vue.js 的地方有这些
4.面试题:谈谈Vue和React的区别?
5.适合Vue用户的React教程,你值得拥有
6.你不知道的 React 和 Vue 的 20 个区别
7.2021 年 Angular vs. React vs. Vue 前端框架对比
8.关于Vue和React的一些对比及个人思考(上)
9.React 转 Vue2.0 转 Vue3.0 不完全指东
前端工程化
持续集成与持续部署
基于 GitHub / GitLab 的自动化工作流搭建
手把手教你用 Github Actions 部署前端项目
常见的 CI 实践:Jenkins、GitLab CI、Travis CI、Circle CI
让Jenkins自动布署你的Vue项目(CI/CD)
开源项目的新选择:GitHub Actions
基于常用 CI 系统实现静态
Node 类型的项目自动部署
【第2260期】ToB 前端 CI/CD 建设实践
前端开发者应该知道的 Centos/Docker/Nginx/Node/Jenkins 操作
VS Code 使用指南
VSCode 同步设置及扩展插件 实现设备上设置统一
tokens :2297e7601ff84a5ceba0d3c7c05648a54bbaba51
前端工具和环境的配置综合
ESLint+Prettier一套标准的前端代码工作流
Prettier 完全指南,以及和 Git、VSCode、ESLint 整合,让你的代码变美丽
VS Code 中 Vetur、prettier、ESLint 使用
Mac使用Git从GitLab仓库拉取代码
牛逼的Git!!!!!!!
为什么Git把SVN拍在了沙滩上
分享一篇通俗易懂的可视化Git命令
字节研发设施下的 Git 工作流到底是怎么做的?
就业指导和职业规划
阿里九段人才培养方案中各级别的要求
教你编写出一份优秀的个人简历
十多年心血汇总:“面试必杀绝技” 大厂面试流程和侧重点
如何才能成为一名优秀的IT工程师
企业内推资源和一对一模拟面试