luckest

摘要： 问题复现 1、创建一个TEST文件夹，TEST文件夹下有一个test.js文件。 2、将这个修改推送到gitee仓库上 3、修改本地文件夹的名字大小写，从TEST，修改为Test。 这个时候就出现了问题，git status命令表示，没有任何修改： 那么问题来了，导致这个问题的原因是什么？我们又该怎 阅读全文

摘要： 虚拟DOM就是用JS来模拟DOM结构的，它并不是真正的DOM。 为什么使用虚拟DOM？ 用传统的方式去操作DOM的时候，浏览器会从构建DOM树开始，从头到尾执行一遍流程。简单来说，就是会触发重排与重绘。 比如说，在一次操作中，需要更新10个DOM节点。 理想是一次性构建完成DOM树，但是浏览器并不会 阅读全文

摘要： 什么是不可变数据 不可变数据的概念来自函数式编程。 在函数式编程中，对已初始化的“变量”是不可以更改的，每次更改都要创建一个新的“变量”。 Javascript 在语言层没有实现不可变数据，需要借助第三方库来实现。（immutable.js 或者 immer.js） 为什么使用不可变数据？ 使用不可 阅读全文

摘要： JS的数据类型 基本数据类型（七种） Number String Boolean Null Undefined Symbol Symbol详解 BigInt BigInt数据类型的目的是比Number数据类型支持的范围更大的整数值以任意精度表示整数的能力尤为重要。 JS 中的Number类型只能安全 阅读全文

摘要： 元素偏移量offset系列 offset是元素偏移量，使用offset系列相关属性可以动态的得到该元素的偏移位置、大小等。 可以获取元素 距离带有定位度元素 的位置 可以获取元素自身的大小（宽度、高度） 返回的数值不带单位 offset系列常用属性 |offset系列属性|作用|| |--|--|- 阅读全文

摘要： 前端性能优化，分为两个部分： 加载性能优化 渲染性能优化 本篇随笔介绍渲染性能优化。 渲染性能优化 浏览器渲染过程 1、解析HTML，生成DOM树。 2、解析CSS，生成CSSDOM规则树。 3、解析JS，操作DOM树和CSSDOM规则树。 4、将DOM树和CSSDOM规则树合并在一起，生成渲染树。 阅读全文

摘要： 缓存 浏览器缓存 是浏览器将用户请求过的静态资源（html、css、js），存储到电脑本地磁盘中，当浏览器再次访问时，就可以直接从本地加载了，不需要再去服务端请求了。 在工作中，将前端代码发布到静态服务器上时，需要对这些静态资源做一些运维配置。 其中设置gzip和缓存必不可少，这两项直接影响到网页性 阅读全文

摘要： 前端性能优化，分为两个部分： 加载性能优化 渲染性能优化 本篇随笔介绍加载性能优化。 加载性能优化 本质： 1、减少请求次数 2、减少请求资源的大小 3、网络优化 1、减少请求次数 为什么要减少请求次数？ 答：浏览器能够并行发送请求，但是每次并行发送请求的个数是有限制的，以chrome浏览器为例子： 阅读全文

摘要： async和defer html4.0中定义了defer；html5.0中定义了async。 如果没有defer和async，浏览器会立即加载并执行指定的JS脚本，并不会等待后续载入的文档元素。 如果有async，加载后续文档元素的过程中，将和JS的加载与执行，并行进行（异步）。 如果有defer， 阅读全文

摘要： 行内元素 特点： 不会独占一行，相邻的行内元素会在水平方向上排列，直到一行排不下，才会换行 行内元素设置width、height属性无效，它的宽高主要由内容来决定。 行内元素的margin和padding属性，在水平方向（top和bottom）上生效，垂直方向（left和right）上不生效。 块级 阅读全文