应用程序外壳模型建议首先加载包含最低要求的HTML,CSS和JavaScript的应用程序外壳,然后动态加载内容。这似乎意味着使用 JavaScript 和 API 延迟加载内容。
例如,上面文章中提到的 PWA 谷歌 I/O 2016。
但是,这种方法意味着您的内容仅适用于支持 JavaScript 的浏览器。
这也可能会影响搜索引擎索引,例如,在测试 Google I/O 2016 网站时,如果您禁用 JavaScript,内容将不可用。
建议采用什么方法,因为这似乎违背了渐进式增强的原则?
(警告:有很多不同的方法可以实现服务器端渲染。
如果"正确"使用服务器端呈现,则服务器应使用完整的 HTML 文档(具有特定于 URL 的内容)响应发送给它的任何导航请求。在此模型中,JavaScript 不是将内容放到屏幕上所必需的,尽管"交互式"功能或执行单页应用程序样式导航可能需要它。
问题是,一旦您安装了服务工作者,并且如果您正在利用App Shell模型,您的浏览器将不再需要向服务器发送导航请求以获取响应。它可以使用以前缓存的应用外壳 HTML 来完成请求,完全绕过网络。
不支持服务工作者的浏览器或其他理论上的用户代理将继续向您的服务器发送导航请求,您的服务器将继续使用完整的 HTML 文档响应它们。
几年前我做了一个演讲的视频,它更详细地解释了这一点:https://youtu.be/jCKZDTtUA2A?t=1428,以及一个利用这种技术的示例应用程序 https://github.com/GoogleChrome/sw-precache/tree/master/app-shell-demo