![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端性能优化
文章平均质量分 80
前端人
专注前端开发技术分享,助力初学者更好成长
展开
-
前端自动脚本中常见的几个问题,你遇到了吗?
公司有个审核平台,下班时间没人审核,审核速度更是着急人,所以老板让我写一个能够自动审核的脚本,只用于下班时间。我就开始了自己的第一个自动脚本。自动脚本没有想象中那么难,作为一个前端,我们依旧使用我们最擅长的 js 。写一段需要执行的 js 代码,然后放入到调试器中回车执行,此时我们的自动脚本就能正常跑起来喽!示例:没有写过自动脚本的前端,赶紧看过来!写自动脚本常见的几个问题分别如下:问题1:获取到的元素是为 null ?我们通常直接使用 document.getElementBy原创 2022-05-24 11:22:56 · 434 阅读 · 1 评论 -
JS 跳过 debugger 的几种方法,都在这了
前端写自动脚本中最常见的就是 debugger 的干扰,debugger 仅在调试模式中起作用,需要手动点击才会继续向下执行,这样我们的自动脚本也就卡住无法向下执行,本篇文章介绍几种跳过 debugger 的方法。方法1:禁用所有断点禁用所有的断点,会包含自己的断点也会被禁用掉,暂停了调试。方法2:添加到 Ignore List 中把需要忽略掉的断点被包含的文件,添加到忽略列表中,此时一部分的断点就会被跳过,使用 f5 刷新也不会影响。鼠标放到 debugger 处,点击右键原创 2022-05-23 09:27:44 · 4217 阅读 · 0 评论 -
厉害了网页扫码,所有方法都给你总结到这了,赶紧收藏
最近做一个项目,要通过扫一扫查询对应的信息,由于现在已经有一部分二维码已被生成,为了兼顾已生成的二维码,所以需要使用网页的扫一扫功能去完成项目。项目使用技术栈:vue2方案一、js 原生热心的同事帮我已经找好了网页扫一扫 DEMO,给我说已经测试过了,Andriod 和 IOS 都可以正常使用。使用 QRScanner 插件其原理是通过navigator.mediaDevices.getUserMedia 来获取用户的摄像头使用权限:navigator.mediaDevi原创 2022-04-02 12:01:28 · 3695 阅读 · 0 评论 -
前端性能优化(四)——网页加载更快的N种方式
网站前端的用户体验,决定了用户是否想要继续使用网站以及网站的其他功能,网站的用户体验佳,可留住更多的用户。除此之外,前端优化得好,还可以为企业节约成本。那么我们应该如何对我们前端的页面进行性能优化呢?前端性能优化可以分为三个方面:接口访问优化、静态资源优化和页面渲染速度优化。一、接口访问优化1.1、减少http请求,合理设置 HTTP缓存http协议是无状态的应用层协议,每次发送http请求时,都需要建立连接、通信、断开连接,在服务器端每个http都需要开启独立的线程去处理。所以尽量减少ht原创 2021-09-02 11:20:26 · 1867 阅读 · 0 评论 -
前端性能优化(三)——浏览器九大缓存方法
上一篇文章介绍的是《浏览器缓存机制》,浏览器缓存是浏览器保存数据用于快速读取或避免请求重复资源,提升网页加载速度。缓存的数据到底放哪了呢?作为开发者,有时也需要检查一下缓存中的内容。所以介绍下缓存方法以及缓存内容在哪查找?1、http 缓存http缓存是存在于服务器与浏览器之间,是一种保存资源副本并在下次请求时直接使用该副本的技术。web缓存发现请求资源已经被存储,它会拦截请求,返回资源副本,而不会去服务器重新请求资源。具体的缓存设置,如何判断是否有缓存?等,上一篇文章以详细介绍,可点击《浏览器原创 2021-09-01 10:43:33 · 2373 阅读 · 0 评论 -
前端性能优化(二)——浏览器缓存机制
浏览器缓存对于前端一点都不陌生,最常见的就是,新版本上线了,测试却说这怎么还没有变化呢?使用 ctr + F5 强制刷新之后,立马就好了。或者清除浏览器缓存,按住ctr+shift+delete,弹出如图:我们会发现目前浏览器缓存的图片和文件的大小。或者进入chrome://chrome-urls/找到chrome://cache/ 就可以看到所有缓存的地址列表。对于浏览器缓存,前端对它是又爱又恨,有时想保留,有时想禁掉,所以看看浏览器缓存到底是怎样的?一、什么是浏览器缓存?浏览器缓存就原创 2021-08-31 09:28:31 · 599 阅读 · 1 评论 -
前端性能优化(一)——浏览器工作原理
作为一个前端,经常会有老板或测试给我们提出某个地方加载太慢了,需要优化一下。我们自己的网站也一样,加载时间过长,自己都不耐烦,对于网页优化是很常见的,今天我们先介绍下网页加载原理。一、浏览器简介想要了解浏览器的工作原理,我们必须清楚浏览器的组成有哪些?以及各个部分功能。浏览器组成部分如图所示:各部分的功能及意义:用户界面:浏览器的界面,有标签页、地址栏、前进、后退、刷新、收藏等。除了请求到的内容页面。 浏览器引擎:用来查询和操作渲染引擎的接口。 渲染引擎:也叫做 “浏览器内核原创 2021-08-30 09:31:38 · 208 阅读 · 0 评论