1.场景：
之前帮朋友做全景图的项目，主要问题还是资源加载问题，因为每一张图片都有1M-10M（压缩后），所以在在也不同路由下直接img标签 src引入地址时后造成重复下载且耗时过长。
2.思路：
采用预加载方式提前加载资源+模糊图片预渲染方式
3.预加载方案：
直接使用img load 方式，常规方式就是先用一张模糊图片或者暂不渲染，
等图片load完成之后才正式渲染出来：
结论：这种方式只能说解决单一页面图片资源问题，实际场景适用于一些小资源模块或者无相关的同类型页面，如商品页面之类的，不适用大型全景类
4.个人方案：
使用axios加载图片资源，存储于window，这样资源只要有预设就可以提前在页面1加载页面2，页面3的资源
调用方式或者预加载方式：
//正式资源加载或调用
let imgUrl=window._windowImg["page2_64f"];
let imgLowUrl=require("@/assets/img/low/page2_64f_low.jpg");
if (!window._windowImg["page2_64f"]) {
window.imgPreloader(window.allIMg["page2_64f"]).then((res) => {
imgUrl = res;
});
}
优点：
- 页面可调用方法提前加载其他页面的资源或者接下来可能需要用到的较大置于window中；
- 同时满足之前的常规当前页面资源加载，当前页面可通过监听进行图片替换
缺点的话大家评论区指出，我也好学习一下，谢谢各位
