Lstmxx的空间

前言几个月前读完了《你不知道的 javascript 上卷》，笔记整理了但是一直忘记发了，今天有空就发了吧。 这本书对于想深入了解 js作用域、闭包、类和原型等原理和运行规则的人，我是非常推荐的。

bt-downloader是一个基于webtorrent和electron的磁力链下载器。 项目地址：https://github.com/Lstmxx/bt-downloader 技术栈 框架：electron + vite + Vue3 + Typescript 前端持久化 pinia 磁力链下载：webtorrent UI：TailwindCSS PrimeVue 数据库: better-sqlite3 ORM: Typeorm 配置保存：electron-store 对于想上手 electron 的朋友，可以看看 webtorrentwebtorrent 是一个基于 WebRTC 的磁力链下载客户端。对比 Aria2 的优势在于 webtorrent 使用 js 写的，同时也有对应的 types 包，所以对于 electron 开发会比较友好。 better-sqlite3对于桌面端应用的数据库选择，一般是选择 sqlite3。而 better-sqlite3 要比 sqlite3 性能好一些，所以选择了 better-sqlite3 ORM 方面则选择了 Typeorm ...

前言最近遇到一个需求，需要将批量选择的图片，批量一个个下载。 触发单个下载在浏览器中触发下载，我们可以借用 a 元素来触发。 12345678910111213141516const downloadFile = async (url: string, name: string) => { const res = await fetch(url); const blob = await res.blob(); const strList = url.split('.'); const type = strList[strList.length - 1]; const downUrl = window.URL.createObjectURL(blob); const downloadElement = document.createElement('a'); document.body.appendChild(downloadElement); downloadElement.href = downUrl; downloadElem ...

前言前段时间实现了一个使用 opencvjs 将印花图与 mask 图原图进行正片叠底的效果，印花使用四方连续的形式拼接，大概效果如下图所示 测试反馈说生成图时操作会变得卡顿，于是便开始着手优化了。 找到问题打开 performance 录下操作，发现有长任务需要优化。 可以发现有一个比较长的任务，我们看看调用栈分析一下哪个函数时间比较长。从图上可以发现整个 task 主要耗时的函数有 getSourceMatAndMaskMat 和 mergeImage 两个。查看一下 render 函数 拆分 long task对于主线程中的长任务可以使用在  Promise  中调用  setTimeout 的方式让出主线程。 12345export function yieldToMain() { return new Promise((resolve) => { setTimeout(resolve, 0); });} 在两个函数之间加上 yieldToMain 再录一次操作发现顺利拆分了 那么继续看看 getSourceM ...

前言最近遇到了一个需求，要将算法的标签品类数据以树形的形式回显到后台管理页面上。通过和后端的沟通，决定了通过 parentCode 和 categoryCode 来让前端组成树形结构。通过接口获取的数据是这样的： 其中当节点为 root 节点时，parentCode 为空字符串。知道数据长啥样，我们就可以构建着手构建树了。 格式化数据树形结构首先我们要先确定树中的 node 类型应该是长怎么样的，明显我们只需要将数据关联起来，而原数据我们希望原封不动保留，所以我们可以用 ts 来定义一下数据结构 123export type Tree<T> = T & { children?: Tree<T>[];}; 知道数据结构长啥样就可以着手写一下函数了。 编写函数在 js 中对象中，变量存储的是对象的引用（地址），我们利用这个特性，便可以通过一次遍历来构建出一颗树。 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474 ...

常见的日志库pino性能高比较小的日志库 winston性能好而且大而全的日志库，一般用于生产。 npm: winston npm: nest-winston winston 文件相关库 npm: winston-daily-rotate-file filters在 nestjs 中，filters 是用来捕获程序中发生的错误。它可以用来 收集错误，生成日志 格式化错误，返回给用户 内置 HTTP 异常在@nestjs/common 中有着常用的 HttpException 来提供给开发人员使用，通过 throw new 对应的 Exception 来触发。 获取 request ip 地址的库npm: request-ip 自定义 logger 模块和 filters首先使用 nest cli 来创建模块 1nest g mo logs 编写 logger 模块 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647import { Module
...

AOP面向切片编程 面向切面的程序设计 IOC控制反转 控制反转是面向对象编程中的一种设计原则，可以用来减低计算机代码之间的耦合度。其中最常见的方式叫做依赖注入（Dependency Injection，简称DI） DI依赖注入 生命周期

项目初始化使用 nest cli 直接搭建即可 nest cli 使用先安装 1npm install -g @nestjs/cli 使用命令新建项目 1nest new project-name 常用命令 1nest g <schematic> <name> [options] Documentation | NestJS - A progressive Node.js framework 目录结构最佳实践可以参考nodepress这个项目的目录结构 环境变量使用@nestjs/config 来进行环境变量的加载，@nestjs/config 内部使用了 dotenv 先安装 cross-env 1pnpm install --save-dev cross-env 修改一下 package.json 脚本 安装@nestjs/config 1pnpm i @nestjs/config 在根目录创建 env 文件夹存放配置文件，一般都是一些 database 的定义 引入123456789101112131415161718192021222324 ...

demo 演示地址：http://chat.lstmxx.cn github 地址：https://github.com/Lstmxx/chatroom 前言服务端推送是一种服务器主动给客户端发送的技术，主要用于实时对客户端进行消息推送，如天气预报、聊天功能等。 HTTP 1.x在 websocket api 出现之前，由于 http1.x 的缺陷，导致通信只能由客户端发起，用户想要获取到实时数据变化，就要不停的向服务器发送请求，这种方法我们一般称为轮询。这种方法在 web 端可以一用，但是在移动端就不行了，想一想你的 app 不停的消耗你的流量发请求到服务器，这会导致用户流量的大量浪费，体现极其差。 1234567setInterval(() => { axios()then((res) => { ··· }).catch(err => { ··· })}, 3000) HTTP 2.0为了解决这一问题，终于在 http2.0 协议里面增加了一个新特性——服务器推送。而 Html5 根据 ...