秘银避免重新加载图像

mithril avoiding to reload image

本文关键字：加载 图像 新加载      更新时间：2023-09-26

我正在使用秘银 0.2.2-rc.1。我在路由文档中看到：路由是一个允许创建单页应用程序 （SPA） 的系统，即可以从一个页面转到另一个页面而不会导致浏览器完全刷新的应用程序。

事实上，当我使用不同的参数路由到同一页面时，只有我想更改的部分是刷新期望：

m("img[src='assets/images/logo.png'][alt=''][width='100']")

我可以在网络通信中看到图像被重新加载（另一个 GET 请求）。

有没有办法避免这种情况？

路线.js

m.route.mode = "pathname";
m.route(document.getElementById('app'), '/', {
    '/': main,
    '/modelling/:level': main
})

很难看出这两段代码是如何组合在一起的，但有两件事表明了这一点：

  1. 路由的每次更改（即使该更改导致相同的路由条目，例如/modelling/x到/modelling/y）都将导致整个 DOM 被重新生成。您可以通过在每个路由组件的控制器中调用m.redraw.strategy( 'diff' )来防止此行为。
    2. 重复请求相同的资源
  2. 不会导致对服务器的额外调用：一个多页面站点，每个页面请求相同的JS和CSS只会加载这些资源一次，并且会在后续请求中命中浏览器缓存。因此，重复请求相同的图像资源不会生成对服务器的任何新调用。

如果您查看 m 方法的文档，您会发现 config 属性允许您在重绘时保留元素。所以这应该适合你：

m('img', {config: function persist(el, isInit, context)}) {
    context.retain = true;
}
相关文章：