前端性能优化学习
文章平均质量分 94
面条请不要欺负汉堡
道理不是拿来懂的,而是拿来悟的
展开
-
干货 | RAF替代setTimeout_setInterval
为什么用 requestAnimationFrame代替 setInterval 和 setTimeout?那得先了解微任务、宏任务与Event-Loop, 还有 setInterval 存在的问题转载 2023-02-28 10:29:25 · 653 阅读 · 1 评论 -
前端自动化测试Vue Test Utils - vue单元测试 (二)
一.TDD介绍测试驱动开发(Test Driven Development,简称TDD)。TDD 是敏捷开发中的一项核心实践和技术,也是一种设计方法论。TDD的原理是在开发功能代码之前,先编写单元测试用例代码,测试代码确定需要编写什么产品代码。TDD 是 XP(Extreme Programming)的核心实践。它的主要推动者是 Kent Beck。测试驱动开发的思想就是“测试的目的是让你知道,什么时候算是完成了。如果你聪明,你就应该先写测试,这样可以及时知道你是否真地完成了。否则,你经常会不知道,到底原创 2020-12-21 16:03:53 · 4843 阅读 · 1 评论 -
前端自动化测试-Jest(一)
一 前端自动化测试产生的背景及原理在没有前端自动化测试的时候,一般是项目使用过程中发现问题。前端自动化测试:是写了一段测试的js代码,通过测试的js代码,去运行项目(含有需要测试的代码),查看预期值跟结果的值,是否相等,相等则正确,否则有误。简单的理解就是一段额外的测试代码就可以在上线之前对它进行测试,而这些测试不是人肉的去点击,而是通过已经写好的代码去运行的,得到结果进行判断,是否有问题如 小案例:要测试math.js的方法math.jsfunction add(a, b)...原创 2020-12-08 17:33:58 · 5776 阅读 · 3 评论 -
谈谈前后端分离及认证选择
什么是前后端分离?为什么要前后端分离?前后端分离,说的更多的是一种架构上的概念。在传统的web架构中,比如经典的MVC,会分数据层、逻辑层、视图层。这个视图层即我们所说的前端了,映射到代码层面,就是html、js、css等代码文件。数据层和逻辑层更多的是后端部分,例如我们的.java、.go、.py等文件。这些文件会在一个工程中,并不会单独的开发、测试、部署。在前后端分离的架构中,前端和后端是分开的,分别在不同的工程中。前端有专门的前端开发人员来进行开发、测试,后端则有后端开发人员来进行开发..转载 2020-09-30 16:00:18 · 547 阅读 · 1 评论 -
前端懒加载以及预加载
懒加载(延迟加载):延迟加载图片或符合某些条件时才加载某些图片。预加载:提前加载图片,当用户需要查看时可直接从本地缓存中渲染。两种技术的本质:两者的行为是相反的,一个是提前加载,一个是迟缓甚至不加载。懒加载对服务器前端有一定的缓解压力作用,预加载则会增加服务器前端压力。1.懒加载:意义: 懒加载的主要目的是作为服务器前端的优化,减少请求数或延迟请求数。实现方式:1.第一种是转载 2017-07-27 09:04:40 · 922 阅读 · 0 评论 -
页面优化之高性能函数防抖与节流
一.函数节流(throttle)函数节流是指一定时间内js方法只跑一次。1.函数节流的目的例如,DOM 操作比起非DOM 交互需要更多的内存和CPU时间。连续尝试进行过多的DOM 相关操作可能会导致浏览器挂起,有时候甚至会崩溃。尤其在IE 中使用onresize 事件处理程序的时候容易发生,当调整浏览器大小的时候,该事件会连续触发。在onresize 事件处理程序内部如果尝试进行DOM 操作,其高...原创 2018-02-26 17:26:24 · 565 阅读 · 0 评论 -
Web离线应用解决方案——ServiceWorker
什么是ServiceWorker? 在介绍ServiceWorker之前,我们先来谈谈PWA。PWA (Progressive Web Apps) 是一种 Web App 新模型,并不是具体指某一种前沿的技术或者某一个单一的知识点,,这是一个渐进式的 Web App,是通过一系列新的 Web 特性,配合优秀的 UI 交互设计,逐步的增强 Web App 的用户体验。Https环境部署 响...转载 2018-09-29 10:29:44 · 819 阅读 · 0 评论