摘要:
概论 主要是通过一个唯一标识name或者id来过滤判断用户所处的角色是否有路由的权限或者按钮的权限 一般路由都有一个一个name可以作为唯一标识 一般按钮的话,可以自定义一个name作为标识 业务逻辑 后台通过选中路由或者按钮给角色,代表这个角色有数组中name[]的权限,用户或者部门再绑定角色,实 阅读全文
摘要:
概述 requestAnimationFrame 是根据帧数来执行回调函数的,就是屏幕一帧,那 requestAnimationFrame就会执行一次。一般屏幕是60帧,也就是一秒执行60次回调函数. 性能相对定时器settimeout好,因为定时器执行权限在同步任务 微任务之后,会受到其他任务影响 阅读全文
摘要:
需要使用谷歌浏览器的无痕模式 要不然其他浏览器插件的脚本会影响页面的性能判断 使用截图 操作界面 点击分析按钮开始分析 生成分析 建议部分:红色是有必要解决的性能提升建议 红色建议分析: 静态资源大小分析图 点击下面按钮 看到如下静态资源页面 lighthouse文档 文档地址: https://d 阅读全文
摘要:
截图 黄色指的是js执行 紫色指的浏览器渲染 一般只需要看 js 和 render 这2个就行,其他不用看,并从这2个中看出哪里的代码导致阻塞线程比较久。 main线程推测 main线程就是浏览器的主线程,主要负责浏览器的渲染和js代码执行,由此可见,浏览器用于渲染和js执行是一个线程,也就是主线程 阅读全文
摘要:
概述 重绘指的是元素重新绘制,一般性能消耗很小,不用在意,一般修改颜色或者虚拟隐藏都是重绘 回流指的是修改元素宽高或者位置或者获取元素宽高位置等都是回流,性能消耗较大。 重绘(repaint):元素样式改变不影响布局 回流(reflow):也叫重排,当元素的尺寸、结构变化或触发某些属性时,浏览器会重 阅读全文
摘要:
总论 1、js一个tab就是一个进程,这个tab下会有多个线程,主要是主线程、渲染线程、js线程、网络线程资源池; 2、js引擎线程通过dom 之类的api和渲染线程沟通和控制渲染线程的一些页面显示; 3、实际上权威的说法是js引擎和渲染都是在一个线程上执行的,通过dom api之类的沟通,都是在主 阅读全文
摘要:
示意图 理解 事件执行队列执行的顺序首先是同步任务队列,其次是微任务队列、再其次是宏任务队列 测试代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="widt 阅读全文
摘要:
安装依赖 npm install element-plus --save 引入依赖 import './assets/main.css' import { createApp } from 'vue' import { createPinia } from 'pinia' import App fr 阅读全文
摘要:
<script setup> import Mock from "mockjs" let { data } = Mock.mock({ 'data|10-20': [{ 'employeeNo|245-543': 1, name: '@cname', 'password|+1': 123456 }] 阅读全文
摘要:
使用命令初始化 npm init vue@latest 初始化成功后项目截图 具备了store router,还有ts的功能等 阅读全文
摘要:
es6新语法 解构赋值和剩余参数优化 // 对象解构赋值和剩余参数 let abcvdf = { a: 'sdfsdf', b: "sdlfjslfdsf", c: "sdfksjlfdsd" }; // 使用解构赋值获取对象的属性 const { a, b, c } = abcvdf; conso 阅读全文
摘要:
const params = new URLSearchParams();//实现js参数转urlcode编码,直接可以传到url去请求 params.append('param1', 'value1'); params.append('param2', 'value2'); console.log 阅读全文
摘要:
// 生成多少个yield 就能被for of 遍历多少次 function* mytest() { for (let i = 0; i < 5; i++) { yield Math.random(10) * 1000 } } // for of 会迭代生成器里面所有的yield ,有多少个yiel 阅读全文
摘要:
实现代码 Object.prototype[Symbol.iterator] = function () { let keys = Object.keys(this); let index = 0; return { next: () => { return { value: this[keys[i 阅读全文
摘要:
vite配置 上面jsx插件搞好就能在vue项目中使用jsx写法了 代码尝试 ChildWorld.vue <script lang="tsx"> import { defineComponent, defineProps } from "vue" const childAbc = () => { 阅读全文
摘要:
interface mycbdInterface { alert(name: string): void, one?: string } //函数装饰器 const myconsole: MethodDecorator = (...rest) => { console.log(rest, "rest 阅读全文
摘要:
Home.vue 组件中使用测试 <template> <div class="home"> <div> fone:{{ fone }} </div> <div> ftwo:{{ ftwo }} </div> <div> ffour:{{ ffour }} </div> <div> ffive:{{ 阅读全文
摘要:
Home.vue <template> <div class="home"> <div> {{ fone }} </div> <div> {{ ftwo }} </div> <div> {{ ffour }} </div> <div> {{ ffive }} </div> <HelloWorld @ 阅读全文
摘要:
主要是通过子类的prototype直接拷贝一份父类的原型实现继承的方式,这样的优点是简单直接,缺点是多拷贝了一份内存,子类多创建了一份独立内存用于继承父类的原型 function abc(){ this.name="sdlfjslfdjs" } abc.prototype.xx="sdlfsjlfd 阅读全文
摘要:
//interface 定义对象结构测试 interface abc { a: string, //基本数据类型声明都是小写开头 b: number, c?: [string] //定义字符类型的数组 cc?: Array<string>, //Array 是泛型类,用于创建数组对象 f?: Obj 阅读全文
摘要:
function mychild(){ this.x=2342342 } mychild.prototype.y=342342; console.log(mychild.prototype.constructor,"构造函数") console.log(mychild.prototype.const 阅读全文
摘要:
1、js函数对象有3个主要成分 1、就是js原型,也就是prototype,可以被实例继承过去 2、就是原型链,也就是原型链这个栈指针,指向示例对象本身的父类原型 3、就是私有属性,通过this声明,或者直接附加子属性,实例可以独自开辟一份对象继承这些属性 2、实例new 函数对象是什么 1、实例就 阅读全文
摘要:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document< 阅读全文
摘要:
观察者模式代码 观察者模式就是一对多事件,当事件发生的时候通知到多个观察者,所有观察者进行对应的更新操作update执行事件操作。 // 观察者列表 function ObserverList() { this.observerList = []; } ObserverList.prototype. 阅读全文
摘要:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document< 阅读全文
摘要:
https://github.com/DMQ/mvvm 阅读全文
摘要:
实现思路 i18next-scanner 自动扫描代码中的中文 中文作为多语言的key,通过crc32转为语音包的key i18next-scanner 使用 package.json写入script自动运行脚本 npm run scan "scripts": { "dev": "node buil 阅读全文
摘要:
目的是为了方便异步提交form表单的数据,尤其是在单页应用中方便实现表单数据的提交。 代码如下: 本代码可以实现的功能是对js数据对象转formdata数据格式,可以做到对数组的数据处理,可以对filelist文件对象的处理。 具体使用,个人可以依据自己的项目情况进行更改或改进。 注意:不兼容ie9 阅读全文
摘要:
function guid() { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); retu... 阅读全文
摘要:
如上面会导致提示 ipset hash is full 这是因为hash:ip 只能存储固定ip,这样如果你录入的大量的ip段,那么ipset解析的时固定的一堆大量的ip,无法存储很多的大量固定ip,所以会报ipset hash is full 解决方法是 改成hash:net ,这样才能存储ip段 阅读全文
摘要:
导入ipset 这里需要用hash:net才能存储ip段,如果时hash:ip则只能存储固定ip,不能存储大量的ip。用net才能存储ip段,才能有效实现录入大量的ip。 阅读全文
摘要:
ipset介绍 ipset是iptables的扩展,它允许你创建 匹配整个地址集合的规则。而不像普通的iptables链只能单IP匹配, ip集合存储在带索引的数据结构中,这种结构即时集合比较大也可以进行高效的查找,除了一些常用的情况,比如阻止一些危险主机访问本机,从而减少系统资源占用或网络拥塞,I 阅读全文
摘要:
开机自启 以下使用Systemd来实现shadowsocks开机自启。 在里面填写如下内容: 把/home/xx/Software/ShadowsocksConfig/shadowsocks.json修改为你的shadowsocks.json路径,如:/etc/shadowsocks.json 配置 阅读全文
摘要:
xzcat Fedora-Workstation-28-1.1.aarch64.raw.xz | sudo dd status=progress bs=4M of=/dev/sdb 阅读全文
摘要:
测试代码: ==index.html ==websocket.js 心跳检测的目的时什么呢? 一个是为了定时发送消息,使连接不超时自动断线,可能后端设了超时时间就会自动断线,所以需要定时发送消息给后端,让后端服务器知道连接还在通消息不能断。 二来是为了检测在正常还连接着的情况下,判断后端是否正常,如 阅读全文
摘要:
查看有哪些挂载盘: 最后一个一般就是U盘或SD卡了 操作SD卡U盘 进入了操作u盘的功能的命令菜单 输入d代表删除分区操作 输入n代表创建新分区操作 如果要删除所有分区要重复操作d直到删除了u盘所有分区 然后在创建u盘分区,输入n创建分区 输入l可以查看有哪些分区 最后输入w保存修改 最后还要格式化 阅读全文
摘要:
1. 在最后一行添加启动命令,比如: 这里 主要是通过冒号隔开 或者多个也可以这样: 2.通过bashrc 添加 添加方法如上。 阅读全文
摘要:
首先到gogs文件的scripts里面找到启动文件 ==然后拷贝到/etc/init.d 上面的gogs是启动文件。 内容如下: 修改gogs启动文件里gogs的安装地址: 提交执行权限 最后添加到开机启动 阅读全文
摘要:
/*@file {dom} 目标文件输入框*/ /*@tar {dom} 预览图片目标*/ /* previewImage(this,'#preview'); //预览图片的功能*/ function previewImage(file,tar) { var MAXWIDTH = 120; // 最大图片宽度 var MAXHEIGHT = 120; // 最大图片高度 ... 阅读全文