分析使用全国各地三大运营商的speedtest 测速节点进行全面测速脚本
这个脚本干嘛的 买 VPS 或者云服务器,只看官方宣传的"国际线路 / CN2 GIA / 三网优化"基本上没用,实际跑起来到中国大陆各地的延迟、丢包、带宽往往跟广告差距很大。 这个 shell 脚本的作用是:从机器本地发起一次 全国三大运营商节点 (电信、联通、移动)的 speedtest 多点测速,给出每个节点的下载速度、上传速度、ping 延迟,几分钟内能给出"这台机器在中国大陆各省的真实可用性"画像。 用途: 买 VPS 前从试用机器测一次,决定要
差生文具多系列VisualStudioCode最好看的编程字体
为什么换字体 VS Code 默认字体在 Windows 上是 Consolas,在 macOS 上是 Menlo。这俩都不丑,但看久了眼睛会累。换上 JetBrains Mono 之后,几个肉眼可见的提升: 笔画粗细更均匀 ,长时间看不晃眼 x 高度大 (小写字母的高度),小字号也清晰 连字(ligatures) : => 显示成 →, != 显示成 ≠, === 显示成 三个等号合并,代码更紧凑 类似字符区分度高 :0 跟 O、1 跟
Fiddler抓包安卓电模拟器解决无法抓包问题
问题场景 开发安卓 App 时,经常需要抓真机或者模拟器里的 App 流量来调试接口。用 Fiddler 抓 PC 浏览器流量是默认行为,但要把模拟器/手机的流量引到 Fiddler 来,需要做几步配置 —— HTTPS 解密、远程连接允许、根证书安装、模拟器代理设置、证书信任。下面是完整流程,我把踩过的坑也都标出来。 整体流程 简单说就是: Fiddler 端配置:开 HTTPS 解密、允许远程连接、导出根证书 模拟器端配置:网络桥接、设置代
深入解析4层代理和7层代理的区别:优化网络性能的关键选择
什么是网络代理 代理(Proxy)是一种网络中间服务,客户端不直接连真正的服务器,而是通过中间代理转发请求。代理服务器接收客户端请求,然后选一个后端服务器把请求转过去,再把响应回来。 代理用得最多的两个场景: 负载均衡 :把请求分摊到一组真实服务器,避免某台被压垮 安全 / 访问控制 :对外只暴露代理的 IP,真实服务器藏在后面 而 "4 层代理"和"7 层代理" 是按 OSI 模型分类的。要理解这个区别,得先看 OSI 模型。 OSI 七
Vue移动端适配vw和 postcss-px-to-viewport使用
vw 适配 vs rem 适配 Vue 移动端做适配,传统方案是 lib-flexible + postcss-px2rem (动态调 html 根字号 + 转 rem)。但社区慢慢转向更纯粹的方案: 用 vw 单位 ,完全不依赖运行时 JS。 vw(viewport width)是 CSS 单位, 1vw = 视口宽度的 1% 。比如视口 375px 宽, 1vw = 3.75px 。直接用 vw 替代 px,浏览器原生适配,不需要任何 JS 介入。 对比:
解决Vue项目每次更新浏览器缓存问题
问题:用户死活看不到新版本 SPA 项目部署完,产品经理说他改不出新的功能。F12 一看,加载的还是上次发布的 app.123abc.js ,新 commit 完全没生效。让他强刷一下 (Ctrl+F5) 立刻就好,但你没法要求所有用户都来这一下。 本质是 浏览器缓存 没失效。Vue / Webpack 默认 hash 文件名( app.[hash].js )按理说能自动 cache-bust,但很多项目里: 构建 hash 策略没开,文件名一直是 app
前端项目使用await-to-js异步代码优化利器
痛点:async/await 的 try/catch 包装 用 async/await 写代码很爽,但每个调用要包 try/catch 处理异常,代码很快就会变成下面这样: async function getList() { try { const res = await getAListOfClassifiedItems({ p1, p2 }) if (res.data.code === 200) { // 处理成功 } else { console.e
域名DNS解析中DNS隐/显性 URL记录
场景 大部分人都拿过这个需求:站点同时有顶级域名( example.com )和 www 二级( www.example.com ),为了不让搜索引擎把这俩当成两个站、分散权重,需要把其中一个 301 跳到另一个。 常规做法是在 Web 服务器(Nginx / Apache / IIS)里写一条 301 规则。但 很多 DNS 服务商提供的"URL 转发"记录可以不走服务器层,直接在 DNS 解析时就完成跳转 。配置极简单,不用动 Web 服务器配置,适合临时需求或者
vue3+typescript+pnpm详细介绍使用
为什么用 pnpm 不用 npm/yarn pnpm 的核心优势两个 —— 快 、 省磁盘 。原理: 硬链接 + 内容寻址 —— 全局只存一份每个版本的包,项目里的 node_modules 实际是硬链接指向那份。装第二个项目时,相同的依赖直接复用,速度极快。 严格的依赖隔离 —— 不像 npm 把所有依赖平铺到 node_modules 根目录,pnpm 严格只暴露 package.json 里声明过的依赖。这能防止"幽灵依赖"(代码里
解决Nuxt3项目创建项目失败链接失败等问题
问题:创建 Nuxt 3 项目卡在网络 用 npx nuxi init my-app 创建新项目时,经常卡在拉模板这一步。控制台报错通常是: fetch failed Error: ENOTFOUND raw.githubusercontent.com connect ETIMEDOUT 185.199.108.133:443 这是 GitHub 提供的几个域名( raw.githubusercontent.com 、 github
Vue2移动端使用felxbilejs自适应
背景 Vue 2 项目要做移动端,设计稿通常是 750px 宽。每次写样式时都要算"设计稿 32px 等于实际多少 rem",效率太低。用 lib-flexible + postcss-px2rem 这套组合,代码里直接写 px,运行时自动适配各种屏幕。 注:lib-flexible 在 Vue 3 项目里改用 amfe-flexible + postcss-pxtorem ,本文是 Vue 2 + Webpack 老项目方案。 装两个包
Nuxt3.js移动端Pc端自适应解决方案：使用flexible.js和postcss-pxtorem实现傻瓜式Px转Rem
需求场景 Nuxt 3 项目,设计稿移动端是 750 像素宽,Pc 端是 1920 像素宽,要在一个项目里都跑 —— 移动端写 32px 字号自动按比例缩放,Pc 端原样显示。 核心思路: flexible.js 根据设备宽度动态设置根字号 html.style.fontSize ,然后用 postcss-pxtorem 在构建期把代码里的 px 自动转 rem 。这样写代码时永远写 px,运行时自动适配。 方案核心:flexible.j
Mores