- 博客(124)
- 资源 (1)
- 收藏
- 关注

原创 web安全之跨站脚本攻击xss
xss 跨站脚本攻击。它指的是恶意攻击者往web页面里插入恶意js代码,当用户浏览该页之时,嵌入其中web里面的js代码会被执行,从而达到恶意的特殊目的。
2024-07-17 17:36:22
1152
1

原创 前端性能优化总结笔记
DNS 的作用是将域名解析为 IP 地址,解析的过程是耗时的,转化后会做本地缓存,我们的优化的目标主要是针对用户第一次访问站点的时候陷入长时间白屏的问题。
2024-06-03 17:57:22
1332
1

原创 不要无脑使用useEffect
如果你要在展示一个列表之前先去过滤出要展示的列表, 你可能想当list改变的时候用个Effect去更新状态,但是当你更新state的时候,react会先调用你的组件函数去计算要展示在屏幕上的内容,并且把这些改变提交的给dom然后重绘,接着react又去跑你的useeffect, 如果你的Effect是立马更新state的,那么就会马上再次渲染重绘一次,为了避免这种情况,应该把这个过滤数据的过程放在组件顶部,这样就会在state更新的时候自动刷新数据,且不会导致重新渲染。
2024-05-16 23:28:54
828

原创 Intersection Observer API探索
我们经常遇到这样的需求——检测一个元素是否可见或者两个元素是否相交,如● 图片懒加载——当图片滚动到可见时才进行加载● 内容无限滚动——也就是用户滚动到接近内容底部时直接加载更多,而无需用户操作翻页,给用户一种网页可以无限滚动的错觉● 检测广告的曝光情况——为了计算广告收益,需要知道广告元素的曝光情况● 在用户看见某个区域时执行任务或播放动画。
2024-04-26 13:42:11
778

原创 react scheduler之任务调度和时间切片学习笔记
我们日常使用App,浏览网页时,有两类场景会制约快速响应:CPU的瓶颈: 当遇到大计算量的操作或者设备性能不足使页面掉帧,导致卡顿IO的瓶颈: 发送网络请求后,由于需要等待数据返回才能进一步操作导致不能快速响应。
2024-01-23 19:05:34
1016

原创 移动端兼容性适配问题
设备像素(又称为物理像素): 指设备能控制显示的最小物理单位,意指显示器上一个个的点。从屏幕在工厂生产出的那天起,它上面设备像素点就固定不变了,和屏幕尺寸大小有关,设备屏幕的物理像素,任何设备的物理像素的数量都是固定的,单位pt,磅css像素(也叫虚拟像素):指的是 CSS 样式代码中使用的逻辑像素,在 CSS 规范中,长度单位可以分为两类,绝对(absolute)单位以及相对(relative)单位。px 是一个相对单位,相对的是设备像素(device pixel)DPR(设备像素比):设备像素比 =
2022-06-07 13:50:00
2008

原创 服务器端渲染 (SSR)
什么是服务器端渲染 (SSR)?客户端渲染:使用 JavaScript 框架进行页面渲染服务端渲染:服务端将HTML文本组装好,并返回给浏览器,这个HTML文本被浏览器解析之后,不需要经过 JavaScript 脚本的执行,即可直接构建出希望的 DOM 树并展示到页面中,最后将这些静态标记"激活"为客户端上完全可交互的应用程序。为什么使用服务器端渲染 (SSR)?优点:更好的 SEO,由于搜索引擎爬虫抓取工具可以直接查看完全渲染的页面。对客户端渲染的页面来说,简直无能为力,因为返回的HTML是一个
2021-08-09 09:38:10
9137

原创 python如何读取文件夹下所有文件及其子文件
def file_name(file_dir): for root, dirs, files in os.walk(file_dir): print(root) #当前目录路径 print(dirs) #当前路径下所有子目录 print(files) #当前路径下所有非目录子文件
2021-01-16 21:00:12
2000
1

