Web 缓存策略:强缓存、协商缓存与 CDN 三层
从 Cache-Control 字段讲清强缓存与协商缓存,说明文件名 hash 为什么是前提,以及浏览器、Nginx、CDN 三层缓存如何配合。
共 33 个标签,「性能」下 20 篇
从 Cache-Control 字段讲清强缓存与协商缓存,说明文件名 hash 为什么是前提,以及浏览器、Nginx、CDN 三层缓存如何配合。
为什么不该随便引 CDN 上的字体和库,如何自托管字体与图标,图片格式怎么选、怎么压缩,以及 preload 的正确用法。
Google Analytics、Cloudflare Web Analytics、Plausible/Umami 自建、以及 Nginx 日志分析的对比,附选择建议与隐私注意。
LCP、INP、CLS 各自的含义与常见成因、针对性优化手段、测量方法,以及真实用户数据怎么看。
按网络、内存、文件描述符三类讲 sysctl 常用参数,给出一份可直接用的配置,以及改之前必须知道的风险。
多路复用解决了什么问题、HTTP/2 在 Nginx 里的开启方式、HTTP/3 的 QUIC 与 UDP 端口要求、以及如何验证是否生效。
PWA 的三个要素、manifest 的写法、Service Worker 缓存策略选择、更新机制,以及个人站点值不值得做。
Elements/Console/Network/Sources 各面板的实用功能、断点与条件断点、设备模拟、性能录制与 Lighthouse。
内联 SVG symbol 雪碧图的做法、currentColor 跟随文字颜色、尺寸控制与无障碍处理,以及和图标字体的对比。
upstream 的几种调度策略、权重与备份节点、失败重试参数、长连接配置,以及会话保持的处理方式。
键盘可达性、焦点样式、对比度、语义标签与 aria 的正确用法,以及用 Lighthouse 和键盘自查的方法。
逐字符扫描的状态机思路、各语言的关键字表、注释与字符串优先处理,以及深浅色配色的切换方式。
从传输压缩、缓存策略、图片格式、渲染阻塞四个维度给出可落地的优化项,附 Nginx 配置与验证命令。
分块的思路、行内与块级分开处理、代码块优先保护、表格与列表的实现,以及为什么先转义再解析。
hash 路由的原理、路由表解析、与标题锚点的冲突处理、平滑滚动,以及它相对 History API 路由的取舍。
各格式的特点与压缩率对比、picture 元素做兼容回退、转换命令与批量脚本、响应式 srcset,以及懒加载要点。
橙色云的正确用法、缓存规则怎么设、页面规则做跳转、WAF 基础防护,以及「开了 CDN 反而更慢」的几个原因。
自定义属性用法、用 data-theme 切换整套配色、跟随系统偏好、localStorage 记忆,以及闪烁问题的解决。
一句话区分两者的适用场景,Flex 的主轴与收缩规则、Grid 的常用写法与 auto-fill 技巧,以及三个高频布局的现成代码。
常用语义标签的正确用法、标题层级为什么不能跳、meta 标签该写哪些、结构化数据的作用,附一份页面模板。