原型链之 __proto__ 和 prototype

原型链每隔一段时间就容易忘记,所以整理一下,便于回顾。 用下面的代码 demo 来帮助理解: function Person(name, age, job) { this.name = name; this.age = age; this.job = job; this.sayName = function() { console.log(this. »

元芳 元芳

防抖与节流

1.防抖 高频事件触发后,n秒内(定时器计时)执行一次,如果在函数执行前再次触发,则重新计时。 思路:再次触发的时候,取消上次的定时器。 function debounce(fn) { let timer = null; return function () { clearTimeout(timer); timer = setTimeout(() => { // this 指向 »

元芳 元芳

前端性能优化

思维导图获取 基础的 Web 技术层面的优化 Web服务器优化 开启 gzip 压缩 HTTP 协议上的 gzip 编码是一种用来改进 web 应用程序性能的技术,web 服务器和客户端(浏览器)必须共同支持 gzip。目前主流的浏览器,Chrome,firefox,IE等都支持该协议。常见的服务器如 Apache,Nginx, »

元芳 元芳

从输入URL到页面渲染出来的过程(详细)

思维导图获取 一、 URL 解析 1. 输入内容合成地址 用户输入URL,浏览器会根据用户输入的信息判断是搜索还是网址。 如果是搜索内容,就将搜索内容(会对内容进行字符编码等操作)+ 默认搜索引擎合成新的URL; 如果用户输入的内容符合URL规则,浏览器就会根据URL协议,在这段内容上加上协议合成合法的 2. HSTS(HTTP Strict Transport Security) 因为 http 存在安全隐患(比如:明文传输, »

元芳 元芳

HTTP 1.x 与 HTTP 2.0 的区别

HTTP 2.0 相比 HTTP 1.x 大幅提高了web性能,减少了网络延迟。接来下详细探索下 HTTP 2.0 是如何提高性能的。 先来看个 http/1.1 与 http/2 同时请求 379 张图片,所花费时间的对比。https: »

元芳 元芳