- 博客(6)
- 收藏
- 关注
RSS订阅原创 面试题系列--浏览器是如何渲染UI的？
浏览器是如何渲染UI的？浏览器获取HTML文件，然后对文件进行解析，形成DOM Tree与此同时，进行CSS解析，生成Style Rules接着将DOM Tree与Style Rules合成为 Render Tree接着进入布局（Layout）阶段，也就是为每个节点分配一个应出现在屏幕上的确切坐标随后调用GPU进行绘制（Paint），遍历Render Tree的节点，并将元素呈现出来...
2021-08-10 19:45:44
248
原创 前端性能优化方案
前端性能优化方案1、减少DOM操作2、部署前，图片压缩，代码压缩3、优化js代码结构，减少冗余代码4、减少http请求，合理设置HTTP缓存5、使用内容分发cdn加速6、静态资源缓存7、图片延迟加载...
2021-08-10 19:06:49
84
原创 如何实现垂直水平居中?
如何让一个盒子在页面垂直水平居中?已知宽高,利用margin:auto;div{ position: absolute; left: 0; right: 0; bottom: 0; top: 0; margin: auto;}未知宽高,利用定位div{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}利用display：flex;设
2021-08-10 19:02:47
174
原创 重排与重绘
重排与重绘重排当DOM的变化引发了元素几何属性的变化，比如改变元素的宽高，元素的位置，导致浏览器不得不重新计算元素的几何属性，并重新构建渲染树，这个过程称为“重排”。简单的说，重排负责元素的几何属性更新。重绘完成重排后，要将重新构建的渲染树渲染到屏幕上，这个过程就是“重绘”。简单的说，重绘负责元素的样式更新。重排与重绘的关系与区别重排必然带来重绘，但是重绘未必带来重排。比如，改变某个元素的背景，这个就不涉及元素的几何属性，所以只发生重绘。...
2021-08-10 18:38:22
71
原创 学习Vue系列—常用指令v-bind、v-on、v-for、v-if和v-show
Vue常用语法格式插值语法 <div id="app"> <!-- {{ }}插值语法，也叫胡子语法，相当于营造了一个可以书写js代码的简单环境 --> <p>num1和num2较大的数字是:{{num1>num2?num1:num2}}</p> <p>请反转str: {{ str.split("").reverse().join("") }}</p> </div
2021-06-24 21:52:12
349
原创 学习Vue系列—认识Vue
Vue简介Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。Vue的特点和在Web开发中常见的高级功能解耦视图和数据双向数据绑定可复用的组件前端路由技术状态管理虚拟DOMVue的安装使用使用Vue的方式有很多直
2021-06-24 20:28:15
113
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人