有关浏览器缓存的几个疑问 浏览器缓存判断流程？ 两种分类协商缓存和强制缓存是什么？怎么判断？ 缓存的资源放在哪儿？ 不同的刷新对缓存的影响？ 浏览器缓存的流程当客户端请求某个资源，首先需要询问浏览器是否存在缓存有以下三种结果： 不存在，那么直接向服务器发起请求，就像第一次访问该网站一样 存在，通过Cache-Control、Expires判断后缓存已失效，那么则使用协商缓存，携带该资源缓存标识向服务器发起请求，服务器根据 http header 判断后决定是否使用缓存，若协商缓存失效重新拉取请求结果则状态码为 200 ，若协商缓存生效那么继续使用缓存状态码为 304 存在，通过Cache-Control、Expires判断后未失效，那么继续使用缓存状态码为 304 图示： 123456789101112131415161718 浏览器发起请求 | ...

一个文字粒子效果,折腾了一些时间，纯粹觉得好玩 点这里看效果 随机初始化部分粒子1、首先要明白每个粒子都是一个对象，都有自己的起点，移动速度，移动轨迹，终点 2、粒子活动轨迹：初始化 —- 聚合拼合文字形状 —- 散开 —- 再聚合 —- 散开… 3、根据动画时间调整粒子的移动速度来安排他们的位置 12345678910111213141516171819202122232425262728293031323334353637383940414243444546class Point{ constructor() { this.startx = Math.floor(Math.random() * docsize[0]), // 初始起点 this.starty = Math.floor(Math.random() * doc...

最近使用 iframe 的时候想要获取 iframe 文档信息的时候遇到了跨域问题，最后使用 postmessage 做父子页面通信解决需求也顺便学习了下 webworker 的使用webWoker 使用依赖 postMessage() 和 onMessage(), 所以先说这两个吧 postMessage && onMessage 提供网页文档之间互相发送和接收信息的功能，可用于解决跨域访问的问题 会在所有页面脚本执行完毕之后(包括方法之后或者之前设置的 timeout 事件)再执行 挂载于 window 对象上 postMessage 语法： otherWindow.postMessage(message, targetOrigin, [transfer]);  message: 发送的数据，不限类型，因为他自己会序列化 &emsp...

vue-cli已经内置了 TypeScript 工具支持，在 Vue (3.x) 中也计划了相当多的 TypeScript 支持改进，很多大佬以及用过的人也都在推荐入坑，而且目前也比较成熟，资源也很丰富，值得入坑 ? typescript官方介绍 TypeScript 是 JavaScript 的类型的超集，它可以编译成纯 JavaScript。编译出来的 JavaScript 可以运行在任何浏览器上我的理解是 TypeScript扩展了JavaScript的语法，为 js 增加了类型机制，引入类，接口，枚举，泛型，方法重载等一系列的概念和方法，丰富了js的使用，而且和 VScode 搭配写起来是真的舒服 全局安装：npm install -g typescript编译命令：tsc hello.ts TypeScript 编写的文件以 .ts 为后缀，用 TypeScript 编写...

看了很多大佬的文章，自己也对项目做了一些优化，其实有很多地方平常码代码的时候稍微注意一下就能节约很多性能开销 1.离屏渲染在离屏canvas上预渲染相似的图形或重复的对象，通俗的解释是将离屏canvas当成预渲染，在离屏canvas上绘制好一整块图形，绘制好后在放到视图canvas中，适合每一帧画图运算复杂的图形 比如你想把一张图片放到canvas上，使用drawImage()方法，有三种写法 123456// 将image放到目标canvas指定位置void ctx.drawImage(image, dx, dy); // 将image放到目标canvas指定位置，指定宽高渲染void ctx.drawImage(image, dx, dy, dWidth, dHeight);// 将image裁剪之后放到目标canvas指定位置，指定宽高渲染void ctx.drawImage(...

最近用canvas蛮多的，canvas写动画也蛮好使的 canvas 由 js 来控制，但用 js 写动画通常3种方法控制时间 setInterval( function, delay ) 在指定的毫秒数下循环调用函数或表达式，直到使用clearInterval清除 setTimeout( function, delay ) 在指定的毫秒数后调用函数或计算表达式 前两个是平时会用得会比较多的，setInterval 和 setTimeout的本质是将回调函数添加到任务队列的尾部等待执行，但是前面的任务到底需要多少时间执行完是不确定的，如果前面堵塞了那么后面就无法执行尤其setInterval指定的是”开始执行”之间的间隔，并不考虑每次任务执行本身所消耗的时间，下一个回调开始执行的时间 = 指定时间 - 回调函数执行的时间，因此实际上，两次执行之间的间隔会小于指定的时间 下面的写...

已经被弃用的：+、~、inpostauthor:、allinpostauthor:、inposttitle:、link:、info:、daterange:、phonebook:、# 被弃用边缘，搜索结果不是非常准确的 symbol example explain .. apple 2010..2014 范围搜索，返回2010到2014，不超过2015的信息 inanchor: inanchor：apple iphone 返回锚文本中包含指定词汇的页面 allinanchor: inanchor：apple iphone 和inanchor类似，返回锚文本中包含所有指定词汇的页面 blogurl: blogurl：阮一峰 谷歌博客搜索 loc: loc:san francisco 查找给定区域的结果 以下是谷歌最新的常用搜索语法，帮助你更快找到你要的信息...

背景介绍ImageData 是canvas的图像数据，由** ImageData() 构造函数返回一个实例化的对象， 三个可读属性 ** data：一个 Uint8ClampedArray 类型的一维数组，包含RGBA 顺序的数据，每4个元素表示一个RGBA 值即对应一个像素, 左上角在数组的索引0位置，像素从左到右被处理，然后往下，遍历整个数组 RGBA：** R - 红色（0-255）、G - 绿色（0-255）、B - 蓝色（0-255）、A - alpha 通道（0-255; 0 是透明的，255 是完全可见的） Uint8ClampedArray（8位无符号整型固定数组）：** 类型化数组表示一个由值固定在0-255区间的8位无符号整型组成的数组；如果你指定一个在 [0,255] 区间外的值，它将被替换为0或255；如果你指定一个非整数，那么它将被设置为最接...

前段时间做了个客户端的项目，主要适用于老师教案管理、远程上课录屏、和学生互动答疑等场景，原生开发对公司来说成本有点大，基于guthub上有各种桌面打包框架so只能前端上了 Electron + vue = product 这是一篇踩坑的记录，没有太深入的原理什么的讲解，主要是码代码过程中碰到的一些暗坑你如果正在写Electron的项目那么你也可能会遇到，这篇文章会给你一些参考 为什么用Electron这是目前大家知道比较多的三种跨平台的桌面框架NWJS https://nwjs.io/HEX http://hex.youdao.com/zh-cn/tutorial/index.htmlElectron https://Electronjs.org/docs | ** Electron ** | ** nw.js ** | ** hex **:—-: | :—...

前段时间做一个windows的桌面应用，vue + electron，涉及到录屏和摄像功能，网上相关的文档蛮少的给需要的人一些参考 如果文章描写有误或者还有更好的方法，请留言告诉我，笔芯 (´▽`ʃ♡ƪ) 背景介绍** 涉及技术：vue、electron、ffmpeg、node ** 关于录屏和摄像对比了两种方法 使用HTML5的api实现 摄像：mediaDevices（获取设备）+ getUserMedia（获取流） + MediaRecorder（存储） 录屏：getDisplayMedia（获取流） + MediaRecorder（存储） ffmpeg + node：FFmpeg是一套非常强大的音视频处理的开源工具，不多介绍，而Electron基于node和chromium，它允许使用node的API以及几乎所有的node模块，这意味这着我们可以调用cmd命令来操作ffm...