全部文章
共 1306 篇文章
我是如何实现网页颜色自适应的
前言 不知大家有没有留意过，当前大部分 App 或网页中，很少存在允许用户完全自定义要展示信息的颜色的功能。 例如在钉钉的自定义表情中，只允许用户从一组预设的配色中随机切换： 再比如笔记应用 Notion 虽然允许用户改变文本颜色，但也只允许在一组预设色值中选取： 原因无它，配色，不是一件容易事。 对于大众用户而言，没什么颜色理论知识，很可能挑出来的颜色在应用中很难看、看不清，这会极大的影响用户的使用体验（即使是用户自己造成的）。 因此...
通过PWA，我的博客也能离线阅读啦
前言 我经常看到有些博客站点拥有离线观看的功能，就算是没有网络，刷新页面依然可以获得数据。我对这一功能甚为好奇，了解后才发现这一技术是PWA。 何为PWA PWA又为渐进式Web应用，在MDN上是这样说的， 如何实现 构建一个PWA程序主要是用到 技术，这一项技术在现代浏览器中默认开启。 以上是一张官方的图，讲解了 的工作流程，简单来说就是 注册程序 安装程序 激活程序 获取数据 版本更新后再次获取数据 。 注册程序 安装程序 定义版本...
JSON 的键为什么必须有引号？
00\. 写作背景 如题， 为什么 JSON 的键被设计为必须有引号 ？ 但是，问题无厘头，不代表无意义。Vite 源码的 pnpm 配置使用了一种 YAML 格式的配置文件，很多工具和语言也支持 YAML。 举个栗子，这是格式化工具 Prettier 官网的示例： 粉丝请注意，YAML 和 JSON 一龙一猪， 键名真的可以没引号 ！那么，强制要求键名加引号、而且必须是双引号的 JSON 到底在搞什么飞机？ 有时候，乍一看是几何题，其...
React中优雅的插入SVG图标，将SVG文件转换为React组件
在设计稿中我们经常能见到同一种图标不同颜色，如果直接使用IMG标签插入SVG文件的话是没有办法修改颜色的，就要保存多个SVG文件来显示不同颜色。 在react中把SVG文件转换成组件，使用CSS修改SVG颜色。只需加载一个SVG文件，就可以通过CSS展示多种颜色。从而实现减少包体积、减少静态资源请求。 在react中插入SVG 首先安装插件 修改 配置： 调用 控制台 接下来你就可以使用CSS来处理你的svg文件了 在调用过程中如果遇到...
Web Worker知道吧？怎么动态的创建Web Worker呢
前言 浏览器是一个多进程多线程的架构，以 为例，每一个 页都是一个单独的渲染进程。在这个渲染进程下，有 执行线程和渲染线程。 执行线程与渲染线程是互斥的，这就导致了我们在执行一些长任务的时候，会阻塞渲染线程，具体的表现可能有： 1. 动画卡顿 2. 点击按钮/输入框输入没反应等等 在 中，浏览器提出了 这种技术，它允许在主线程之外运行脚本，这样就可以在后台执行一些耗时的任务，而不会阻塞 执行线程，从而提高了 应用的性能和响应性。 web...
什么是 WebRTC
WebRTC（Web 实时通信）是一种可以在浏览器中实现点对点（Peer to Peer）通信的技术标准和开源项目。它使得浏览器和移动应用能够进行实时语音、视频和数据交换，无需安装插件或第三方插件。WebRTC 提供了一组 API，使开发者可以轻松地构建各种实时通信应用程序，如视频会议、语音电话、文件共享等。 基本概念 WebRTC 的核心包括三个主要 API： 1. MediaStream API : 获取摄像头和麦克风的访问权限，并...
如何实现渐变色 圆角与倒角 边框
1、完整代码及样式示例 1.1. 渐变色 圆角/倒角 效果图 圆角 倒角 1.2. 渐变色 圆角/倒角 完整示例代码 渐变色色值：linear gradient(270deg,rgba(34,117,211,1) 0%,rgba(14,244,243,1) 49%,rgba(34,117,211,1) 100%) 边宽：5px 宽：300px 高：150px 圆角值： 左上25px 右上30px 右下35px 左下40px 类型：圆角（...
领导让前端实习生在网页上添加一个长时间不操作锁定电脑的功能
前情提要 大约一个月前，公司的医疗管理系统终于完工上线。后面一个周一，领导叫大家开会，说后面没有项目进来了，用不了这么多开发人员，原地宣布裁员。再后一周后，花 2000 招了个实习生，工作内容为系统维护。 工作内容 领导：由于我们工作内容很简单，事情轻松，基本就在页面上加加按钮就行，所以工资相对较少一些，是否接受？ 实习生小李：能开实习证明吗？ 领导：能的。 实习生小李：好的，谢谢老板。 领导：什么时候能入职？ 实习生小李：现在。 工作...
一个永远不会完成的 Promise 是否会造成存储泄漏
已经火了很多年了，网上的各种对 的解读也非常之多，从 规范到手撕源码等系列的文章也是层出不穷，都是在扒一些底层原理，对于我们实际的业务遇到的问题以及使用细节和场景等方面的讨论却是相对较少的。 今天就来聊一聊一个比较特殊的问题，那就是一个永远不会完成的 是否会造成存储泄漏。 省流结论：内存泄漏是你的代码写的有问题，而不是 的问题， 本身是不会造成内存泄漏。 为什么会有这个问题 根据 的特性，我们知道 有三种状态： 、 、 ，而且 的状态是...