Vue-SSR服务端渲染优化方案
本文主要介绍Vue-SSR优化前端项目当你写完一个前端项目,并发布到nginx服务器上,当项目页面过多,你一定遇见过,刚刚打开网页时,慢的抠脚,但再点击其他页面时,会好好多;而且细心的你一定会发现,为什么我的网站不会被百度收录;其实这不是你的锅,这是vue项目本来的样貌;抱怨没用,但可以去改变它。传统Vue项目返回app.bundle.js,index.html给浏览器。node服务器上返回对应的
·
本文主要介绍Vue-SSR优化前端项目
|
- 当你写完一个前端项目,并发布到nginx服务器上,当项目页面过多,你一定遇见过,刚刚打开网页时,慢的抠脚,但再点击其他页面时,会好好多;而且细心的你一定会发现,为什么我的网站不会被百度收录;其实这不是你的锅,这是vue项目本来的样貌;抱怨没用,但可以去改变它。
传统Vue项目
返回app.bundle.js,index.html给浏览器。 node服务器上返回对应的页面给浏览器。 |
产生的问题
-
1,seo问题
搜索引擎优化,不同爬虫工作原理类似,只会爬取源码,不会执行网站的任何脚本。使用了Vue或者其它MVVM框架之后,页面大多数DOM元素都是在客户端根据js动态生成,可供爬虫抓取分析的内容大大减少 -
2,首屏问题
大型单页应用,打包后文件体积比较大,普通客户端渲染加载所有所需文件时间较长,首页就会有一个很长的白屏等待时间
服务端渲染
两个入口,两次打包(客户端、服务端)
Nuxt.js
从头搭建一个服务端渲染的应用是相当复杂的。幸运的是,我们有一个优秀的社区项目 Nuxt.js 让这一切变得非常简单。Nuxt 是一个基于 Vue 生态的更高层的框架,为开发服务端渲染的 Vue 应用提供了极其便利的开发体验。更酷的是,你甚至可以用它来做为静态站生成器。推荐尝试。
更多推荐
已为社区贡献6条内容
所有评论(0)