前言什么是自动化测试自动化测试在很多团队中都是Devops环节中很难执行起来的一个环节，主要原因在于测试代码的编写工作很难抽象，99%的场景都需要和业务强绑定，而且写测试代码的编写工作量往往比编写实际业务代码的工作量更多。在一些很多业务场景中投入产出比很低，适合写自动化测试的应该是那些中长期业务以及一些诸如组件一样的基础库。自动化测试是个比较大的概念，其中分类也比较多，比如单元测试，端对端测试，集

编者按：本文转载自XxjzZ的掘金文章，快乐来一起学习吧！前言自从React Hooks出现之后，批评的声音不断，很多人说它带来了心智负担，因为相比传统的Class写法，useState...

前言2020年9月18日，vue3正式版发布了，前几天把文档整体读了一遍，感触很深，可以解决我项目中的一些痛点，于是就决定重构之前那个vue2的开源项目。本篇文章就记录下重构vue2项目...

目前主流的前端框架vue和react都采用rollup来打包，为了探索rollup的奥妙，接下来就让我们一步步来探索，并基于rollup搭建一个库打包脚手架，来发布自己的库和组件。前言写r...

编者按：本文作者Berwin，W3C性能工作组成员，360导航资深前端工程师。《深入浅出Vue.js》作者。LCP 全称 “Largest Contentful Paint”，翻译为“最...

前言本文暂未涉及Performance面板的内容。常用命令和调试黑盒脚本：Blackbox Script控制台内置指令远程调试WebView1. Chrome Devto...

如果选出 Chrome DevTools 里最常用的功能，那 Network 肯定是其中之一。作为前端工程师，我们看到一个网页会习惯性的打开 Chrome DevTools 看下网络请求。不过虽然每天都在用，还是有一些高级功能大多数人不知道。今天就来梳理下那些很有用但是知道的人比较少的功能：filter一个网站会有很多的请求，当你想查找某个请求的时候，是怎么过滤的呢？关键词搜索么？但是关键词搜索只

Chrome DevTools 是我们每天都用的工具，它可以查看元素、网络请求、断点调试 JS、分析性能问题等，是辅助开发的利器。今天不讲怎么使用它，而是讲一个好玩的方向：定制自己的调试工具。之前讲过，Chrome DevTools 和 Chrome 是分离的架构，两者之间通过 WebSocket 通信，通信协议是 Chrome DevTools Protocol，简称 CDP：其实这不准确，具体

昨天的文章通过 Performance 和 Memory 工具证明了打开 devtools 的时候 console.log 会有内存泄漏。有 console.log 的时候，内存是这样的：去掉之后是这样的：我们得出结论，console.log 会导致内存泄漏。这点没错。但很多同学会有疑问，是不是因为打开 devtools 才有内存泄漏，不打开就不会呢？这个我测试了一下：点击几次按钮，这时候应该调用

前言工作中一直有接触大量数据渲染的业务，使用react-window多之又多，所以对虚拟列表有了些浅显的理解。今天，我们就照着react-window的使用方式来实现三种虚拟列表。元素固定高度的虚拟列表元素不定高度的虚拟列表元素动态高度的虚拟列表虚拟列表核心原理 我们先来看一下整个虚拟列表元素的表现。动画.gif看右边的元素个数，会发现起初只有6个，之后无论怎么滚动，他都保持着8个元素，由此我们可