Vue客户端渲染和服务端渲染异同

本文比较服务端和客户端渲染的不同,并用实例验证,同时会讲解一些Vue服务端渲染的概念。

本文不讲Vue服务端渲染的具体实现过程,需要学习服务端渲染的同学可以异步Vue服务端渲染官方教程地址: https://ssr.vuejs.org/,相信会比一般博客讲的更为清楚。官方教程同时也提供了Demo,地址如下:https://github.com/vuejs/vue-hackernews-2.0/ ,该demo功能齐全,需要的小伙伴可以直接clone下来使用。

如果想要使用更高层的服务渲染框架,可以了解下Nuxt.js,连接地址如下:https://nuxtjs.org/ 。上面几个地址相信对想要学习或了解Vue服务端渲染的同学很有帮助,下面就开始讲下Vue客户端渲染和服务端渲染的异同和一些概念。

1、客户端渲染。

Vue.js 是构建客户端应用程序的框架。默认情况下,可以在浏览器中输出 Vue 组件,进行生成 DOM 和操作 DOM。然而,也可以将同一个组件渲染为服务器端的 HTML 字符串,将它们直接发送到浏览器,最后将这些静态标记"激活"为客户端上完全可交互的应用程序。什么意思呢?就是我们的页面开始是没内容的,加载js后,js会生成和操纵dom,最后又浏览器渲染出页面。这一系列的操作都是在浏览器完成的。

看下实例:Vue客户端应用加载时如下:


url(

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值