原创 聚类指标SI,CH,ACC,NMI,AR,AMI的python函数实现
def console_log(pred, data=None, labels=None, model_name='cluster', newJ=None, verbose=1): measure_dict = dict() if data is not None: measure_dict['si'] = SI(data, pred) measure_dict['ch'] = CH(data, pred) if labels is not None
2020-11-20 10:45:48
3210
5

原创 matlab保存生成的数据用逗号隔开
dlmwrite(‘3c235.csv’,data,‘delimiter’,’,’);3c235.csv:要存的文件名data:要存的数据delimiter:表示要用分隔符隔开','用逗号隔开
2020-09-04 19:37:52
8005
1

原创 从github下载的python的机器学习代码后容易遇到的问题
下载后的代码,可能会出现很多问题,如:1:ModuleNotFoundError: No module named ‘xxx’当遇到这个问题的时候,去pip install 也没有用,报错Could not find a version that satisfies the requirement ,说明这个包在这个文件里,网上下载不了2:python同级目录下引用失败3:报错 No module named ‘ConfigParser’在 Python 3.x 版本后,ConfigParser.
2020-09-03 16:23:28
1691
2

原创 python绘制3d球体网格散点图
前提:如果你的数据是三维的,然后你想把他们分布到一个网格的球体上如果有类别标签,可以分颜色描绘from mpl_toolkits.mplot3d import Axes3Dimport matplotlib.pyplot as pltimport numpy as npfrom itertools import product, combinationsfig = plt.figure()ax = fig.gca(projection='3d')# draw sphereu, v
2020-09-02 13:53:14
4616
5

