性能优化
项目中的一些性能优化方法
致我逝去的青春
人生可以浓缩成三句话:1、你的责任就是你的方向,你的经历就是你的资本,你的性格就是你的命运。2、复杂的事情简单做,你就是专家;简单的事情重复做,你就是行家;重复的事情用心做,你就是赢家。3、美好是属于自信者的,机会是属于开拓者的,奇迹是属于执著者的
展开
-
js 发布订阅,移动端简单事件,h5新增属性
发布订阅 先进行订阅,订阅时把事件存储到一个事件池中,然后到了条件成立时,遍历事件池中的方法,把订阅的方法都执行; let box = document.getElementById("box"); // 订阅 function on(curEle,type,fn){ if(!curEle[type]){// 第一次进来,给其...原创 2020-01-12 20:41:51 · 1654 阅读 · 0 评论 -
js 事件行为以及传播和委托
事件 事件:浏览器的一种行为,也可以是用户行为 发生在HTML元素上事件 src是异步的 onclick onmouseover onmouseout onmouseenter onmouseleave onmousemove ondblclick onkeydown onkeyup onkeypress ontouchst...原创 2020-01-12 19:07:45 · 171 阅读 · 0 评论 -
js 防抖节流,同步异步,promise
防抖 防抖 指触发事件后在 n 秒内函数只能执行一次,如果在 n 秒内又触发了事件,则会重新计算函数执行时间。 //非立即执行 let box = document.getElementById('box') let num = 1; function add() { box.innerHTML = num++...原创 2020-01-12 18:40:31 · 1804 阅读 · 0 评论 -
图片懒加载的三种实现方式及事件的防抖和节流
1.图片的懒加载方案一:clientHeight、scrollTop 和 offsetTop首先给图片一个占位资源:<img src="default.jpg" data-src="http://www.xxx.com/target.jpg" />接着,通过监听 scroll 事件来判断图片是否到达视口:let img = document.getElementsByTagName("img");let num = img.length;let count = 0;//计数器,从原创 2020-07-15 22:44:04 · 674 阅读 · 0 评论 -
关于浏览器的缓存和本地存储及其优缺点
1.能不能说一说浏览器缓存?缓存是性能优化中非常重要的一环,浏览器的缓存机制对开发也是非常重要的知识点。接下来以三个部分来把浏览器的缓存机制说清楚: 强缓存 协商缓存 缓存位置强缓存浏览器中的缓存作用分为两种情况,一种是需要发送HTTP请求,一种是不需要发送。首先是检查强缓存,这个阶段不需要发送HTTP请求。 在HTTP/1.0和HTTP/1.1当中,这个字段是不一样的。 在早期,也就是HTTP/1.0时期,使用的是Expires,而HTTP/1.1使用的是Cache-Control。原创 2020-07-15 20:16:42 · 2884 阅读 · 0 评论 -
webpack 之深入了解
概念 webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle。 从 webpack v4.0.0 开始,可以不用引入一个配置文件。在开始前你需要先理解四个核心概念: 入口(entry) 输出(output) loader 插件 (plugins)转载 2020-07-03 15:02:07 · 206 阅读 · 1 评论