沐语`Blog

防抖防抖，就是指触发事件后 n 秒后才执行函数，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。 防抖的作用是为了减少函数的执行次数，避免在短时间内多次触发同一事件而导致重复执行某一操作或发送请求等问题。 当使用v-debounce:click绑定到一个元素上时，会在点击事件处理程序中增加防抖的逻辑，确保点击事件只有在停止连续触发500毫秒后才会被触发。 12345678910111213141516171819202122232425data() { return { num:1 }},methods: { handleClick() { console.log(this.num+" click!"); this.num++ },},//自定义指令directives: { debounce: { inserted(el, binding) { ...

CSS 布局网上写的笔记挺全的，随便记录一下，布局重点看flex布局，Grid 网格布局，媒体查询；记一些css函数，选择器。 w3school 备忘清单 display 布局属性每个 HTML 元素都有一个默认的 display 值，具体取决于它的元素类型。大多数元素的默认 display 值为 block 或 inline 设置元素的 display 属性仅会更改元素的显示方式，而不会更改元素的种类。因此，带有 display: block; 的行内元素不允许在其中包含其他块元素。 position 定位属性position 属性规定应用于元素的定位方法的类型。 有五个不同的位置值： static relative fixed absolute sticky 元素其实是使用 top、bottom、left 和 right 属性定位的。但是，除非首先设置了 position 属性，否则这些属性将不起作用。 position: static; HTML 元素默认情况下的定位方式为 static（静态）。 静态定位的元素不受 top、bottom、left 和 rig ...

利用RestTemplate发起远程调用的代码： 1234//2.远程查询user//String url="http://localhost:8081/user/"+order.getUserId();String url="http://userservice/user/"+order.getUserId();User user = restTemplate.getForObject(url, User.class); 存在下面的问题： •代码可读性差，编程体验不统一 •参数复杂URL难以维护 Feign替代RestTemplateFegin的使用步骤如下： 1）引入依赖在服务的pom文件中引入feign的依赖： 1234<dependency> <groupId>org.springframework.cloud</groupId> <artifactId>spring-cloud-starter-openfeign</artifactId></dependen ...

定位MySQL慢查询MySQL慢查询是指执行时间超过预设阈值（一般是几毫秒）的查询语句。慢查询会造成MySQL服务器的性能下降，并可能导致服务器宕机。一般来说，慢查询的原因主要有以下几个方面： 没有使用索引：如果查询语句中没有使用索引，那么MySQL就需要进行全表扫描。一般情况下，全表扫描会导致查询速度变得很慢。 语句结构不合理：有些查询语句的结构不合理，比如使用了不必要的子查询。这样的查询语句的执行速度会变得很慢。 数据库表设计不合理：如果数据库表设计得不合理，这也会导致查询速度变得很慢。 服务器资源不足：服务器的资源不足也可能导致MySQL慢查询。如果服务器的内存或磁盘空间不足，那么MySQL的查询速度就会变得很慢。 定位MySQL的慢查询可以通过以下几个步骤实现： 开启慢查询日志 将MySQL的慢查询日志打开，可以记录执行时间超过某个阈值的查询语句。可以在MySQL的配置文件中设置慢查询阈值和是否打开慢查询日志： 12slow_query_log = 1long_query_time = 1 分析慢查询日志 通过分析慢查询日志，可以找出执行时间较长的SQL语句和执行次 ...

收藏值得推荐: 博客园、文章、音乐馆 镜像站阿里巴巴开源镜像站 清华大学开源软件镜像站 华为开源镜像站 腾讯开源镜像站 中科大USTC镜像源 Free ChatGPT ChatGPT AI 工具Maven仓库 菜鸟工具 - 不止于工具 Linux命令大全 站长工具 - 极速数据 HelloGitHub 前端Axios TinyPNG –压缩 图像 vue-UI库： ElementUI Vant Weapp 图表 Apache ECharts v-charts 免费图标： Font Awesome Bootstrap图标库 IconPark 部署： Netlify Vercel

Redis缓存穿透是指恶意的用户或攻击者，通过传入不存在于缓存中的查询信息，获取某些数据。由于这些查询结果是从数据库中获取的，所以这些查询结果会占用更多的资源，导致性能下降和服务不可用。 Redis缓存穿透的解决方案有以下几种： 布隆过滤器 布隆过滤器是一种数据结构，可以用于快速检测一个元素是否存在于一个集合中。它可以大大减少查询数据库的次数，从而提高性能和可用性。 缓存空对象 将空对象缓存到Redis中，当查询信息不存在于Redis中时，返回空对象而不是从数据库中获取数据。这种方法可以防止重复查询，从而减少数据库负载，提高性能和可用性。 数据预热 数据预热是通过定时查询一些热门数据并将其缓存到Redis中，来提高缓存命中率的一种方法。这种方法可以减少查询数据库的次数，从而提高性能和可用性。 缓存雪崩 缓存雪崩是指在某个时间窗口内，缓存同时失效，导致所有的数据请求都访问数据库。为了避免缓存雪崩，可以设置缓存过期时间的随机性或者不同的过期时间来避免同时失效。 总结： 通过合理的使用Redis缓存，可以大大提高性能和可用性。鉴于Redis缓存穿透的危害性，需要对其进行有效的 ...

值得推荐: Vue快速入门学习笔记 window.open("https://www.cnblogs.com/melodyjerry/p/13768594.html")

npm基础包的安装/更新/卸载装包,默认安装最新版本，直接npm i 会安装package.json中dependencies的所有包 1npm i 或者 npm install 安装指定版本 1npm i xx@1.0 装包到生产环境（也就是上线后需要的依赖），在package.json的dependencies中生成版本信息 1npm i -S 或者 npm i --save 装包到开发环境（也就是开发时需要的依赖），在package.json的devDependencies中生成版本信息 1npm i -D 或者 npm i --save-dev 精确安装指定版本的包到生产环境。精确的意思就是，什么版本就是什么版本，版本号前面的^ 会消失掉。有^ 代表是补丁版本 1npm i xx@1.0 --save-exact 卸载包 1npm uninstall xx 更新包，默认更新到最新 1npm update xx@1.0 检查包是否过时，默认列出所有过时的包 1npm outdated 安装同一个包的不同版本，如要引入1版本，则import ‘xx1 ...

QuickWord一款快速查词的桌面小工具 A desktop gadget for quick word search 基于百度翻译开发平台API设计 简介一直找不到合适的桌面轻量翻译翻译工具，索性自己DIY一个 技术选型： electron 太大 ——pass C# 不会 ——pass Java/JavaFX ——pass 为什么使用Python？ ……en 只会基于浏览器的界面开发😂，查了一下桌面应用开发的技术，学习成本太高。 考虑使用VB，但太久没写。 最后用的Python，没怎么学过py，但好在有现成的工具包（面向百度编程） 安装直接安装或解压使用：安装包 | 解压包 源码安装 安装pyinstaller 1pip install pyinstaller 打包程序 1pyinstaller -w QuickWord.py 打包详细教程可参考 使用配置百度翻译 重启工具 翻译 快速翻译 ctrl+c 复制要翻译的内容 ctrl+b 快速翻译 shift+esc 退出快速翻译

什么是 JWT?JWT （JSON Web Token） 是目前最流行的跨域认证解决方案，是一种基于 Token 的认证授权机制。 从 JWT 的全称可以看出，JWT 本身也是 Token，一种规范化之后的 JSON 结构的 Token。 JWT 由哪些部分组成？JWT 本质上就是一组字串，通过（.）切分成三个为 Base64 编码的部分： Header : 描述 JWT 的元数据，定义了生成签名的算法以及 Token 的类型。 Payload : 用来存放实际需要传递的数据 Signature（签名） ：服务器通过 Payload、Header 和一个密钥(Secret)使用 Header 里面指定的签名算法（默认是 HMAC SHA256）生成。 JWT 通常是这样的：xxxxx.yyyyy.zzzzz HeaderHeader 通常由两部分组成： typ（Type）：令牌类型，也就是 JWT。 alg（Algorithm） ：签名算法，比如 HS256。 1234{ "alg": "HS256", "typ& ...