图片懒加载图片优化： 1）压缩或者剪裁 2）减少http请求：使用雪碧图 3）使用字体图标 4）图片懒加载 只有上面这四种方法吗，当然不是，我只了解这四种哈哈哈哈哈🤣 图片懒加载1）为什么需要懒加载有的页面会有非常非常多的图片，一进入页面，就去加载全部的图片，会让加载过程变的漫长。而且一次发送那么多请求也会增加服务器压力，并且我打开一个页面，可能我只会浏览部分内容，有些没浏览到的地方，其实我是不需要加载出来的，我们只需要加载需要的资源，显然这样子是不合理的。 2）实现思路1.我们给图片的src ...

参考资料：https://www.bitovi.com/blog/a-crash-course-in-how-dom-events-work 事件事件监听1.怎样监听一个事件DOM0123<button onclick="alert('hello');"> click me! </button> 这种直接将事件混合在HTML中，非常的不灵活 DOM11234var button = document.getElementById('button');button. ...

参考资料 https://juejin.im/post/5c15f797f265da61141c7f86 接上浏览器渲染过程 经过对浏览器渲染过程的了解，最后两步就是渲染，也就是在这个阶段出现了重排与重绘，也同时是最耗时的阶段。(意思就是说在第一次加载页面的时候，就会出现重排与重绘)。 重排（回流）当DOM的变化影响到了元素的几何信息，浏览器需要重新计算元素的宽高信息和位置信息。这个过程叫重排。 触发的条件1.添加或者删除可见的DOM元素； 2.元素尺寸改变——边距、填充、边 ...

事件循环（Event Loop）入门这里只说浏览器环境下,在不同浏览器下表现不同，这里是在chrome!!!! 参考资料 https://www.codercto.com/a/18956.html https://github.com/aooy/blog/issues/5 ​ 这个地址，可以看到具体的执行过程，还有详细的教程，中文字幕哈哈哈哈 1.单线程的JavaScript负责解析和执行JavaScript的线程只有一个，同一时间只能执行一段JavaS ...

背景：有一天突然发现七牛云测试域名被回收了，有些图片显示不出来了，图片也不能直接下载，本地还没有备份。于是乎想到的办法就是打开一张张图片链接，手动保存到本地。作为一只程序🐒，这种事情自然是做不出来的，查了一堆资料都觉得麻烦，所以用自己的方式解决问题，当然也有解决方案。想法：其实想法就是1.登陆七牛云2.跳转到对应的页面3.加载完成的图片列表，并且获取全部图片的名字（因为我只有80张，所以只需要点击一次加载更多，就可以获取全部列表）4.打开图片完整路径，下载图片到本地使用puppeteer来解决 ...

JSBridge-分离插件js宝哥总是说做Hybird应用开发的，这个要了解一下，那就了解一下哈哈哈哈。刚好有机会写个接入的文档，总结一下流程。 1.JSBridge其实就是Native和Web之间通信的桥梁。 2.需求1）引入lauch.js，根据ua判断，引入不同平台的cordova.js。 2）引入的cordova.js会根据配置文件cordova.plugin.js里的配置数据（数组），然后再动态创建script标签，引入不同的插件js。（cordova.js、cordova.plugi ...

原型和原型链 https://juejin.im/post/5835853f570c35005e413b19 https://juejin.im/post/5c218e4c5188254caf18bb1a 引用类型都是对象原型与原型链对象都有原型，原型也是对象，也有自己的原型，就组成了一条原型链。在对象上找某个属性没找到就会往原型链上找。 第一个🌰 1234567891011121314var obj = {};console.log(obj.__proto__ == ...

this在手写Promise的时候被this折腾的不清，网上this又一堆资料看了也还是不会，于是决定认真的看一下你不知道的JavaScript。用的例子基本都是原文偷的。 首先this只与调用时候的上下文环境有关，与声明的上下文环境无关。1.了解调用位置就是函数被调用的位置 12345678910111213141516function baz() { // 当前调用栈是:baz // 因此，当前调用位置是全局作用域 console.log("baz"); b ...

Flex布局 参考资料：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html 1.弹性布局（flexible box）任何一个容器都可以变成Flex布局 1）块级元素123.box{ display:flex;} 2）行内元素也可以123.box{ display:inline-flex;} 强大的东西一般都有兼容性问题，Webkit 内核的浏览器，需要加上-webkit。之前碰到i ...

new到底做了什么 参考资料：https://juejin.im/post/584e1ac50ce463005c618ca2 ​ https://juejin.im/entry/59196a3ea0bb9f005ff7bee5 ​ https://xiaogliu.github.io/2018/06/28/what-happened-when-using-new/ 1）new做了什么 1.创建了一个临时对象 2.临时对象的__proto_ ...