a标签跳转本身几乎无性能开销，卡顿主因是跳转前后JS长任务阻塞主线程；应检查Performance面板中Main线程>50ms的紫色(JS)或绿色(Rendering)长条，避免异步操作与同步跳转混用，优先用href或location.assign()，并确保prefetch配置正确。
a 标签本身几乎不产生性能开销，但它的行为、目标资源类型、以及配套的预加载策略，会显著影响页面跳转前后的感知速度和实际加载耗时。
点击 a 后卡顿，问题通常不在标签本身
浏览器执行原生跳转（href 导航）是极快的，真正拖慢体验的是跳转前后 JS 任务对主线程的阻塞。比如在 onclick 里触发了未 await 的 fetch，又立刻赋值 location.href，主线程可能正忙于解析响应或重排，导致导航延迟渲染。
- 用 Chrome DevTools 的 Performance 面板录制一次点击过程，重点看「Main」线程上是否有 >50ms 的紫色（JS）或绿色（Rendering）长任务
- 避免在事件中混用异步操作与同步跳转；必须等数据时，改用
history.pushState()+ 后续location.replace() - 移动端 WebView 中，
location.replace()比href更易卡顿，优先用href或location.assign() - 检查是否重复绑定 click 事件（防抖缺失或多次
addEventListener），会导致跳转被排队或静默忽略
跨页面资源不能靠 rel="preload"，必须用 rel="prefetch"
rel="preload" 只对当前页有效：它告诉浏览器“这个资源马上要用”，一旦跳转，预加载就终止，缓存也不跨页复用。Chrome Network 面板里能看到 preload 请求的 Initiator 是 preload，且只存在于当前页生命周期内。
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
- 跨页面预加载的正确方式是
rel="prefetch"，它指示浏览器：“用户**可能**在下一次导航中需要，请在空闲时低优先级下载” - 适用于下一屏 HTML（
href="product.html"）、关键 CSS/JS（as="style"或as="script"）、通用组件 JS - 不要在
prefetch中写as="font"：字体需同域或显式crossorigin，而prefetch不触发 CORS 预检，容易静默失败 - 路径必须为绝对或根相对（如
/js/next-page.js），子路径下解析错误风险高
rel="preconnect" 要配合 prefetch 提前建连第三方域名
如果下一页要从 CDN 或 API 域名加载资源，prefetch 前先 preconnect，能省掉 DNS + TCP + TLS 的 300ms+ 延迟。
立即学习“前端免费学习笔记（深入）”；
- 示例：
<link rel="preconnect" href="https://cdn.example.com" crossorigin> - 务必加
crossorigin，Safari 和部分旧版 Chrome 否则忽略该指令 - 不要超过 4–6 个，浏览器并发连接数有限，多连反而挤占主站资源
- 不要在
preconnect后立即发请求，建议间隔至少 100ms，确保连接真正就绪
真正容易被忽略的是：写了 prefetch 不等于它就起效了。得进 Chrome Network 面板筛选 prefetch 请求，确认 Initiator 是 prefetch、Priority 是 Low，且跳转后目标资源状态码是 200 (from memory cache) 或 304 —— 否则只是白写。
