如何克服单页应用程序的弱点？

Question

我想用vue https://vuetifyjs.com/en/或https://coreui.io/vue/构建一个单页应用程序。但是一些参考资料指出，单页应用程序在SEO中并不好。所以我考虑使用它。也许最好的解决方案是使用多页应用程序。如果那是最佳选择，那么使用vue开发多页应用程序的最佳技术是什么？该API已经可用，所以我只用它

请提供一些最佳选择。所以我可以有几种选择。谢谢

Answer 1

正确的是，标准的VueJS-SPA对SEO不利，因为第一个HTML通常是空交付的，只有下载并执行Vue代码后，页面才会动态呈现并安装在客户端上。

使用Vue构建多页页面（因为每条路线都会导致服务器发送一个全新的HTML页面）

确实不可行。

相反，我建议您研究一下VueJS的服务器端渲染。可以使用standard VueJS或专用于此的框架（例如NuxtJS）来实现。

该技术将有效地执行以下操作：呈现第一页，用户访问服务器并向下发送呈现的HTML。这将导致良好的SEO，因为搜寻器每次都会收到经过翻译的HTML页面。对于随后的每一次页面导航，该站点都将像SPA一样运行。

Answer 2

尽管其他人都对SSR解决方案有所了解，但您可以采用的另一种方法是使用预渲染。 prerender-spa-plugin是一个可用于此目的的Web Pack插件，它接受您要呈现的路由，并为其生成HTML和JS文件。

还有Prerender.io，它可以拦截来自Web搜寻器的请求，并在将其提供给搜寻器之前预先渲染SPA。此服务免费提供多达250页，并且几乎消除了开发人员的所有复杂性。

如果您是Vue的新手，不想管理服务器端渲染的复杂性，或者不想使用类似Nuxt的工具来生成静态网站，这些都是不错的选择。

我工作的公司使用Nuxt（我们使用通用模式，也称为服务器端渲染），但我们对它可以使用generate进行的静态站点渲染的静态站点渲染感到非常满意项目。请注意，这伴随着在Vue之上构建的另一个框架的增加的复杂性，以及随之而来的许多其他障碍。

Answer 3

带有SPA的SEO的一般解决方案是启用SPA的服务器端呈现。这是通过让您的HTTP服务器将完整呈现的应用程序提供给客户端来实现的。而不是发送样板HTML，然后让客户端随后请求应用程序包和其他内容。