2023年10月17日
摘要: 一 document.execCommand 现阶段 项目中 使用方法document.execCommand 可直接操控选中文本,添加属性(操控文档)。但是由于fdocument.execCommand 方法兼容性不好,浏览器之间的实现不一致,没有一个统一的标准。且自定义程度不高。官方已经将该方法 阅读全文
posted @ 2023-10-17 09:46 长安城下翩翩少年 阅读(103) 评论(0) 推荐(0) 编辑
摘要: Commonjs (同步模块加载,运行时加载) exports 和 moudle.exports 的区别? exports 是 module 中exports 对象 的引用。当模块中使用了 moudle.export = {} 的时候,所有 exports 都会失效。exports 只能 expor 阅读全文
posted @ 2023-10-17 09:45 长安城下翩翩少年 阅读(9) 评论(0) 推荐(0) 编辑
摘要: 原则 不要阻塞主线程 将长任务进行拆分 (大图切片,因为image.decode 大图会形成长任务) Js 单线程 与长任务 主线程是浏览器中大多数任务运行的地方。它被称为主线程是有原因的:几乎所有编写的JavaScript都在主线程中工作。 主线程一次只能处理一个任务。当任务持续时间超过某一点(确 阅读全文
posted @ 2023-10-17 09:44 长安城下翩翩少年 阅读(49) 评论(0) 推荐(0) 编辑
摘要: 一 画板现阶段性能瓶颈 图片内存占用过高 操作(拖动,缩放)导致的过度重绘制 react、redux数据更新机制导致绘图出现延迟 二 内存优化 现阶段内存的瓶颈在哪里?到底是哪些东西占用了内存? 优化点1:地图Map中的图片大小尽可能小 现阶段地图所有的数据都是走的 服务端(非webp图片)的百分之 阅读全文
posted @ 2023-10-17 09:40 长安城下翩翩少年 阅读(42) 评论(0) 推荐(0) 编辑
摘要: 一 升级react 18 React 18 改变 所有setState 都是异步,不管是否在react的“管辖范围内”。原来在定时器,在监听函数中是同步的。 Root 书写方式 需要改变 Router 需要改变?? 二 启用并发渲染 useDeferredValue const [text, set 阅读全文
posted @ 2023-10-17 09:38 长安城下翩翩少年 阅读(41) 评论(0) 推荐(0) 编辑
摘要: 一 JSON - javascript Object Notation(符号) 基于JavaScript原生语法,能够序列化对象、数组、数值、字符串、布尔值和 null。 JSON.parse(s,(key,value)=>{ console.log(key,value); // s 为字符串 '" 阅读全文
posted @ 2023-10-17 09:37 长安城下翩翩少年 阅读(24) 评论(0) 推荐(0) 编辑
摘要: indexDB介绍与封装 一 前端缓存的发展 Cookie: 内存小4kb,现多用于服务端存一些数据在客户端 localstorage/sessionStorage :5M左右,同步缓存,读取速度较快 Cache Storage 与 serviseWorker 配合使用。 (ios 浏览器 很小,其 阅读全文
posted @ 2023-10-17 09:37 长安城下翩翩少年 阅读(602) 评论(0) 推荐(0) 编辑
摘要: 画布拖动策略:为提升性能,防止画布(canvas) 跟随mouseMove事件不断重绘,选择先移动画布容器,在鼠标mouseup 事件执行时,重绘画布,让画布容器的还原。 具体实现 // 视口宽高: 为画板可视区域的宽高,不包含header高度; const clientRect = { width 阅读全文
posted @ 2023-10-17 09:35 长安城下翩翩少年 阅读(26) 评论(0) 推荐(0) 编辑
摘要: 设计原则 开放封闭原则 对扩展开放,对修改关闭 例子1 - axios 设计符合开闭原则(通过axios.interceptors 对外部扩展进行开放)、以及redux中间件设计方式 例子2 enum MemberName { normal:'normal', vip:'vip', vipPlus: 阅读全文
posted @ 2023-10-17 09:34 长安城下翩翩少年 阅读(4) 评论(0) 推荐(0) 编辑
摘要: FileReader 读取 file/blob 数据 FileReader.readAsArrayBuffer() 异步方法, 读取完成 result 属性中保存的将是被读取文件的 ArrayBuffer 数据对象。 FileReader.readAsDataURL() : 一旦完成,result属 阅读全文
posted @ 2023-10-17 09:31 长安城下翩翩少年 阅读(41) 评论(0) 推荐(0) 编辑
摘要: 一 相对地址转绝对地址 使用场景:某个函数需要在使用的时候传递一个 地址,函数内部会利用这个地址 进行某些操作 (比如生成worker,生成image,数据转化等) 如下:如果直接使用相对位置,会根据url 进行拼接。但当 一些利用利用了router的单页项目,页面的url 并不能获取到 真实的fi 阅读全文
posted @ 2023-10-17 09:30 长安城下翩翩少年 阅读(41) 评论(0) 推荐(0) 编辑
摘要: 一 调用栈 我们知道栈的特点是,先进后出的。那么函数的执行上下文栈又是怎么样的呢? 先看这段代码 var a = 2 function p2(b,c){ return b+c; } function p1(b,c){ var d = 10; result = p2(b,c); return a + 阅读全文
posted @ 2023-10-17 09:29 长安城下翩翩少年 阅读(6) 评论(0) 推荐(0) 编辑
摘要: let 和 var的区别 变量声明提升 暂时性死区 不允许重复声明 块级作用域 (函数作用域,全局作用域 - 用函数作用域 (匿名立即执行函数表达式)代替块级作用域) 不与全局对象挂钩(window,global,self, globalThis) 变量的结构赋值(数组,对象-原型链上也可-包装类型 阅读全文
posted @ 2023-10-17 09:26 长安城下翩翩少年 阅读(3) 评论(0) 推荐(0) 编辑
摘要: 全局报错捕获 js window.addEventListener('unhandledrejection', event => { let request = event.target; // IndexedDB 本机请求对象 let error = event.reason; // 未处理的错误 阅读全文
posted @ 2023-10-17 09:25 长安城下翩翩少年 阅读(4) 评论(0) 推荐(0) 编辑
摘要: 一 基础概念 Webpack 是什么? 答:现代javascript构建工具,静态资源打包工具 什么叫构建 ? 构建就是把我们在开发环境写的代码,转换成生产环境的代码。构建过程应该包括 预编译、语法检查、词法检查、依赖处理、文件合并、文件压缩、单元测试、版本管理等 Vite 利用 浏览器 支持ES 阅读全文
posted @ 2023-10-17 09:24 长安城下翩翩少年 阅读(6) 评论(0) 推荐(0) 编辑