Nuxt.js理解 开启SSR渲染(介绍)---00

Nuxt.js简单的说是Vue.js的通用框架,最常用的就是用来作SSR(服务器渲染)。再直白点说,就是Vue.js原来是开发SPA(单页应用)的,但是随着技术的普及。很多人想用Vue开发多页应用,并在服务端完成渲染。这时候就出现了Nuxt.js这个框架,它简化了SSR的开发难度。还可以直接用命令把我们制作的vue项目生成为静态html。

那服务端渲染到底有什么好处哪?

最主要的原因是SPA单页应用不利于搜索引擎的SEO操作。比如你做一个新闻网站,流量的一个主要来源是通过百度、谷歌、bing这些搜索引擎,但是它们对SPA的抓取并不好,特别是百度根本没法抓取到SPA的内容页面,所以我们必须把我们的应用在服务端渲染成适合搜索引擎抓取的页面,再下载到客户端。那Nuxt.js适合做新闻、博客、电影、咨询这样的需要搜索引擎提供流量的项目。如果你要作移动端的项目,就没必要使用这个框架了。Nuxt.js个人觉得是一个解决方案

什么是SSR?

SSR,即服务器渲染,就是在服务器端将对Vue页面进行渲染生成html文件,将html页面传递给浏览器。SSR两个优点:

    SEO不同于SPA的HTML只有一个无实际内容的HTML和一个app.js,SSR生成的HTML是有内容的,这让搜索引擎能够索引到页面内容。

    更快内容到达时间,传统的SPA应用是将bundle.js从服务器获取,然后在客户端解析并挂载到dom。而SSR直接讲HTML字符串传递给浏览器。大大加快了首屏加载时间。

Nuxt.js的官方网站是这样介绍的:
Nuxt.js是一个基于Vue.js的通用应用框架。
通过对客户端/服务端基础架构的抽象组织,Nuxt.js主要关注的是应用的UI渲染。

Nuxt.js特点(优点):

 nuxt框架将页面分层划分为3层:1、布局;2、页面;3、组件 

  1.     基于Vue.js
  2.     自动代码分层
  3.     服务端渲染
  4.     强大的路由功能,支持异步数据
  5.     静态文件服务
  6.     ES6/ES7语法支持
  7.     打包和压缩JS和CSS
  8.     HTML头部标签管理
  9.     本地开发支持热加载
  10.     集成ESLint
  11.     支持各种样式预处理器:SASS、LESS、Stylus等

 项目的运行顺序:1.Middleware层-->2.layouts层-->3.pages层-->4.components层

Nuxt.js官网介绍:Nuxt - The Intuitive Vue Framework

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值