SSR(Server side render) 核心原理是什么?

我们在webpack打包我们的代码的时候,提供了两个入口文件:

server entry; client entry;

分别供服务端和客户端使用:

  • server entry :主要是为了返回我们服务端新创建的vue 实例;
  • client entry :主要是将我们的vue 实例挂载到我们的指定元素上;

通过webpack build 打包完成以后:

会生成server bundle 和 client bundle 文件; 服务器会根据我们客户端的请求你,会渲染生成一个html文件;这时候的html文件是不具有交互性的,需要Hydrate 到client Bundle;由VUE 托管渲染使其具有交互性;

引用唐老师服务端SSR简图加深理解:

NuxtJS 流程图 下图阐述了 Nuxt.js 应用一个完整的服务器请求到渲染(或用户通过 切换路由渲染页面)的流程:

转载于:https://juejin.im/post/5cb34cadf265da03873392a1

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值