全部文章
共 1306 篇文章
在 Web 中判断页面是不是刷新
在 Web 开发中，我们经常需要区分用户是否通过刷新操作重新加载了页面。这一操作可能是由用户手动刷新（如按下 F5 键或点击浏览器刷新按钮）或通过浏览器自动重新加载。判断页面是否刷新有助于开发者优化用户体验，例如在使用 vue 的时候需要进行权限控制，就需要判断在刷新后根据登录者的权限去添加对应的路由。 本文将详细解析几种常见的判断页面是否刷新的技术方案，并探讨各自的适用场景、优缺点以及浏览器的兼容性。 1\. 使用 是一个持久的窗口属...
如何借助 View Transitions 让网页切换跟 App 一样丝滑
在 Web App 上实现跟 Mobile App 一样的页面级切换动效，往往需要编写大量 CSS 动画和 JS 控制逻辑，即使投入大量精力来实现，最终的页面衔接动画还是会出现各种不符合预期的 BUG。 高实现成本意味着无法普及应用，所以 Web APP 在页面切换时普遍不会有 Mobile App 的丝滑体验。 我们可以引入类似 framer motion 这样的外部动效库来降低实现成本，在 SPA 场景下基本可以满足大部分的动画效果...
完全掌握vue全家桶单元测试 : 2. 搭建 vitest 环境搭建 vitest 环境
完全掌握vue全家桶单元测试 : 2. 搭建 vitest 环境 假设我们没有写过 vue 的单元测试，我们初始化一个全新的项目，只要在初始化 vue 项目的时候，使用 vue 自带的脚手架命令，就可以自动安装好一整套的测试环境，vitest + @vue/test utils. 安装 项目初始化成功之后,打开 vitest.config.ts 就可以看到如下的单元测试配置， f 打开命令行执行 命令行就会输出如下的日志，代表 Hell...
推荐工具vite-plugin-fake-server，可线上部署使用mockmock线上部署
最近遇到了个麻烦，后端迟迟给不了接口，测试那边又要求数据不能写死，必须可以提供mock调试。这不最近找到了一个mock工具，能解决传统mock工具无法线上部署的问题。 工具名字叫做 ，兼容vite，从官网示例上来看是同时支持 和 来模拟数据的。使用起来也非常简单，分三步走就行。 1. 安装 2. 引入 这里贴出最简单的配置，一个是制定文件夹，一个是设置在生产环境下模拟数据。 3. 使用 这里我根据个人习惯，在 文件夹下创建一个 和数个模...
绕过中间商，不用 input 标签也能搞定文件选择
在本专栏的第一篇文章中，我们重新认识了 这位老伙计，挖掘了它的几个彩蛋特性。在做文件上传时，input 标签确实是我们的黄金搭档。但是为了方便调教 CSS 样式，我们往往需要把 input 标签藏起来，而用其他 HTML 元素来做 UI 代理。似乎是我们只馋 的身子，并不会给它一个名分 🐶。 但其实，不一定非要经过 input 标签这个中间商，我们是可以直接用 JavaScript 和系统进行文件交易的！ ！ 在上面的示例中，左侧是传...
面试题
面试题 对于各位看官老爷们来说，题目应该是非常简单的，由于个人原因，这么好的运气，也没能拿下它，属实是不应该啊，不知道下次面试有没有这么好的运气了（谁还不想当侥幸哥呢！！） 对于token为什么存入localStorage？你是怎么考虑的？ 这个可能需要介绍浏览器存储的特点吧，个人认为，所以就按照存储特点进行回答了。 1. localStorage可以实现一个持久化存储，即使浏览器关闭，它的数据也不会消失，对于需要在多个页面间保持用户登...
LaTeX公式手册(全网最全)
如何插入公式 LATEX 的数学公式有两种：行中公式和独立公式（行间公式）。行中公式放在文中与其它文字混编，独立公式单独成行。 行中公式可以用如下方法表示： 独立公式可以用如下方法表示： 函数、符号及特殊字符 声调 / 变音符号 a˙,a¨,a´,a\ \check{a}, \breve{a}, \tilde{a}, \bar{a} \hat{a}, \widehat{a}, \vec{a} \exp a b = a^b, \exp b...
你能让网页也像QQ那种一样发出右下角消息吗
<span style="color: var( g headertextcolor);" 需求</span 很平常的一个工作日，「产品经理」给我发了个消息： 产品： 你能让网页也像QQ一样，来了消息能进行提示吗？我说的不是网页内的弹出消息 我： 刚搞完上个需求，别搞嗷，你小子 产品是一个比较随和的人，所以上面的对话比较随意；具体的聊天内容，我这里就省略了，跟他对话之后，他的大致需求如下： 页面中展示预警内容 检测到预警情况会通知用户且...
🪒Web端字体切割压缩方案
今天接到一个系统需求，需要将系统内的文字替换为鸿蒙OS的字体（ ），但是鸿蒙OS的字体单Regular的文件就有8M+。这个直接放到网页上，会极大影响使用体验。 于是乎，开始考虑怎么开始对字体文件进行压缩。 第一种方案 一般来说，字体格式体积由大到小排列（性能从差到好）： ttf，eot(IE8)，woff，woff2 从官网下载的鸿蒙字体是ttf格式的，尝试用了woff2格式的（ ），但是还是有4M多。对于Web端来说，还是太大了。...