- 博客(638)
- 资源 (5)
- 问答 (1)
- 收藏
- 关注
原创 HTTP 无状态 vs 有状态协议
HTTP无状态与有状态协议对比 HTTP本质是无状态协议,每个请求独立处理,服务器不保留上下文(如TCP三次握手、FTP会话等有状态协议需维护连接状态)。实际应用中,通过Cookie/Session等技术模拟状态(如登录态)。无状态设计提升扩展性(服务器无亲和性要求),但需应用层自行管理状态。RESTful API强调无状态约束,要求请求必须自带完整上下文信息。有状态协议(如WebSocket)通过持久化连接提高效率,典型如TCP的状态机机制。
2026-06-17 09:39:26
399
原创 在 Git 中配置 Aliases(别名)
在 Git 中配置 Aliases(别名) 是提高开发效率的神器。它不仅能让你少敲键盘,还能把复杂的命令组合成简单易记的短指令。下面列出了我个人在使用 Git 时发现的一些提高生产力的别名。你可以直接使用它们,或者根据需要进行修改。
2026-01-26 13:39:28
250
原创 高精度操作系统检测函数
摘要 该JavaScript函数detectOS()提供高精度的操作系统检测功能,通过分析用户代理字符串(UA)识别设备操作系统及其版本。函数支持移动端(iOS/Android)、桌面端(Windows/macOS/Linux)及小众系统(ChromeOS/FreeBSD等)的检测,并能返回系统类型、版本号及设备类型信息。检测逻辑采用优先级规则匹配,包含详细的版本解析算法,如区分Windows 10/11、macOS版本名称映射等。当UA不可用时返回"Unknown"结果,确保函数健壮性
2026-01-04 16:05:24
360
原创 360° 拖动旋转的角度计算原理
这篇文章演示了如何通过鼠标点击或拖动来计算相对于中心点的角度。示例使用原生HTML+JS创建了一个正方形区域,中心点和跟随鼠标的蓝点标记位置变化。核心原理是通过计算鼠标与中心点的坐标差值,使用Math.atan2函数得出原始角度,再经过450度转换修正为0°在正上方、顺时针递增的显示方式。代码实时更新角度值和蓝点位置,清晰展示了从坐标到角度的转换过程。
2025-09-05 18:04:21
1180
原创 如何中断大批量 dom 元素渲染的循环
前端优化关键技巧:通过"让出主线程"解决大批量DOM渲染卡顿问题。浏览器主线程负责JS执行、渲染和交互,长时间任务会阻塞UI响应。技巧核心是使用setTimeout或await Promise分片执行任务,例如每100次DOM操作插入await new Promise(resolve => setTimeout(resolve, 0)),让浏览器有机会处理UI更新。示例代码展示了如何通过异步分片渲染1000个元素,并提供中断机制,实现流畅的用户体验。这种技术适用
2025-08-01 10:54:31
980
原创 fetch 请求流式chunk 处理数据
摘要 本文介绍了一种基于Node.js的流式数据渲染方案,模拟ChatGPT的流式请求模式。通过不设置Content-Length头,服务器自动启用chunked transfer编码,实现边计算边传输数据的效果。文章提供了Node服务端代码示例,每100ms推送10条矩形框数据,以及前端使用fetch API处理流式响应的完整实现方案。重点解析了如何将二进制流转换为结构化数据的过程,并比较了fetch与XHR的优劣,以及chunked传输与Server-Sent Events的区别。方案适用于需要实时渲染
2025-06-30 14:11:04
1210
原创 web项目实现PWA和Browsersync的安装及使用方法
所以这里使用一个插件方便测试。npm run build,再通过browser-sync开本地服务器。可以同时在PC、平板、手机等设备下进项调试。即在任何一设备上操作,其他设备也随之改变,大大提高了测试效率。会修改 public 文件夹,生成很多 icon 作为桌面显示图标。去配置名字和颜色涉及添加至桌面的应用名,及桌面进入的启动页面的长相。,注册 Service Worker,并监听生命周期的事件。省去手动F5的事件,更重要的是。会修改项目,在 src 目录下生成这个文件。是浏览器同步测试工具,
2025-06-11 17:25:36
537
原创 为什么上传大量大文件推荐是使用 app 应用为不是 web 浏览器下载上传呢?
Web 浏览器在处理大文件上传/下载时存在性能和稳定性的天然限制,而原生应用(App)可以绕过这些限制,提供更高效、稳定和灵活的文件传输体验。浏览器受限于内存分配、线程模型和文件系统访问能力,无法像 App 那样直接优化读写操作。此外,浏览器在网络稳定性、断点续传、交互体验和权限管理方面也存在不足,而 App 可以通过流式处理、后台下载和更丰富的交互功能提升用户体验。虽然 Web 技术如分片上传、PWA 和 WebAssembly 尝试解决这些问题,但 App 仍是大文件传输的更优选择。开发者可结合 Web
2025-05-19 15:35:55
848
原创 如何将 Build at、Hash 和 Time git 的 Tag 号等构建信息,自动写入一个 JSON 文件
构建信息自动写入一个 JSON 文件(比如 ),你可以在 Vue CLI 项目中通过 Webpack 插件机制实现这个目标。
2025-05-08 10:34:45
1104
原创 Paper.js 的 simplify()方法在绘制高精度path时,消失问题
分辨率 + 缩放感知型”的简化策略,使得用户无论在什么视图比例下都能获得自然、合适的路径简化效果。✨。
2025-05-07 13:09:32
819
原创 darwin 是什么操作系统平台
上面盖了不同的漂亮楼房(比如 macOS 和 iOS)。)、设备驱动、系统基本服务,还有一些BSD类Unix组件。(因为 macOS 就是基于 Darwin 构建的呀)当前运行的 nodejs 的平台是“这些系统的内核和底层基础!比如,当你在开发中看到什么。👉 它包含了内核(叫做。通俗一点说,就是——
2025-04-28 11:10:53
2837
原创 探究生成一个 svg图像,stroke-width 的属性值为小数时在JS 生效但 TS 环境下不生效的现象
探究生成一个 svg图像,stroke-width 的属性值为小数时在JS 生效但 TS 环境下不生效的现象
2025-04-09 14:07:34
618
原创 vue3+vite模式下修改pinia的stroe初始值不进行热HMR更新解析
vue3+vite模式下修改pinia的stroe初始值不进行热HMR更新解析
2025-03-11 16:58:44
668
原创 js数组方法some() 和 every()的区别
some()和every()是 JavaScript 中两个常用的数组方法,它们都用于检查数组中的元素是否满足某种条件,但它们的行为有所不同。
2024-12-24 15:47:57
1219
原创 在 OpenSeadragon 中,**所有逻辑坐标的比率(包括中心坐标的 `x` 和 `y`)默认都是基于图像宽度计算的
这是 OpenSeadragon 的设计逻辑,逻辑坐标系通常是一个宽度为 1 的方形(即宽度为 1,高度按照原始图像的宽高比调整)。,而高度通过宽高比进行换算。这种设计可以统一逻辑坐标的比例,不受图像具体尺寸的影响。在 OpenSeadragon 中,0.5 × 逻辑高度。
2024-12-23 15:51:34
739
原创 js中string和String的区别
在 JavaScript 中,string 和 String 有本质的区别,分别代表 基本类型 和 对象类型。
2024-12-11 17:40:09
700
原创 CSS实现实现当文本内容过长时,中间显示省略号...,两端正常展示
通过伪类::before、定位top、两端对齐等CSS技巧,.title和.txt标签在不同情况下能实现动态切换与覆盖,同时保证文本省略和展示效果的平衡。
2024-11-21 09:56:25
2253
原创 Navigator:vibrate() 方法 - Web API | MDN
Navigator接口的vibrate()方法用于控制设备上的振动硬件(如果存在)。如果设备不支持振动,则该方法无效。如果已经处于振动模式,调用此方法会停止前一个模式,并开始新的振动模式。
2024-11-15 09:48:52
1755
原创 前端SSE包event-source-polyfill的其他事件监听的实现
event-source-polyfill库中如何监听其他事件SSE
2024-10-25 17:31:56
2655
2
原创 《webpack深入浅出系列》
Webpack 是一种现代 JavaScript 应用的打包工具,通过将代码及其依赖项打包成静态文件,方便在浏览器中加载和运行。此文章是基本使用与设计概述
2024-10-09 11:28:27
1624
原创 js,web端加载新消息,滚动条位置不变,最新消息渲染至视口
保持滚动条位置不变的关键是记录和恢复滚动条的高度差异。通过计算加载新消息前后的高度差,并调整滚动位置,可以有效地防止用户视角的跳动。
2024-08-29 10:53:39
1876
原创 前端构建URL的几种方法比对,以及函数实现
简单场景:字符串拼接或 ES6 模板语法。复杂场景new URL()构造函数。这两种方法没有绝对的优劣,关键是选择适合场景的工具。
2024-08-13 15:41:50
2868
原创 前端js中将YAML文本赋值给变量,并使用js-yaml插件来解析
模板字符串(使用反引号)支持多行文本和插值,适用于包含换行符的文本内容,如 YAML。普通字符串(使用单引号或双引号)不支持直接包含换行符,需要使用换行字符或字符串连接,处理起来较为繁琐。以上步骤展示了如何在 Vue 项目中使用js-yaml解析 YAML 文本。通过安装js-yaml依赖,并在 Vue 组件中导入和使用它,你可以轻松解析并显示 YAML 数据。
2024-08-05 13:32:06
1367
原创 Axios的几种不同的responseType处理响应,以及blob与arraybuffer的解析
Axios的几种不同的responseType处理响应,以及blob与arraybuffer的解析
2024-07-29 13:47:29
7987
1
原创 HTTP/1.1、1.2、1.3详细信息和主要区别
HTTP/1.1:持久连接和管道化,解决了基本的性能问题,但仍然存在队头阻塞。HTTP/2:二进制分帧和多路复用,大幅提升性能,但仍然受限于 TCP 的队头阻塞。HTTP/3:基于 QUIC,解决了队头阻塞问题,进一步优化了连接建立和数据传输效率。这些协议版本的改进都是为了适应现代 Web 的需求,提高页面加载速度和传输效率。可以关注和应用 HTTP/2 和 HTTP/3 的特性,以便为用户提供更好的体验。
2024-07-23 17:18:02
3006
nodejs+字符串的模式匹配+正则表达式+判断获取字符串的某些需求
2022-04-03
SpringBoot+社区老人健康信息管理的所有代码打包
2022-06-19
获取fs的readfille读取文件时的返回值
2022-01-12
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