- 博客(18)
- 收藏
- 关注
RSS订阅原创 深入了解 Broadcast Channel API 与 IFrame 的结合使用
跟随着公司通过微前端架构开发低代码频台时发现个问题，公司选用的是通过iframe来嵌套一个个小项目，既然属于一个大项目，那必定避免不了通讯的问题。原本使用的是postMessage来传输数据，该方式的优点显而易见，支持跨源通信。但是这也成了一个大问题：浏览器中避免不了会装一些学习插件，这些插件有的也会使用该方式，所以会有互相影响的顾虑。于是在 MDN 网站闲逛的过程中发现了一种新兴的机制——Broadcast Channel API。
2024-09-26 15:54:24
1191
原创 探索 DOM 接口：AbortSignal
上一篇文章中了解了，紧接着就不得不提到它的重要组成部分——。它是生成的对象，专门用于向异步操作传递取消信号。在本文中，我们继续深入探讨的概念、用法以及实际应用场景。是一个表示信号的对象，表示某个异步操作的取消状态。它由创建，异步操作会监听这个信号，从而在适当的时机中止操作。每个实例都会自动生成一个对象，当调用时，关联的信号会触发取消事件，异步操作可以根据该信号停止执行。是管理 JavaScript 中异步操作的重要工具，特别是在控制网络请求和事件监听时，发挥着重要作用。它通过与。
2024-09-26 09:48:06
681
原创 探索 DOM 接口：AbortController 的应用与实现
最近在优化项目过程中，常常碰到个问题：用户在填写表单或浏览页面时，可能会意外地点击返回或切换到其他页面。此时正在进行的网络请求（如数据加载）仍在后台运行，浪费了资源并可能导致不必要的状态更新。这让我意识到，我需要一个优雅的解决方案来控制这些异步操作的取消。于是，我发现了，它为我提供了管理异步请求的有效手段。是 JavaScript 提供的一个 Web API，用于控制和取消异步操作。它特别适用于处理支持取消操作的场景，例如网络请求、定时器和事件监听。通过使用。
2024-09-25 11:24:19
701
原创 反向代理和正向代理的区别
正向代理：客户端通过代理服务器访问目标服务器，主要用于绕过访问限制、提高隐私保护等。反向代理：客户端通过代理服务器访问后端服务器，主要用于负载均衡、安全和性能优化。Nginx 作为反向代理，能够在大型网站和应用中提供高效的负载均衡和缓存服务。
2024-09-23 15:37:18
1158
原创 【面试】回流和重绘
当你在面试中谈论网页性能优化时，两个重要但容易被忽视的概念是"重绘"和"回流"。在这篇文章中，我们来谈谈它们，为什么它们如此重要，以及如何在面试中聊起它们。如果它们发生太频繁，网页加载会变得缓慢，用户体验下降。：如果你需要多次修改元素的样式或布局，最好将这些操作合并在一起，减少回流次数。，比如改变颜色、背景或阴影，但不改变它的位置时，浏览器会重新绘制这个元素。：对于频繁触发的事件，如窗口大小变化，可以使用节流和防抖来延迟处理，减少回流次数。，可以通过GPU硬件加速，减少了重绘和回流的开销。
2023-10-26 23:28:39
301
原创 cross-env：实现跨平台环境变量管理的利器
cross-envcross-env是一个有用的工具，它简化了跨平台开发中环境变量的设置过程。它允许开发人员编写跨平台的脚本，确保代码在不同操作系统上的可移植性。通过示例，我们展示了如何在项目中使用cross-env来设置环境变量，以便在不同环境中进行开发和部署。无论您是开发前端应用、后端服务，或者其他类型的 Node.js 项目，cross-env都可以为您简化跨平台开发的环境配置工作，提高开发效率。
2023-10-21 10:44:33
1010
原创 Uniapp 踩坑：‘use‘ is not exported by ‘node_modules\@dcloudio\uni-mp-vue\dist\vue.runtime.esm.js‘
是 Vue2 安装插件的方式，而在 Vue3 版本中，并不能到处 vue 这个包，故在编译时会有以下的报错。把import vue删了，vue.use 也不需要。想在 uniapp vue3 的项目中使用。，尝试着直接套用官方的模板，下面直接贴上代码。官方的实例应该还是停留在。
2022-11-19 22:07:28
7282
2
原创 好用或好玩的小网站
CSSflex布局的小游戏（FLEXBOX FROGGY）：https://flexboxfroggy.com/grid布局的小游戏（GRID GARDEN）：https://cssgridgarden.com/
2022-02-24 10:00:42
2224
原创 自定义滚动条
直接上代码.box { width: 150px; height: 200px; overflow: scroll; margin: 100px;}.scrollbar { width: 30px; height: 300px; margin: 0 auto;}/*滚动条整体样式*/.box::-webkit-scrollbar { width: 10px; height: 1px;}/*滚动条滑块*/.box::-webkit-scrollbar
2022-02-23 17:45:37
185
原创 ES6 Symbol.toPrimitive
先看看 MDN 的解释：Symbol.toPrimitive是一个内置的 Symbol 值，它是作为对象的函数值属性存在的，当一个对象转换为对应的原始值时，会调用此函数。const object1 = { [Symbol.toPrimitive](hint) { if (hint === 'number') { return 42; } return null; }};console.log(+object1);// expected output:
2022-02-23 11:57:45
740
原创 ES6 Symbol.hasInstance
先看看 MDN 的解释：Symbol.hasInstance用于判断某对象是否为某构造器的实例。因此你可以用它自定义 instanceof 操作符在某个类上的行为。class Array1 { static [Symbol.hasInstance](instance) { return Array.isArray(instance); }}console.log([] instanceof Array1);// expected output: true简单的说，就是当其他对
2022-02-23 11:45:32
578
原创 安装MySQL Install/Remove of the Service Denied错误的解决办法
在 Windows 环境下安装 MySQL在 cmd 中选择到 MySQL 安装目录下的 bin 文件夹中执行：mysqld --install报错：解决方式：打开cmd.exe程序的时候选择“用管理员身份打开”。扩展：Windows 系统下怎么使用管理员身份运行 cmd.exe 程序一、打开我的电脑，在地址栏输入以下内容：C:\Windows\System32二：找到cmd.exe程序，并右键单击后，选择“以管理员身份运行”...
2022-02-20 12:35:32
1164
原创 vue-cli babel.config.js文件引入vant报错Cannot find module ‘babel-plugin-import‘
问题在跟着网上的vue项目的项目准备过程中，在 babel.config.js 文件中需要引入 vant 组件库。代码大概如下：module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], plugins: [ ['import', { libraryName: 'vant', libraryDirectory: 'es', style: true }, 'vant'
2021-12-15 16:48:03
3125
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人