如何设计导航

需求分析 🔗︎

1. 业务无感知更新

   • 用户在使用过程中不会感知到更新的发生。

2. 无业务侵入

   • 更新过程不能影响已有业务的样式或功能。

3. 对技术栈无要求

   • 方案需要具备通用性，不依赖特定的技术栈。

方案 1：无版本 CDN 路径 🔗︎

实现方式 🔗︎

• 维护一个中间层的无版本 CDN 路径。
  • 真实的脚本文件是有版本号的（如 script-v1.0.0.js）。
  • 中间层的无版本路径（如 script-latest.js）指向最新的脚本版本。
• 当需要发布新版本时，只需更新中间层 CDN 的指向，即可实现一方发布、多方自动更新。

示例 🔗︎

真实脚本路径：
https://cdn.example.com/script-v1.0.0.js
https://cdn.example.com/script-v1.1.0.js

中间层无版本路径：
https://cdn.example.com/script-latest.js -> 指向最新版本（如 v1.1.0）

影响分析 🔗︎

1. 无灰度能力

   • 由于所有用户都通过同一个无版本路径加载资源，无法实现灰度发布（即逐步向部分用户推送更新）。
   • 如果新版本存在问题，可能会影响所有用户。

2. 影响 LCP（最大内容绘制时间）

   • 每次更新脚本后，浏览器需要重新下载和解析新的资源文件，可能导致页面加载性能下降，进而影响 LCP 指标。

总结 🔗︎

通过维护一个无版本的 CDN 路径，可以实现业务无感知更新，并且对技术栈无要求。然而，这种方案也存在一定的局限性：

• 缺乏灰度发布能力，难以控制更新的风险。
• 可能对页面性能指标（如 LCP）产生负面影响。

在实际应用中，需根据业务需求权衡利弊，选择合适的更新策略。