原创 latex报错:Citation ‘×××ב on page x undefined.与众不同的解决方案
1:首先检查自己的有没有引用错(名字,cite等),如:\cite{inference}2:其次看看当前的.tex文件有没有把参考文件引进来,如:\bibliography{finalbib}3:然后看看参考文件中有没有写对,如大家往往会发现以上都没问题,这就可能是recipe的问题了,本人搜所网上的解决方案,基本都是{ "name": "pdflatex -> bibtex -> pdflatex*2", "tools": [ "p
2020-08-24 10:08:43
37891
18
原创 环境变量 mac命令行
环境变量的作用:当系统运行一个命令的时候,而你没有告诉具体路径的时候,那么就会在PATH里寻找。参考:https://chihokyo.com/post/6/
2024-09-26 11:51:20
111
原创 腾讯面试题:实现合并请求
2:每100ms内收集到的请求才需要合并,超出收集时间放到下一次请求中进行合并;3,每次合并请求上限是20个,超出上限需要放到下一次请求中进行合并。1:通过参数控制该请求是否需要合并;大佬们有啥好的办法吗?
2024-08-06 12:09:38
133
原创 forwardRef和useImperativeHandle到底能做啥
forwardRef是React 提供的一个高阶函数,配合useImperativeHandle, 可以让父组件拿到子组件中某个ref 暴露的方法,比如input的focus事件, 父子组件都需要申明一个ref,forwardRef可以用来包裹子组件,并且把父组件的ref传递到子组件中, 两个ref通过useImperativeHandle进行联动。
2024-08-01 16:37:00
287
原创 面试官问:如果有100个请求,你如何使用Promise控制并发?
concurrentRequests 函数负责控制并发请求的数量。maxConcurrency 是最大并发请求数。makeRequest 是一个模拟网络请求的函数,接受一个 id 参数,模拟请求完成需要一段时间(通过 sleep 函数实现)。enqueue 函数处理请求队列,根据 maxConcurrency 控制并发请求数。使用 Promise.race 等待其中一个请求完成,以便在完成后继续处理新的请求。生成包含100个请求的数组,每个请求都是一个返回 Promise 的函数。
2024-08-01 15:51:10
399
原创 js事件循环机制的理解笔记
每个宏任务里面是一堆同步任务, 执行中遇到异步任务的微任务, 就放入微任务队列, 当前执行栈执行完毕后, 就去检查微任务中的代码,有就执行, 执行完后,事件循环机制再检查宏任务队列, 如果有任务就进入下一个事件循环宏任务, 重复上面的过程。当异步任务完成时,异步任务产生的事件和回调函数会被存储在一个任务队列中(先进先出),, 当执行栈为空时,事件循环会检查任务队列有任务,就会将任务推入执行栈执行。在事件循环中,每个宏任务执行完毕后,都会检查是否有微任务需要执行,然后再进入下一个宏任务开始新的事件循环。
2024-05-21 15:27:01
161
原创 react状态管理
总不能从顶层传递一个setstate下来吧,这多麻烦啊, 特别是如果你的项目中组件嵌套很深的情况, 有个简单的方法,就是从context.Provider的value中 pass down 一个 dispatch 函数 from useReducer via context。○ context.Consumer: 另一种比较少用的, 用来消费context变量的方法( useContext出现之前的一种老的读取context的方法, 不推荐使用, 现在推荐用useContext )
2024-05-17 11:00:11
425
原创 vscode常用插件
● Prettier 或 Beautify:格式化代码风格保持一致。并把setting的文件配置成这样。● GitLens:提供丰富的git信息,如在行号旁显示提交作者、点击后查看详细提交历史等。
2024-04-25 16:28:56
545
原创 nvm安装及使用(mac)
nvm(Node Version Manager)是一个用于在不同版本之间轻松切换Node.js环境的工具,特别是在Unix/Linux和macOS系统上。这步会自动在你的文件中添加nvm配置文件. 如果你用的是zsh, 那就是 ~/.zshrc. 如果你用的 bash,那就是 ~/.bash_profile…如果没有自动安装nvm配置文件,你可以自己添加以下内容到你的文件。如果你没有这个文件, 则新建。然后把上面那段放进去。
2024-04-25 15:54:49
924
2
原创 vscode调试react 最初的源码
webpack 支持 externals 来配置一些模块使用全局变量而不进行打包,这样我们就可以单独加载 react、react-dom,然后把他们导出的全局变量配置到 externals 就行了。不经过 webpack 打包,那就没有 webpack 产生的 sourcemap,不就一次就映射到 React 最初的源码了么。那这么说我们只要让 react-dom.development.js 关联上 sourcemap,就能调试最初的 React 源码了?也就是调试工具只会解析一次 sourcemap。
2023-11-10 14:34:38
1594
原创 vscode调试报错crbug/1173575, non-JS module files deprecated.
参考:https://stackoverflow.com/questions/67191286/crbug-1173575-non-js-module-files-deprecated-chromewebdata-index%EA%9E%89530595551。注意server起来后, launch.json的端口号要保持一致。方法: 先npm start 启动服务器。点击debug按钮报错。
2023-11-09 16:45:00
314
原创 前端性能分析工具
前段时间在工作中,需要判断模块bundle size缩减对页面的哪些性能产生了影响, 因此需要了解前端的性能指标如何定义的,以及前端有哪些性能分析工具, 于是顺便整理了一篇笔记, 以供前端小白对性能这块知识点做一个入门级的了解.
2023-11-03 14:38:12
443
原创 addEventListener与useeffect相撞的火花
由于a是在一秒后更新了一次,因此addEventListener函数也只更新了一次,fn里面的loading变量也只更新了一次, 后续loading的更新对fn参数无效, 所以triggerFn依赖变量a还不够,还需要依赖loading变量。发现:监听事件触发的fn,变量a不更新, loading参数不更新, 监听事件的fn为第一次渲染时候的快照,里面的参数后续不更新。两种方式触发fn, 监听事件:addEventListener;则能保证监听事件触发的fn能拿到最新的变量a。如果将上述监听事件改为。
2023-10-20 15:22:21
316
原创 navigator.clipboard API兼容性问题
Firefox 已经支持了 Clipboard API, 但是ClipboardItem和navigator.clipboard.write 函数的优先级在 Firefox上低于 dom.events.asyncClipboard.clipboardItem , 且这个是默认关闭的. 你需要手动打开它, 但是navigator.clipboard.writeText在Firefox上目前是支持的。复制异步获取的数据是不允许的. 同样, 也不能在用户交互触发的Promise中异步使用它。
2023-08-24 13:46:29
2608
2
原创 ***is not a commit and a branch ‘***‘ cannot be created from it 报错
同样,如果你用tag name或者commit hash同样会产生这样的错误,如果git无法解析所提供给特定提交的分支, 通常是因为它没有最新的远程分支列表。同样你也可以指定某个远程,git fetch buildserver,依次来拉取远程buildserver的所有分支。–all tag包含了多个远程, e.g. origin, buildserver, joespc, etc。如果想查看自己的所有远程, 可以执行命令git remote -v。git fetch默认拉去origin这个远程。
2023-08-11 14:18:54
1743
原创 Error message “error:0308010C:digital envelope routines::unsupported“
【代码】Error message “error:0308010C:digital envelope routines::unsupported“
2023-08-03 14:46:42
176
原创 conic-gradient
代表中点在x轴50% ,y轴30%, 坡度为0.25turn, 开始渲染后面的三个颜色,conic-gradient方法创建了一个由围绕中心点旋转渐变组成的图片。例如orange 6deg 18deg,表示起始角度是6,结束角度是18。第一个颜色占10度,第二个颜色占350度, 其余的用第三个颜色占据。其中0.25turn为90/360=1/4=0.25。
2023-07-09 16:58:38
374
原创 Clip-Path
借助clip-path,我们可以实现一些复杂的animation动画效果,我们先来简单概述一下它的特性,如MDN所描述的CSS特性 clip-path建立了一个裁剪区域,元素在这个区域中的部分显示出来,在这个区域之外的隐藏起来, 比如我们用clip-path建立了一个圆圈,那么在这个圆圈之内的区域是positive的,而之外的区域是negative的,positive渲染出来,而negative被删除.正是利用这种正空间和负空间之间的关系可以实现动画,从而提供了十分有趣的过渡效果.
2023-07-09 14:41:21
471
原创 关于usecallback的坑
原因就出在useCallback, useback对函数做了一次缓存,如果它的依赖是个空数组,就只会在第一次渲染的时候生成一个handleClick函数,后面的每次都渲染都复用之前的函数,并且用useCallback包住的函数,已经形成了一个闭包,闭包内用了外部的变量, 在函数执行完后,并没有销毁这个变量, 所以再次调用这个函数的时候, 还是用的之前的变量。明明useEffect发生在组件挂载完了之后才执行的,触发handleClick的时候,按理说state已经更新了,
2023-06-08 11:00:29
310
原创 什么时候在在react中使用dangerouslySetInnerHTML
由于 React 使用独立于浏览器的系统来操作 DOM 元素,从而防止与 DOM 直接交互。这将使得在所见即所得编辑器中创建的富文本渲染 HTML标签是很困难的。
2023-05-17 00:25:48
283
原创 vscode终端切换或者并列显示设置
下面的红框表示并列显示的终端,点击可以继续split terminal , 也可以unsplit terminal。上面的红框表示非并列显示的终端,点击可以split terminal。
2023-03-07 11:56:40
1292
原创 如何在json文件夹中使用正则表达式
参考文档:https://stackoverflow.com/questions/25426464/regex-pattern-in-json。方法:将转译符号写两次,如下图所示。如果直接像在js中写的话会报错。
2023-02-18 13:31:17
585
原创 react hook
自定义 Hook,可以将组件逻辑提取到可重用的函数中。每次使用自定义 Hook 时,其中的所有state和副作用都是完全隔离的。自定义 Hook 是一个函数,其名称以 “use” 开头(否则React将无法自动检查你的Hook是否违反了Hook的规则),函数内部可以调用其他的Hook。
2022-09-08 10:40:24
286
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人