- 博客(28)
- 收藏
- 关注
RSS订阅原创 文字转图片性能优化
通过以上步骤，可以在worker中使用OffscreenCanvas进行图像处理，并将处理结果返回给主线程，从而提高性能并减少内存消耗。使用webworker 和 offscreenCanvas 在worker 中进行图片的处理，并将处理结果返回给js 主线程序。
2023-02-17 13:40:50
309
原创 源码解读之zrender-ZRender 类(3)
这几个函数中被使用了，这几个方法主要是控制画布是否更新，根据函数名可以猜测这个属性的功能是"脏矩形渲染"，也就是局部渲染，找到图形会变化的区域（脏矩形）做去更新。在实例化过程中，还遇到了几个文档描述比较模糊但很有用的参数：useDirtyRect，useCoarsePointer，usePointerSize。，咋一看也没看到它在哪里赋初值，然后在网页打断点调试，发现在初始化的时候会调用。，在后面的分析中会写到这个 useDirtyRect 的工作流程。未开启前，当更新的图形不在区域但还是会更新。
2023-02-07 00:00:44
539
原创 源码解读之zrender-入口(2)
根据以上分析找到 all.ts 文件，这里做了一些初始化的事情：registerPainter，注册绘图工具，默认注册了 canvas 和 svg。从使用方式来看，zrender 导出了一个对象，这个对象上面有一个init的方法，接收一个DOM对象，所以让我们看看 init 方法做了什么吧。该如何找一个工程的入口文件呢，参考[[🧺 package.json 正确配置入口文件]]文章可知，这里的入口是工程中的。方法会 return 一个实例化对象，内部将实例保存到全局变量。入口先分析到这里，还是挺简单的。
2023-02-02 16:31:02
392
原创 package.json 正确配置入口文件
node 中可以通过 main 和 type: module | commonjs 来指定入口文件及其模块类型， exports 则是更强大的替代品，拥有更灵活的配置方式。主流打包工具如 webpack rollup esbuild 则在此基础上增加了对 top-level module 的支持。TypeScript 则会先查看 package.json 中有没有 types 字段，否则查看 main 字段指定的文件有没有对应的类型声明文件。当这些字段同时存在时
2023-02-02 16:06:21
2296
原创 ️ package.json 中的 sideEffects
在一个库的 package.json 看到了 sideEffects 这个字段，好奇它的作用，查资料可得：webpack v4 开始新增了一个特性，通过给加入声明该 包/模块 是否包含 sideEffects(副作用)，从而可以为 tree-shaking 提供更大的优化空间。主要意思就是，加了这个字段，打包工具可以更好地为 tree-shaking 工作。让我们来看看它是如何工作的。
2023-02-02 14:56:01
2567
原创 源码解读之zrender(1)
zrender(官方文档)是二维绘图引擎，它提供 Canvas、SVG、VML 等多种渲染方式， 也是 echarts 的渲染器。
2023-02-02 01:07:53
399
原创 TS小册学习之结构化类型系统
这是因为，TypeScript 比较两个类型并非通过类型的名称，而是比较这两个类型上实际拥有的属性与方法。也就是说，这里实际上是比较 Cat 类型上的属性是否都存在于 Dog 类型上，在比较对象类型的属性时，同样会采用结构化类型系统进行判断。TypeScript 的结构化类型系统是的，而标称类型系统是的。在 TypeScript 中，通过的方式，从或者出发去模拟标称类型系统。
2023-02-01 23:41:50
135
原创 TS小册学习之类型层级
这两者的情况就要特殊一些，它们是因为“系统设定”的问题，Object 包含了所有除 Top Type 以外的类型（基础类型、函数类型等），object 包含了所有非原始类型的类型，即数组、对象与函数类型，这就导致了你中有我、我中有你的神奇现象。作为一个一无所有的空对象，几乎可以被视作是所有类型的基类，万物的起源。是 object 和 Object 的字面量类型，是从。通过赋值来进行兼容性检查（比较少用）实际上是两种完全不同的比较方式。
2023-02-01 23:40:00
179
原创 TS小册学习之 类型
JS 内置的原始类型在 TypeScript 中它们都有对应的类型注解。其中，除了 null 与 undefined 以外，余下的类型对应 JavaScript 中的数据类型概念。
2023-01-31 14:26:57
275
原创 Function 的 length 属性
我们知道，需要函数参数个数，一般使用 arguments.length 即可。大部分场景还是使用 arguments.length 比较靠谱。也就是函数定义时的参数个数，而不是函数实际接受的参数个数。它和 arguments.length 的区别是什么呢？所以函数的 length 属性只能得到。
2023-01-31 14:24:30
204
原创 ✝️ 强制 Vue 重新渲染组件的正确方法
有时 Vue 的 reactivity 不符合需求，你需要重新渲染一个组件，或者可能只是想remove当前的 DOM 并 re-render。那么如何让 Vue 以:key这称为，这是一个非常简单的解决方案，让我们看看还有其他的解决方案吧。
2023-01-31 09:39:21
3995
原创 JS中的拆箱和装箱
包装类与原始值转换过程叫做「装箱」和「拆箱」，装箱是将值类型包装为对象类型，拆箱是将对象类型转换为类型。装箱和拆箱是 JS 来应对「在值类型数据上调用对象方法」的处理技术，使得基础类型与相应的对象类型被统一。至于为什么要装箱和拆箱，个人理解：从内存使用的角度来看，是为了更好的性能。值类型存在栈里，引用类型存在堆里，在使用值类型的时候从栈里取的速度快，且大部分时候不需要调用对象类型中的方法，调用的时候用包装类型包装一下，调用完删除。
2023-01-20 14:36:28
775
原创 Mac环境使用软链 npm link
在开发本地npm包时，经常需要改动东西，但又不知道改动是否正确，这时候大部分人可能会打包一版到项目测试，这显得既不优雅也很繁琐。其实npm官方已经提供了npm link这种软链调试方法。
2023-01-16 13:32:03
1878
原创 mac fnm 使用
在开始使用 fnm 之前需要设置环境变量。fnm use要在目录包含.node-versionor.nvmrc文件时自动运行，请将–use-on-cd选项添加到您的 shell 设置中。
2023-01-16 11:59:57
871
原创 私有库单包和多包架构的区别
但光是有私库是不够的，考虑到私库需要迭代，也需要提供使用说明，因此我们还需要一个存放私库源码的 git。这个仓库用于维护私库的基础信息，使用方法，在线demo，同时它也应该具备有发布到 npm 私有库的功能。
2023-01-15 01:22:09
464
原创 Verdaccio 搭建 npm 私有库
平时在项目工作中可能会用到很多通用性的代码，比如，框架类、工具类以及公用的业务逻辑代码等，通过打包发布到npm中央仓库或者私有仓库，来进行维护和托管代码，方便公用代码的使用。如果涉及到不方便公开的代码组件可以发布到私有仓库。
2023-01-15 01:12:54
886
原创 Nexus搭建企业私有库
做私有库的工具有很多，如上一篇介绍的轻量级的npm包管理工具verdaccio。但刚好maven私服用的是nexus，所以最后选择了nexus来做npm的私服，和maven一套便于维护。----------------nexus安装过程省略----------------
2023-01-15 01:03:34
833
原创 [AWS] 使用 Cognito 自定义身份验证实现 SNS 身份验证
本文只是对使用aws使用cognito自定义身份验证实践SNS的简单记录，参考文章如上。
2023-01-13 23:06:07
768
原创 H5之移动端如何让滚动条不隐藏
原来是手机浏览器不支持自定义 scroll，只对 PC 端浏览器生效，推荐使用 iScroll 框架来处理移动端的这种问题。然后在想，是不是其他地方改变了滚动条的显示。找了一圈，也没有啊。
2023-01-12 13:21:48
2351
原创 [vite] spawn esbuild.exe ENOENT 报错
[vite] spawn esbuild.exe ENOENT 报错。先检查npm的配置，npm config get ignore-scripts，如果还是不行，就重新安装 esbuild：node ./node_modules/esbuild/install.js。去 issue 中搜索关键词 spawn esbuild.exe，果然有对应的 issue。
2023-01-12 13:10:39
834
原创 Vue3+Vite+TypeScript 中 TS 文件export type类型报错
在 import 的时候将 import {xxx} from 'xxx' 改成 import type {xxx} from 'xxx'使用的环境为Vite+Vue3+TypeScript。
2023-01-12 13:05:22
2166
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人