![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javascript
杨周龙
这个作者很懒,什么都没留下…
展开
-
Node.js Event loop 图解
直接上自己制作的流程图原创 2022-01-18 17:29:58 · 463 阅读 · 0 评论 -
关于配置Webapck的 exclude 不过滤 node_modules Babel却没有处理转换node_modules的源码
最近对公司的项目引入了 nanoid 替换 uuid 的使用。但是在sentry日志中发现Unexpected token =>的错误。立马查看编译后bunld发现 nanoid 箭头函数没有被转换。所以对此记录一下原因和解决办法。报错的原因1.nanoid 源码是没有经过babel转换的。查看nanoid的源码,发现依赖包的代码没有经过babel处理输出的,package.json中直接指向了ES6的源码。2.使用了.babelrc 所以没有对node_modules中依赖进行Babel.原创 2021-08-11 21:33:32 · 2182 阅读 · 0 评论 -
React 性能优化之批量处理 unstable_batchedUpdates
手动批量处理unstable_batchedUpdates 可用于手动批量更新state,可以指定多个setState合并为一个更新请求。import { useState, useLayoutEffect } from "react";import * as ReactDOM from "react-dom";function App() { const [count, setCount] = useState(0); const [flag, setFlag] = useState(原创 2021-07-19 09:40:13 · 4302 阅读 · 0 评论 -
jest 单元测试模拟模块设置动态值
在单元测试中需要对组件进行动态、极端、正常状态测试,如果组件里使用了api那么我们想对组件进行接口多种不同响应进行测试时候就需要对模块进行动态值设置。mockFun.mockImplementation接受应作为模拟的实现使用的函数。模拟本身仍然会记录所有进入的调用以及来自自身的实例–唯一的区别是,在模拟被调用时也将执行实现。使用mockImplementation我们可以在测试过程中修改mock的值。这样我们就可以实现多种接口状态模块import { Login } from '@/api/lo.原创 2021-05-13 15:29:34 · 822 阅读 · 0 评论 -
Jest 只MOCK模块中的某个功能实现
单元测试某些场景下只想模拟模块中的某个功能,并且保留模块原有的功能。这时候我可以用 jest.requireActual 配合 jest.mock 进行实现。jest.requireActual该API返回实际模块而不是模拟模块,绕过所有有关该模块是否应接收模拟实施的检查。为什么用 jest.requireActual ? 因为jest的mock中是不允许直接使用全局变量,所以我们无法直接import模块包装实现。例子模拟Taro的login APIjest.mock('@tarojs/tar.原创 2021-05-13 12:18:47 · 1487 阅读 · 0 评论 -
解析 react、vue等路由参数的库 path-to-regexp
React-router的路由系统内部中使用的是 path-to-regexp 解析匹配路由参数。具体用法如下const { pathToRegexp } = require("path-to-regexp")const regexp = pathToRegexp("/:foo/:bar");// keys = [{ name: 'foo', prefix: '/', ... }, { name: 'bar', prefix: '/', ... }] regexp.exec("/test/.原创 2021-04-25 14:08:01 · 430 阅读 · 0 评论 -
Javascript性能优化【内联缓存】 V8引擎特性
引用官方的描述:内联缓存(Inline caching)是部分编程语言的运行时系统采用的优化技术,最早为Smalltalk开发。内联缓存的目标是通过记住以前直接在调用点上方法查询的结果来加快运行时方法绑定的速度。内联缓存对动态类型语言尤为有用,其中大多数(如非全部)方法绑定发生在运行时,因此虚方法表通常无法使用。原创 2021-02-23 14:48:14 · 341 阅读 · 0 评论 -
javascript V8引擎垃圾收集机制
V8引擎使用的垃圾收集机制是标记清除,那么javascript在垃圾收集会阻塞其他程序执行。V8引擎使用了增量标记的方式进行优化增量标记V8不是直接对整个栈堆遍历标记,而是标记一部分堆后回复正常执行。下次GC将从上一次停止对位置继续进行标记。这样允许在正常执行期间非常短对暂停。...原创 2021-02-23 11:45:48 · 157 阅读 · 0 评论 -
前端性能优化篇——浏览器http同域名并发请求对限制
在浏览器同域名并发请求都产生并发数限制,并发限制通常是4~8以内。那么我们将来了解浏览器请求并发限制的原因和优化手段。浏览器并发数量统计浏览器为什么要请求并发数限制?在了解优化手段之前我们先了解浏览器限制并发请求的原因1.对操作系统端口资源考虑PC总端口数为65536,那么一个TCP(http也是tcp)链接就占用一个端口。操作系统通常会对总端口一半开放对外请求,以防端口数量不被迅速消耗殆尽。2.过多并发导致频繁切换产生性能问题一个线程对应处理一个http请求,那么如果并发数量巨大的话.原创 2021-02-02 23:00:56 · 3667 阅读 · 0 评论 -
关于 NODE.js 并行线程 worker_threads 的使用与详解。
javascript 是单线程,那么node.js属于服务端语言改如何实现其他语言中的并发线程执行呢?在node V10只有 child_process,cluster的API来开启多子进程,多进程。进程并不是子线程,无法内存共享。在nodeV10后引入worker_threads API概念。worker_threadsnode官方文档注明了:worker_threads 模块允许使用并行地执行 JavaScript 的线程。与 child_process 或 cluster 不同, wor.原创 2021-01-27 00:02:37 · 7362 阅读 · 5 评论 -
关于Vue 3.0 的改进 Proxy 代理实现数据驱动视图
Vue 3.0 中使用了 Proxy 对象代理进行拦截实现了数据绑定视图的驱动操作。弥补了vue2.0中的局限,比如属性删除增加监听、对数组基于下标的修改、长度变化等等。参考一下网上流传的机制图Proxy 是什么?首先我们来了解一下Proxy是什么。Proxy不是简单的serverProxy服务器代理,而生ES6中新特性Proxy,我们先看一下MDN官网的说明Proxy 对象用于创建一个对象的代理,从而实现基本操作的拦截和自定义(如属性查找、赋值、枚举、函数调用等)。术语handle.原创 2021-01-03 13:37:04 · 256 阅读 · 5 评论