- 博客(212)
- 资源 (14)
- 收藏
- 关注

原创 Web 网页性能优化
预加载扫描程序的角色是推测性,也就是说,它会检查原始标记,以便查找资源,以便在主要HTML解析器发现之前抓取相应资源预加载扫描程序是一种浏览器优化,采用辅助HTML解析器的形式,可扫描原始HTML响应,以找出并推测性地提取资源,然后主HTML解析器才会发现这些资源为了充分利用预加载扫描器,服务器发送的HTML标记中应包含关键资源。由CSS使用属性加载的图片。这些图片引用位于CSS中,预加载扫描器无法发现这些引用动态加载的脚本,采用元素标记(使用JavaScript注入DOM。
2024-06-04 20:31:56
1725

原创 Web 页面性能衡量指标-以用户为中心的效果指标
FCP:从网页开始加载到网页内容的任何部分呈现在屏幕上所用的时间。首次内容绘制 (FCP) 是一项以用户为中心的重要指标,用于衡量感知的加载速度。它标记了网页加载时间轴中用户可以看到屏幕上任何内容的第一个点。FCP衡量的是从用户首次导航到相应网页到该网页的任何部分呈现在屏幕上所用的时间。对于此指标,内容是指文本、图片(包括背景图片)、元素或非白色元素。LCP:从网页开始加载到屏幕上呈现最大的文本块或图片元素所用的时间LCP。
2024-06-04 13:50:29
1292

原创 ES 2024 新特性
ECMAScript 2024,第 15 版,添加了用于调整 ArrayBuffer 和 SharedArrayBuffer 大小和传输的功能; 添加了一个新的 RegExp /v 标志,用于创建具有更高级功能的 RegExp,用于处理字符串集; 并介绍了用于构造 Promise 的 Promise.withResolvers 便捷方法、用于聚合数据的 Object.groupBy 和 Map.groupBy 方法等...
2024-05-13 14:26:19
1079

原创 使用 Vitepress 构建博客并部署到 github 平台
VitePress 是一个静态站点生成器 (SSG),专为构建快速、以内容为中心的站点而设计。简而言之,VitePress 获取用 Markdown 编写的内容,对其应用主题,并生成可以轻松部署到任何地方的静态 HTML 页面。
2024-04-28 10:18:43
3485
6

原创 使用 CRXJS、Vite、TypeScript、React、Zustand、Antd 开发 Chrome 浏览器插件——自带热加载,无需手动配置 vite.config.ts 文件
使用 CRXJS 结合 Vite 插件结合 React 开发 Chrome 浏览器插件到这就基本结束了使用 CRXJS 不需要自己在手动配置 vite.config.ts 文件了,方便了不少如果想自己配置的话可以看【两万字大章带你使用 Vue3、Vite、TypeScript、Less、Pinia、Naive-ui 开发 Chrome 浏览器 Manifest V3 版本插件】
2024-03-25 10:52:55
2828

原创 使用 CRXJS、Vite、TypeScript、Vue3、Pinia、Less、Naive-ui 开发 Chrome 浏览器插件——自带热加载,无需手动配置 vite.config.ts 文件
使用 CRXJS 结合 Vite 插件结合 Vue 开发 Chrome 浏览器插件到这就基本结束了使用 CRXJS 不需要自己在手动配置 vite.config.ts 文件了,方便了不少但是也有不方便的部分,比如此篇文章没有 contentPage 页面,如果加入这个的话,也得配置 vite.config.ts,而且还得需要改 manifest.json 配置,比较麻烦如果想自己配置的话可以看。
2024-02-01 15:10:46
2846
2

原创 两万字大章使用 React、Vite、TypeScript、Less、Zustand、Ant Design 开发 Chrome 浏览器 Manifest V3 版本插件
使用库、Less、状态管理zustandVite开发浏览器插件到这整个流程就已经走完了,插件涉及的页面也都包括在内了开发上线的时候只需要把换成插件需要的域名即可Vite配置和React项目都是我们手动修改的,可以很好的适配自己的项目写这个教程趟了不少坑,和V2版本很不一样完结 🎉🎉🎉。
2024-02-01 10:39:40
1397

原创 强推 20 款实用的 Chrome 插件
沉浸式网页双语翻译扩展,支持PDF翻译,双语Epub电子书制作,Youtube/Netflix/Udemy 等平台双语字幕,支持Deepl/Google等多个翻译服务,免费使用。Apifox 是 API 文档、API 调试、API Mock、API 自动化测试一体化协作平台,定位 Postman + Swagger + Mock + JMeter。捕捉、标注、缩放、模糊、编辑视频等功能 - 无需登录,保护隐私。JSON自动格式化、手动格式化,支持排序、解码、下载等,更多功能可在配置页按需安装!
2024-01-26 10:31:32
5883

原创 开发 Chrome 浏览器插件时进行 Vue3+Vite 多页面多入口配置
开发 Chrome 浏览器插件时进行 Vue3+Vite 多页面多入口配置
2024-01-25 16:47:18
1981

原创 两万字大章带你使用 Vue3、Vite、TypeScript、Less、Pinia、Naive-ui 开发 Chrome 浏览器 Manifest V3 版本插件
两万字大章带你使用 Vue3、TypeScript、Less、Pinia、Naive-ui 以及 Vite 开发 Chrome V3 插件
2024-01-25 16:09:57
2306
9

原创 两万+字数:从0到1带你开发 Chrome 浏览器 Manifest V3 版本插件
两万两千字,从 0 开始,一篇文章搞定 Chrome 浏览器 V3 版本插件
2024-01-17 15:53:10
5002
4

原创 一万六千字大章:Chrome 浏览器插件 V3 版本 Manifest.json 文件全字段解析
Chrome 浏览器插件 V3 版本 Manifest.json 文件全字段解析,一万六千字大章全字段图文解析
2024-01-16 10:06:42
3125

原创 Chrome 浏览器插件 Manifest V3 版本中新增的 Service Worker 详细解析
Chrome 浏览器插件 manifest V3 版本新增的 Service Worker 字段,详细介绍了 Service Worker 以及解析
2024-01-12 15:27:18
3172

原创 金三银四-帮你改简历:助你有份好工作
最近不是所谓的金三银四了嘛,就有朋友找我帮忙改下简历,所以就整理了一下我对简历格式、排版、文案等方面的看法。【纯属个人看法】编辑器里面不好排版,所以就用了截图来代替。助你有份好工作!!!
2023-03-21 16:26:32
388
原创 Electron 客户端心跳定时任务调度库调研文档 - Node.js 任务调度库技术调研文档
node-cron 是一个基于 Cron 表达式的任务调度库,允许你根据 cron 表达式设置任务的执行频率。它轻量、易用,适用于大多数简单的定时任务需求。Rxjs 是一个响应式编程库,主要用途是处理异步事件流。提供了强大的操作符,用于处理事件、异步任务、定时任务等场景。Rxjs 并非专门用于任务调度,但它可以非常高效地管理定时任务和流式数据bull 是一个基于 Redis 的任务队列库,适合处理大量异步任务。它不仅支持定时任务,还支持任务的重试、延迟执行、优先级队列等。
2025-02-14 10:47:21
764
原创 Cron 表达式用法
Cron 表达式0 0 L * *表示任务每个月的最后一天执行。Cron 表达式是一种强大的定时任务调度工具,适用于各种需要定时执行的场景。它灵活、高效,尤其适用于基于时间的任务调度。通过结合不同的特殊字符,您可以创建非常复杂的定时任务。它广泛用于 Linux 系统的 cron 命令中,并在许多 Node.js 库中得到了支持,如 node-cron。
2025-02-14 10:46:05
211
原创 Electron 主进程和渲染进程通信方法总结
Electron 进行间通信总结:单向通知:使用 ipcRenderer.send(主进程通过 ipcMain.on 监听);适合简单指令,不需要立即反馈。同步调用:使用 sendSync(阻塞渲染进程,不推荐用于耗时任务)。RPC 请求:使用 invoke(返回 Promise),由主进程 handle 或 handleOnce 处理,适合需要异步返回结果的场景。特殊场景:postMessage 和 sendToHost 针对嵌入式内容与宿主的跨上下文通信设计。
2025-02-12 10:14:08
1011
原创 CSS 小技巧 —— CSS 实现 Tooltip 功能-鼠标 hover 之后出现弹层
CSS 小技巧 —— CSS 实现 Tooltip 功能-鼠标 hover 之后出现弹层
2025-02-11 11:16:56
359
原创 CSS 小技巧 —— CSS 实现 ... 的 loading 加载中动画
需求中想做出个这种效果,这个页面又是一个单独的 html 页面,没必要再单独引入其他模块了就想着用 CSS 动画来实现。
2025-02-11 11:15:40
235
原创 Vue Vite 项目增加 eslint 和 prettier
我们是 vue,选择第二个。选择第一个 ESM 规范。项目中建议使用 TS。我这边选择的是 JS。
2025-02-10 10:52:35
331
原创 React Vite 项目增加 eslint 和 prettier
vscode/extensions.json 文件。.vscode/settings.json 文件。.prettierrc.json 文件。.prettierignore 文件。.prettierrc.js 文件。我们是 React,选择第一个。把默认生成的替换为以下内容。选择第一个 ESM 规范。根据项目自己添加过滤文件。项目中建议使用 TS。我这边选择的是 JS。
2025-02-10 10:51:47
666
原创 ChromeOS 132 版本更新
企业定制化ChromeWebStore管理员现在可以使用新设置定制ChromeWebStore以适应他们管理的用户,包括以下功能:添加公司标志添加首页横幅和自定义公告策划扩展集合实施基于类别的控制这些设置可以通过管理员控制台进行配置,并且对所有已登录的管理用户(使用受管Google帐户登录到ChromeWebStore的用户)可用。
2025-01-20 10:07:39
1182
原创 Chrome 浏览器插件获取网页 iframe 中的 window 对象
获取逻辑和《Chrome 浏览器插件获取网页 window 对象》中的方案一一样,有兴趣的可以试下其他方案我这是本地 iframe URL,如果你的 URL 是网页链接,可以在 index.js 中嵌入 lucky.js 做延迟处理如果你的 iframe URL 是动态的,比如,点击 tab,切换 URL,则可以在 index.js 中进行 MutationObserver 监听。
2024-12-23 10:32:05
876
原创 Chrome 132 版本开发者工具(DevTools)更新内容
使用 Gemini 调试 Network、Source 和 PerformanceChrome 131 可以使用 Gemini 调试 CSS,现在可以调试更多模块了与元素面板中的右键菜单类似,要打开 AI 辅助面板并开始与 Gemini 的聊天,可以通过以下方式操作:在 Network 面板中,右键点击一个网络请求并选择“Ask AI”,或点击该请求旁边的“Ask AI”按钮。在 Sources > Page 选项卡中,右键点击一个文件并选择“Ask AI”,或点击该文件旁边的“Ask AI”按钮。
2024-12-18 14:08:53
854
原创 ChromeOS 131 版本更新
ChromeOS Flex 自动注册在 ChromeOS 131 中,ChromeOS Flex 的自动注册功能现已允许大规模部署 ChromeOS Flex 设备。与 ChromeOS 零接触注册类似,自动注册将通过组织管理员创建的注册令牌嵌入到 ChromeOS Flex 镜像中。这将决定设备在初次设置时将注册到哪个客户组织和组织单位。
2024-12-18 14:04:18
633
原创 Chrome 浏览器 131 版本开发者工具(DevTools)更新内容
使用 Gemini 调试 CSSChrome DevTools 现在推出了一个新的实验性 AI 辅助面板,可以与 Gemini 聊天并获得帮助来调试 CSS。在 Elements 面板中,右键点击一个元素并选择Ask AI,或者点击该元素旁边的对应按钮,DevTools 会打开新的 AI 辅助面板。
2024-11-19 10:33:18
1062
原创 Chrome 浏览器 131 版本新特性
在 iOS 上使用 Google Lens 搜索自 Chrome 126 版本以来,用户可以通过 Google Lens 搜索屏幕上看到的任何图片或文字。要使用此功能,请访问网站,并点击聚焦时出现在地址栏的 Google Lens 搜索按钮,或者点击桌面右键菜单、桌面和移动端的三点菜单。用户可以在屏幕上任意点击、选中或拖动以搜索内容,并通过在搜索框中添加关键词或问题来优化搜索。管理员可以通过名为 LensOverlaySettings 的策略控制此功能。
2024-11-19 10:31:11
2007
原创 Chrome 130 版本开发者工具(DevTools)更新内容
网络面板获新增了一些过滤条件,这些过滤条件是根据反馈重新设计的,特定于类型的过滤条件保持不变,即在简洁的多选栏中显示一组标记。可以通过 Cmd/Ctrl 键 + 点击来多选类型过滤条件。为了简化界面,我们将与隐藏、屏蔽和第三方相关的复选框移到了下拉列表下方。该列表包含一个数字,表示下拉菜单下已选中的过滤条件数量。
2024-11-04 10:53:09
991
原创 Chrome 130 版本新特性& Chrome 130 版本发行说明
Chrome 130 引入了一种新的 Toast 样式,用于在用户操作后提供视觉确认,或快速提供后续操作的途径。当用户执行某个操作时,Toast 会在屏幕上短暂弹出,确认操作成功或提供快捷链接。例如,当将某项内容添加到阅读列表时,Toast 会确认项目已添加,并提供一个快速链接以打开阅读列表侧边栏。Toast 以小型提示的形式显示,部分覆盖网页内容,部分覆盖浏览器顶部工具栏。
2024-11-04 10:52:20
1692
原创 使用 CRXJS 构建 Chrome 插件在 Chrome 浏览器升级到 130xxx 版本之后,出现 Content Security Policy 错误,定位原因并附带详细解决方案
此次报错是由于 chrome 浏览器升级之后,安全策略变更导致的;使用 CRX JS 打包 chrome 插件都会遇到这个报错,已经有老哥在 crxjs 的 github 上提交 issue 了;此次解决方案也是从这个 issue 上面找的;之前做过 chrome 浏览器版本发行说明,但是后面有事就耽搁了,现在觉得还是得提起来,这样能有效跟进版本迭代和一些坑,不至于出现问题手忙脚乱。
2024-10-16 14:35:25
1146
原创 JavaScript 中 structuredClone 和 JSON.parse(JSON.stringify()) 克隆对象的区别
提供了更广泛的数据类型支持和对循环引用的处理能力,适用于复杂场景适合处理简单、JSON兼容的数据结构,但在处理复杂数据类型或循环引用时有局限性两者都有限制,克隆的时候需要关注下克隆对象的数据类型再做选择。
2024-09-06 10:35:52
1697
原创 Rust 操作符及示例
Rust 提供了丰富的操作符,以便开发者在不同的编程场景下使用。每个操作符都有其特定的功能和适用场景,理解它们的用法有助于编写更加高效和清晰的 Rust 代码。
2024-09-06 10:27:55
1070
1
原创 Chrome 浏览器插件获取网页 window 对象(方案三)
最近有个需求,是在浏览器插件中获取window对象下的某个数据,当时觉得很简单,和document一样,直接通过嵌入直接获取,然后使用发送数据到插件就行了,结果发现不是这样滴…在这里不推荐使用进行注入,很可能会报错:😗Chrome 浏览器插件获取网页 window 对象(方案一)Chrome 浏览器插件获取网页 window 对象(方案二)获取当前页面下的 window 对象和 document 对象不一样,需要另外的处理方式。
2024-09-05 10:08:15
1682
原创 Chrome 浏览器插件获取网页 window 对象(方案二)
最近有个需求,是在浏览器插件中获取window对象下的某个数据,当时觉得很简单,和document一样,直接通过嵌入直接获取,然后使用发送数据到插件就行了,结果发现不是这样滴…在这里不推荐使用进行注入,很可能会报错:Chrome 浏览器插件获取网页 window 对象(方案一)
2024-09-04 14:33:31
1500
原创 Chrome 浏览器插件获取网页 window 对象(方案一)
最近有个需求,是在浏览器插件中获取window对象下的某个数据,当时觉得很简单,和document一样,直接通过嵌入直接获取,然后使用发送数据到插件就行了,结果发现不是这样滴…
2024-09-04 13:49:43
2448
2
原创 Rust 中 *、&、mut、&mut、ref、ref mut 的用法和区别
*:解引用操作符,用于访问指针或引用指向的值的类型。&:借用操作符,用于创建不可变引用的类型,允许只读访问。mut:关键字,用于声明可变变量或参数的类型,允许其值被修改。&mut:借用操作符,用于创建可变引用的类型,允许读写访问。ref:模式匹配中的关键字,用于创建不可变引用的类型,避免所有权转移。ref mut:模式匹配中的关键字,用于创建可变引用的类型,允许修改引用的值。
2024-07-25 11:59:07
1087
通过例子学习 Rust 中文版本
2024-07-11
使用flask和vue开发python web项目
2020-12-31
使用 vue3.x版本开发 chrome插件
2020-12-31
myPlugin.zip
2020-12-04
cssfont-family中英文对照.js
2020-08-18
小程序生成条形码插件 barcode.js
2020-07-14
小程序生成二维码qrcode.js
2020-07-14
小程序中使用的ThreeJs
2020-07-07
requirejs前端模块化.pdf
2020-05-25
gulp自动化构建.pdf
2020-05-25
ascii对照表.pdf
2020-05-25
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人