PWA也应该是SPA吗?

时间:2018-02-15 11:23:04

标签: progressive-web-apps

我很想知道因为我的应用确实有一个与应用行为完全不同的初始旅程。

我想把这个初步的旅程分成另一个" HTML"适当的数据传输和加载时间。甚至使用与应用程序其余部分相同的框架(Angular2)。

但是这样的应用程序不再是SPA了。

这是否会损害"Connectivity independent""App-like" PWA原则?

OB的。我们正在尝试这个,因为我们的研究表明用户参与度和初始游览加载时间的速度之间存在直接关系。

2 个答案:

答案 0 :(得分:9)

遵循您的网络应用的单页应用模式意味着您可以使用App Shell approach顺利过渡到渐进式网络应用中的导航缓存优先。

遵循App Shell模式并不是构建渐进式Web应用程序的唯一方法,但如果采用不同的方法,则需要更多地考虑如何缓存HTML,以及可能更难以使用服务工作者以缓存优先的方式响应导航。其中一些注意事项在此" High-performance service worker loading"制品

如果您的网络应用程序目前是SPA的混合体以及一些静态页面,那么当您通过检查传入的URL响应服务工作者中的navigation requests时,可以将其考虑在内。假设有一个众所周知的前缀或其他方法来识别给定的URL是否与Web应用程序的SPA部分或基本HTML部分相对应,您可以在fetch处理程序内做出不同的响应:

// Not shown: install and activate handlers to keep app-shell.html
// cached and up to date.
self.addEventListener('fetch', event => {
  if (event.request.mode === 'navigate' && event.request.url.includes('/spa'))
    event.respondWith(caches.match('app-shell.html'));
    return;
  }
  // Either do nothing, and your non-/spa URLs will go against the network,
  // or use a runtime caching strategy to handle your non-/spa URLs.
});

于2018-06-21更新:有关其他观点,您可以阅读" Beyond SPAs: alternative architectures for your PWA"

答案 1 :(得分:0)

简短的答案是PWA不必为SPA

如果我们查看Web Firm Framework的文档网站,您会发现它不是SPA,而是PWA。如果我们在离线时刷新页面,则可以使用。我们还可以在移动Chrome浏览器中执行“添加到主屏幕”,将其添加为可带来类似应用程序体验的应用程序。

因此,要获得类似于App的体验,您的主页及其某些链接必须能够被缓存。

相关问题