Skip to content

三、与其它开源方案的对比(优缺点)

说明:同类需求在社区往往被拆成 「只服务于 Webpack」「只服务于把依赖换 CDN」「只在 SW 层统一拦请求」。本仓库选择 插件 + 小运行时,与下列路线各有所长。

3.1 对比 webpack-retry-chunk-load-plugin 一类

webpack-retry-chunk-load-plugin(典型)resource-fallback(本仓库)
优点聚焦 Webpack async chunk;社区久、切入点清晰。Webpack 之外还提供 Vite;并统一 熔断、多前缀 URLs、Kill switch、DOM CSS chunk 等。
缺点(相对本库目标)不天然覆盖 Vite<script>/<link> 安全网SystemJS legacy 与同构 resolver 语义维护与适配面更广;需在 Webpack 与 Observer 之间避免双处理

3.2 对比 vite-plugin-cdn-importvite-plugin-cdn2 一类

典型 CDN-import 插件resource-fallback(本仓库)
优点React/Vue 等依赖 指到 CDN,减包体、加速构建。面向 自家构建出来的 assets运行时失败 时的 重试与多源回退(含回源),与「构建时把依赖换 URL」正交。
缺点(相对本库目标)多为 静态 URL 策略,对 主 CDN 挂掉后按规则链切换 不是同一问题域。不替代「把业务依赖外置到 CDN」;若仅要外置依赖,应用专用 CDN 插件更简单。

3.3 对比 webpack-fallback-directory-resolver-plugin 一类

Resolver 级「目录回退」resource-fallback(本仓库)
优点模块解析 阶段解决「找不到文件」类问题。解决 已在浏览器里发起的 URL 加载失败(网络/CDN/跨域等),与 构建期 resolve 层问题不同。
缺点(相对运行时回退)无法等价替代「线上 chunk URL 失效后的重试换源」。构建期不参与「找不到源码」的回退逻辑。

3.4 对比基于 Service Worker(如结合 Workbox 自写路由)的路线

Service Worker 拦截 fetchresource-fallback(本仓库)
优点可对 更广泛资源类型 做策略(字体、图片、子资源 fetch);控制面极大。无 SW 注册/更新/兼容性负担;与 Webpack/Vite 插件对齐,上手路径接近常规 SPA deploy。
缺点生命周期、HTTPS、同源策略、fetch <script> 失败关系需仔细建模;运维与排障更重。不拦截任意 fetch;覆盖面以 脚本/样式加载与构建链能触达的路径为主(README TODO 里也承认图片等缺口)。

3.5 对比纯运维(换 publicPath、DNS、多云调度)

运维侧切换resource-fallback(本仓库)
优点全站一致、对用户「无补丁」体感。单次页面生命周期内对已下发 HTML/asset URL 仍可 多级重试换源,不依赖立刻发版。
缺点已缓存的入口页仍可能指向坏域;Regional 抖动时体验粗。在客户端多跑逻辑;需在团队内接受运行时脚本与语义边界。

小结:本工程的长处在于 多端构建适配 + 统一运行时状态机 + 与浏览器/webpack/vite 特例对齐;短处是 非 SW,对 任意网络请求不具备天然全集能力,Vite dev 动态 import 等也存在刻意未覆盖的范围。


上一篇:技术难点 · 下一篇:问题案例