[JavaScript知识库]前端开发前言了解

目录

前言

关于CSS(3)需要了解的知识点

关于HTML(5)需要了解的知识点

关于JavaScript(ES6+)需要了解的知识点

库工具

前端框架

Vue的优势

React的优势

浏览器是JavaScript的宿主环境

前端工程化

性能优化

运行时的优化和开发时的优化

Nodejs一些知识点

数据结构和算法

前言

需了解需要学习的内容

关于CSS(3)需要了解的知识点

• 盒模型（标准 & IE)
• flex 、float 、Normal Flow等的理解
• CSS常用选择器
• 行内、内部、外部样式的区别
• CSS层叠规则
• BFC与IFC的了解
• CSS3的transform、transition、animation等属性的运用
• 响应式布局的理解

关于HTML(5)需要了解的知识点

• HTML语义化
• canvas
• 本地存储（localStorage、sessionStorage、cookie的理解）
• video和audio的使用
• 应用缓存（cache manifest）

JavaScript是前端的基石

关于JavaScript(ES6+)需要了解的知识点

• 类型转换
• this
• 作用域（作业域链）
• 原型链以及继承
• 闭包的理解
• 动态作用域和词法作用域
• JavaScript执行机制
• promise & async

库工具

• JQuery：降低开发者操作DOM的复杂度
• UnderScore：提供实用的函数
• Zepto：JQuery的简化版
• Moment：日期和时间操作库

前端框架

Vue的优势

1. 模板和渲染函数的弹性选择
2. 简单的语法和项目配置
3. 更快的渲染速度和更小的体积

React的优势

1. 更适合大型应用和更好的可测试性
2. 同时适用于Web端和原生app
3. 更大的生态系统，更多的支持和好用的工具

浏览器是JavaScript的宿主环境

• 浏览器缓存机制
• 浏览器中JavaScript的执行机制
• 页面渲染原理
• 浏览器安全问题
• 浏览器为什么会跨域
• 如何系统的优化页面
• HTTP与HTTPS的区别
• TCP/IP协议
• 三次握手和四次握手
• CDN 的作用和原理
• 正向代理与反向代理的特点

前端工程化

1. 模块化
   1. JavaScript模块化
   2. CSS模块化
   3. 资源模块化
2. 规范化
   1. 编码规范
   2. 接口规范
   3. git使用规范
   4. CodeReview
   5. UI元素规范?
3. 工程化
   1. 理解Babel、ESLint、webpack等工具在项目中的作用
   2. Babel的核心原理
   3. webpack的编译原理、构建流程、热更新原理
   4. nginx的基本理解
   5. 理解Git的工作流程
   6. Mock的意义及优点

从UI拆分下来的每个包含模块(HTML)+样式(CSS)+逻辑(JS)功能完备的结构单元，我们称之为组件

性能优化

运行时的优化和开发时的优化

• 前端性能衡量指标、性能监控（perfoemance，LightHouse）
• 常见的性能优化方案有哪些
• SSR方案的性能优化
• webpack的性能优化方案
• React、Vue等框架使用性能优化方案
• 网络层面的优化方案
• 页面渲染层面的优化方案
• 白屏的优化方案

Nodejs一些知识点

• Nodejs在应用程序中的作用
• Express和Koa的区别
• Nodejs的底层运行原理、和浏览器的异同
• Nodejs非阻塞机制的实现原理

数据结构和算法