- 博客(22)
- 收藏
- 关注
原创 文件加载与渲染问题
浏览器并行解析生成DOM Tree 和 CSSOM Tree,当两者都解析完毕,才会生成render tree,页面才会渲染。两者解析完成之后,会合并生成render tree,之后就是layout和paint阶段,渲染到页面中。js运行时,有可能会请求样式信息,如果此时还没有加载和解析样式,js就有可能会得到错误的回复,产生很多问题。结束标签之前,这样不会不会阻塞页面整体内容的DOM解析和渲染。script标签引入文件时加载、解析和执行都会阻塞DOM的解析和渲染,即解析器在遇到。标签都会触发Paint。
2023-04-10 21:08:39
240
原创 浏览器API
浏览器的画面是一帧一帧渲染出来的,当每秒绘制帧数达到60帧时,页面是流畅的,用户不会感觉到卡顿。此时每一帧的渲染时间是1000/60 ≈ 16 ms ,如果每一帧执行时间小于16ms, 就说明浏览器有空闲时间。如果在任务在剩余时间内没有执行完成,则会停止任务执行,继续优先执行主任务,也就是说 requestIdleCallback 总是利用浏览器空闲时间执行任务。整数,请求 ID,是回调列表中唯一的标识。利用浏览器空闲时间执行任务,如果有高优先级的任务,当前执行的任务将会被终止,优先执行高级别的任务。
2023-04-10 21:07:56
408
原创 Vue文档整理
Vue (读音 /vjuː/,类似于view) 是一套用于构建用户界面的渐进式框架数据双向绑定,单向数据流数据驱动视图.vue 单文件组件(SFC)除了核心功能默认内置的指令 (v-model 和 v-show),Vue 也允许注册自定义指令。注意,在 Vue2.0 中,代码复用和抽象的主要形式是组件。然而,有的情况下,你仍然需要对普通 DOM 元素进行底层操作,这时候就会用到自定义指令。// eg: 聚焦输入框 < input v-focus /> directives: {focus: {
2022-12-26 17:21:08
182
原创 nvm安装使用
nvm的安装与使用 由于不同的项目中,使用的node版本可能不一致,在不同的 node版本下使用npm安装环境依赖时,可能会出现问题。所以,安装依赖时,最好保证当前node版本与项目使用版本一致。此时便需要能够在多个node版本之间切换,通过安装nvm可以解决这一问题。nvm介绍nvm就是nodejs version manage,是一个nodejs 版本管理工具使用nvm可以实现多个node版本的安装和对node版本的自由切换准备工作卸载已安装node原本安装过node的需要先卸载干净
2022-05-28 21:46:49
182
原创 手写Promise
手写PromisePromise为一个类,初始化时将为其传入一个执行器,该执行器会立即执行。执行器接收两个参数:Promise内部resolve和reject方法Promise有三个状态:Pending、Fulfilled、Rejected,状态只能由Pending->Fulfilled或Pending->Rejected,状态一旦变更就固定了,无法再次改变Promise使用内部resolve和reject方法更改Promise状态。在调用时除了更改状态外,还会去判断是否缓存了
2022-05-15 22:32:46
54
原创 JavaScript异步编程
异步编程概述JS执行环境中负责执行代码的线程只有一个,同一时间只能执行一个任务,为解决耗时任务阻断代码执行问题,JavaScript将任务的执行模式分为两种:同步模式(Synchronous)异步模式(Asynchronous)同步模式同步模式指的是代码当中的任务将会按照代码编写顺序依次执行,后一个任务必须等待前一个任务执行完毕才会执行。console.log('first');const fun2 = () => { console.log('second');}
2022-05-14 09:04:59
169
原创 函数式编程
函数式编程函数式编程函数式编程(Functional Programming,FP),FP是编程范式之一。常见的编程范式还有面向过程编程、面向对象编程。面向对象编程思维方式:把现实世界中的事物抽象成程序世界中的类和对象,通过封装、继承和多态来演示事物事件的练习例如:Class Car{ constructor(){ this.wheel=4; } star(){ //启动 }}函数式编程的思维方式:把现实世界的事物和事物之间的联系抽象到程序世界(对运算过程进行抽象
2022-05-10 21:21:41
3011
原创 ES6——学习笔记
1、let、var、constvar:函数作用域,存在变量提升,可重复声明let:块级作用域,不存在变量提升,不可重复声明,存在暂时性死区问题(块级作用域内,使用全局变量后再用let声明同名变量,会导致报错)const:用来声明常量,声明时必须赋值,一旦定义无法修改,不可重复赋值。块级作用域,不存在变量提升,不可重复声明,存在暂时性死区问题2、解构赋值ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。数组解构赋值可以从数组中提取
2022-05-05 21:32:39
768
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人