- 博客(338)
- 资源 (3)
- 收藏
- 关注
RSS订阅
原创 Git命令详解
Git常用命令汇总以及其它相关操作一、常用的git命令 --文件目录操作命令 mkdir * 创建一个空目录 *指目录名 pwd 显示当前目录的路径。 cat * 查看*文件内容 git rm * 删除**文件 --git初始化操作 git init 把当前的目录变成git仓库，生成隐藏.git文件。 git remote add origin url 把本地仓库的内容推送到GitH
2020-11-04 18:46:38
2487
转载 NFS、FTP、SMB、WebDav、DLNA协议，傻傻分不清？
总体来说smb协议的兼容性最好，windows/mac/linux均可支持，各个厂商的电视、盒子和各个手机端的播放器均支持smb协议传输，ftp和webdav原生支持的较少。理论上三者速度相差并不大，这里测试的环境是KODI播放器，没深入了解过KODI读取文件的方式，但大视频文件一定不能用smb协议，杜比视界视频文件一定要用webdav，咨询过KODI其中的一位开发者，他表示webdav可以开启多通道读取文件的模式，有利于文件更快的传输，但并不代表所有播放器的表现都一致。想要兼容性好首选smb。
2025-12-17 15:24:02
44
原创 SSE 流式响应实战：如何在 JavaScript 中处理 DeepSeek 流式 API
这篇文章介绍了如何通过手动处理SSE（Server-Sent Events）格式来实现流式API请求，特别针对DeepSeek API的场景
2025-10-24 17:51:23
870
原创 从 WebSocket 到 SSE，大模型应用绕不开的 SSE
这是一种非常适合实时数据推送的技术。与 WebSocket 不同，SSE 只支持服务器到客户端的单向通信。它是基于 HTTP 协议的，能够让服务器推送数据到客户端。简单来说，SSE 就是让服务器能够在不需要客户端不断请求的情况下，主动推送数据。
2025-10-24 15:56:49
729
原创 vue中监听public/index.html页面属性添加或值的变化
vue项目中假如你需要在index.html中获取某个异步数据，假如你在项目其他地方如。
2025-10-13 10:43:18
273
原创 前端如何计算白屏时间
白屏时间是指从用户发起页面请求到浏览器首次开始渲染页面内容的时间。DNS解析：浏览器将域名解析为IP地址。建立TCP连接：浏览器与服务器建立TCP连接（三次握手）。发起HTTP请求：浏览器向服务器发送HTTP请求。服务器响应：服务器处理请求并返回响应数据。浏览器解析HTML：浏览器解析HTML文档并构建DOM树。浏览器渲染页面：浏览器根据DOM树和CSSOM树生成渲染树，并开始渲染页面。页面展示第一个标签：浏览器首次将页面内容渲染到屏幕上。
2025-08-29 14:23:59
490
原创 CSS扩大点击热区示例
这个页面包含了所有方法的可视化示例，您可以点击"显示热区可视化"按钮来查看每个按钮的实际可点击区域。伪元素方法：使用::before或::after伪元素创建更大的透明区域，不改变元素本身尺寸。Transform方法：使用伪元素并通过transform属性放大，创建更大的点击区域。Padding方法：通过增加按钮的内边距来直接扩大点击区域，简单有效。透明Border方法：添加透明边框扩大点击区域，不影响元素内部布局。当需要保持元素尺寸不变时，使用伪元素或透明border方法。
2025-08-27 16:09:49
514
原创 欢迎使用Markdown编辑器
本文介绍了Markdown编辑器的基本功能和使用方法。文章首先欢迎新用户，然后详细说明了编辑器的新增功能，包括界面设计、代码高亮、图片拖拽、数学公式支持等。接着提供了常用快捷键、标题创建、文本样式设置、链接与图片插入、代码片段展示、列表和表格创建等基础语法指南。此外，还介绍了KaTeX数学公式、甘特图、UML图表和流程图等高级功能的使用方法。最后说明了文章导出与导入的操作方式，帮助用户更好地利用Markdown编辑器进行写作。全文系统全面地展现了Markdown编辑器的各项功能，为使用者提供了详细的操作指南
2025-08-27 16:07:29
877
转载 元素是否进入了“视口“之IntersectionObserver API 使用
作者：网页开发时，常常需要了解某个元素是否进入了"视口"（viewport），即用户能不能看到它。上图的绿色方块不断滚动，顶部会提示它的可见性。传统的实现方法是，监听到scroll事件后，调用目标元素（绿色方块）的getBoundingClientRect()方法，得到它对应于视口左上角的坐标，再判断是否在视口之内。这种方法的缺点是，由于scroll事件密集发生，计算量很大，容易造成。目前有一个新的，可以自动"观察"元素是否可见，Chrome 51+ 已经支持。
2025-07-23 09:51:22
112
原创 前端开发必备的JavaScript库（最新）
一个简单易用的库，它消除了移动端浏览器上的物理点击和触发一个 click 事件之间的 300ms 的延迟。一个高效的 Javascript 动画引擎，与jQuery的 $.animate() 有相同的API, 同时还支持彩色动画、转换、循环、画架、SVG支持和滚动等效果。一个轻量的处理时间和日期的 JavaScript 库，和 Moment.js 的 API 设计保持完全一样, 体积只有2kb。零依赖，为 web 和移动浏览器提供了简单的滚动动画，以动画的方式显示滚动中的内容。
2025-07-14 15:08:07
1063
原创 一行代码生成绝对唯一 ID/uuid？你还在用 Date.now() 吗
Date.now()我们总会遇到需要生成“唯一ID”的场景，“唯一ID”这个需求看似简单，但要实现一个绝对不会重复的 ID，却比想象中要复杂。
2025-07-14 11:42:55
556
原创 如何禁止用户复制页面内容？
某些特定的业务场景下，我们可能会有禁止用户复制页面内容的需求。虽然从技术上完全阻止一个“有心人”拷贝内容几乎是不可能的（毕竟还有截图、拍照等物理手段），但作为前端开发者，我们有多种方法可以极大地增加复制的难度，从而在一定程度上达到我们的目的。
2025-07-07 11:48:48
1184
2
原创 前端a链接实现Excel文件的导出
1.通过xlsx插件导出安装npm install xlsx --save-dev使用import XLSX from 'xlsx'myDownLoad() { import("@/utils/Export2Excel").then(excel => { excel.export_json_to_excel({ header: ["姓名", "工资"],//导出数据的表头 data: [1, 2],//导出的具体数据
2025-07-01 16:03:43
241
原创 JS在 forEach 循环里写的异步await，其实根本没在等
需求：批量更新一组用户的状态。后端提供了一个接口，它是一个返回 Promise 的异步函数。${${运行这段代码，控制台输出了什么？这句话几乎是立即打印出来的，它根本没有“等待”任何函数的完成。
2025-07-01 16:03:26
1113
原创 Vue有不同风格的写法，你知道么？
我们需要新建一个 jsx/tsx 文件，然后只要保证导出的仍然是一个组件就可以了。有了前面的铺垫，我们不难发现，这不就是去掉 script 标签的选项式写法吗？确实！这是因为我故意在前面安排了选项式写法的例子，所以过渡到这里完全没有压力！setup() {const name = ref('天气好')setup() {const name = ref('天气好')});同样地，前面对于 defineComponent 不同方式的使用这里也都可以的。
2025-05-28 10:42:49
277
原创 纯前端实现图文识别 OCR
Tesseract.js 是一个基于 Google Tesseract OCR 引擎的 JavaScript 库，利用 WebAssembly 技术将的 OCR 引擎带到了浏览器中。它完全运行在客户端，无需依赖服务器，适合处理中小型图片的文字识别。
2025-05-19 11:59:59
772
原创 前端隔离：Proxy、Web Workers 与 iframe 的对比
Proxy 代理：灵活轻量，适合需精细控制权限的场景。Web Workers：安全高效，适合计算密集型或高安全需求的任务。iframe：终极隔离，但成本和复杂度较高，适合完全不可信内容。在需要部分访问DOM的情况下，Proxy更合适；在高安全性要求的场景下，Web Workers更好；而iframe适用于完全隔离的第三方内容，如广告或用户生成内容。需要根据具体需求权衡利弊。
2025-04-29 17:10:45
1221
原创 AutoJs相关学习
优先用 bounds() + click(x,y)：最灵活，适用于所有情况。控件可点击时用 target.click(offsetX, offsetY)：代码更简洁。var arrAll = text("头像").find();// 获取元素位置find()方法会返回所有匹配的控件集合（类似数组）nonEmpty()是判断集合是否非空的方法（至少有一个元素）size()获取集合中元素的数量get(index)通过索引获取集合中的元素，这里用size()-1获取最后一个元素。
2025-04-22 16:51:07
516
原创 如何从0设计开发一款JS-SDK
前端SDK是什么？前端SDK是为了帮助前端实现特定需求，而向开发者暴露的一些JS-API的集合，规范的SDK包括若干API实现、说明文档等前端SDK其实很常见了，比如：UI组件库：通过封装一系列组件，通过配置帮助开发者调用JS类库：通过实现一类常用的方法，便于开发处理数据，也不用再考虑兼容性监控统计工具：通过API，来监听前端系统的报错、统计数据。
2025-03-25 13:51:53
1235
原创 一次性上传 1000 张图片, 总量 10GB 的方案设计
最近有一个上传文件方面的需求，上传图片，用户可以选择文件夹上传。文件夹里的图片可能很多，而且由于特殊的项目背景，用户选择的图片可能会比较大，10MB左右。这里就需要做一些方案上的设计了，确保整个过程的流畅和容错。
2025-02-24 17:27:42
789
原创 纯前端怎么实现检测版本更新
在传统的多页Web应用中，每次用户访问页面时，都会从服务器获取最新的页面和资源，因此版本更新相对简单，用户总是能获取到最新的版本。然而，SPA在首次加载后，前端的静态资源会缓存在浏览器内存中，且在整个使用过程中通常不会自动重新加载。这种特性意味着如果应用有新的版本发布，用户可能仍在使用旧版本，无法立即获得最新的功能、修复或安全更新。为了确保用户始终使用最新的版本并体验到最佳的功能和安全性，SPA应用需要实现版本检测和更新提示机制。
2025-02-06 10:21:04
569
原创 前端工程师必需要记住的CLI命令
作为前端开发工程师，我们需要了解哪些命令？如果您熟悉这些命令，它们将大大提高您的工作效率。小伙伴们，你们知道如何列出一个目录的文件结构吗？它在显示文件之间的目录关系方面做得很好，这真的很酷。在此之前，您需要安装命令树。然后只需在文件目录中执行tree即可。wc 是 word count 的缩写，常用于文件统计。它可以统计字数、行数、字符数、字节数等。我经常用它来计算文件中的代码行数。打印出一个目录的文件大小信息。我们使用它的频率较低，但它是一个非常值得学习的命令。du -h：打印出适合人类阅读的信息
2025-02-06 10:14:26
788
原创 新一代CSS选择器：12个技巧让代码量减少70%
CSS选择器的使用技巧直接影响着我们的代码质量和维护效率。分享一些新一代的CSS选择器技巧，这些技巧不仅能让你的代码更简洁，还能提升样式表的可维护性。
2025-01-21 15:36:41
473
转载 基于web-see的前端监控方案实现
最近在研究前端项目的监控，找到了web-see这个工具，，还有使用。这个工具提供了上报错误、定位错误源码、记录用户行为等功能。
2025-01-17 15:16:43
163
原创 Vue中nextTick实现原理
通过这样分成三步、循序渐进的方式，我们深入探讨了 「nextTick」 的原理和实现机制。希望这篇文章能够对你有所帮助，让你在前端开发的道路上更加得心应手！🚀。
2025-01-14 14:33:40
1208
原创 【airtest】自动化入门教程Poco元素定位
本文将详细讲解Poco控件定位的各种方式，利用这些方法可以帮助我们编写出目标控件的定位脚本。我们在IDE录制的poco脚本，常见的都是类似 poco(“star_single”).click()这样的脚本，其中 poco(“star_single”) 这块就属于Poco控件定位脚本啦。
2025-01-13 11:37:11
1978
原创 前端错误捕获定位工具
作为一个兢兢业业的前端er，虽然每天都被各种CRUD的需求包围着，但总归还是有一颗爱玩的心。这篇文章也是之前想要做的一个小玩具，最近终于挤出时间把这个玩具给实现了，感觉有点意思，整理出来给掘友们玩一下~
2024-12-05 15:59:46
1251
原创 npm, yarn, pnpm之间的区别
在现代化的开发中，一个人可能同时开发多个项目，安装的项目越来越多，所随之安装的依赖包也越来越臃肿，而且有时候所安装的速度也很慢，甚至会安装失败。因此我们就需要去了解一下，我们的包管理器，在前端比较主流的包管理器主要有三个（当然还有其他优秀的包管理器，本文主要介绍这三个），分别是：npm，yarn，pnpmnpm 是 Node.js 默认的包管理工具，最早由 Node 社区开发并捆绑到 Node.js 中，因此使用最为广泛。
2024-12-05 15:59:18
1383
原创 为什么前端打包出来的静态文件名字是一串 Hash 值 ？
前端打包时使用 Hash 值作为静态文件名，主要是为了缓存优化、版本管理和避免缓存污染。当文件内容发生变化时，打包工具会生成不同的 Hash 值，确保文件名唯一，从而强制浏览器加载最新版本的资源，避免加载旧缓存文件引发的问题。同时，如果文件内容没有变化，文件名保持不变，浏览器可以继续使用缓存中的资源，从而减少网络请求，提升加载性能和用户体验。通过这种方式，前端应用可以高效地管理静态资源，保证用户始终访问到最新内容。
2024-11-28 14:50:09
1407
原创 禁止别人调试前端代码
作为web开发者，我们应该都有这样一个认识：前端代码是公开的，所有人都能拿到我们代码，不能把秘钥等信息写死在前端。为了避免他人轻易看懂前端代码，通常我们会对代码进行压缩、混淆等处理。今天带来一篇文章，作者介绍了几种避免他人调试前端代码的常见方式，感兴趣的同学可以在自己项目里试试。下面是正文部分。这里我们不介绍禁止右键菜单禁止F12快捷键和代码混淆方案。
2024-11-28 10:08:23
1337
原创 node服务器实战-日志持久化
日志对于 Web 后台应用来说是必要的，Koa 原生并不支持支持日志模块，所幸 GitHub 已经有很多优秀的 Node.js 日志框架，这节实战将使用来处理 Koa 的日志，当然也有像这样的 Koa 中间件对 log4js-node 进行了封装，本节实战也会实现一个中间件来处理日志。
2024-11-25 17:44:09
1250
原创 程序员如何找 logo 图标和插画？（建议收藏）
作为一个程序员，不管你是平时要自己做博客网站、写文章，还是独立开发一些产品，基本上会用到一些图片资源，比如 Logo、插画、icon，哪怕是写 PPT ，也是会用到的。
2024-11-25 17:43:32
1147
原创 前端中的 File 和 Blob两个对象到底有什么不同
Blob 是纯粹的二进制数据，它可以存储任何类型的数据，但不具有文件的元数据（如文件名、最后修改时间等）。File 是 Blob 的子类，File 对象除了具有 Blob 的所有属性和方法之外，还包含文件的元数据，如文件名和修改日期。你可以将 File 对象看作是带有文件信息的 Blob。// true二者在文件上传和二进制数据处理的场景中被广泛使用。Blob 更加通用，而 File 更专注于与文件系统的交互。
2024-11-11 16:31:35
1129
原创 前端拖拽库方案之react-beautiful-dnd
近期，知名 React 拖拽库宣布了项目弃用的决定，未来将不再维护。这一决定源于其存在的缺陷与局限性，促使作者转向开发一个更加现代化的拖拽解决方案——（下面会介绍），其旨在提供更佳的性能、灵活性和可访问性。作为 React 生态中不可或缺的工具库，react-beautiful-dnd 曾以其卓越的拖放体验赢得了广泛赞誉，其 npm 周下载量高达 163 万次。
2024-10-31 10:37:11
1722
原创 Vue的不同风格写法，你知道么？
我们需要新建一个 jsx/tsx 文件，然后只要保证导出的仍然是一个组件就可以了。有了前面的铺垫，我们不难发现，这不就是去掉 script 标签的选项式写法吗？确实！这是因为我故意在前面安排了选项式写法的例子，所以过渡到这里完全没有压力！setup() {const name = ref('天气好')setup() {const name = ref('天气好')});同样地，前面对于 defineComponent 不同方式的使用这里也都可以的。
2024-10-24 10:37:37
1288
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人