预渲染与服务端渲染的共同点: 都是多页面, 根据客户端的url 返回响应的文件。

不同点: 预渲染html文件的生成 在客户端 , 服务端则反之。

预渲染的缺点:

在这里我举一个例子更好的理解预渲染道德流程。

首先我们做的项目已经打包好了,根据不同的路由已经生成了不同的文件。

现在有A B C 三个路由文件 放在服务端。

客户点现在发送请求 需要A文件, 服务端收到请求后将A文件发送给客户端, 这时客户端做了一件这样的事情。生成了一个无头浏览器(可以理解成虚拟的浏览器), 执行A文件,A文件里面js文件生成DOM元素,然后获取内容等等,最终生成一个执行完html文件,在给到真正的浏览器去渲染, 这样浏览器拿到的html文件里面就是有内容有DOM结构的了。

但是在这个过程中有一个问题, 客户端发送需要A文件的请求时,携带了一个参数. 当服务端收到请求时, 就算携带参数服务端本身无法执行文件,更无法将 参数代入到文件中,只能把文件发给客户端。

结论就是 预渲染不能处理带有参数的路由。

服务端渲染就解决了这个问题。

服务端渲染是这样执行的. 当服务器收到客户端的请求时,会在服务端直接把文件执行完,生成最终的html文件,在发给客户端。 既然是服务端直接执行,那么收到的客户端参数也就可以放在文件中执行了。

那么我们试想一下预渲染到底怎么做才能解决参数的问题。

预渲染的限制点在与 服务端不能执行文件, 那么服务端有参数怎样才能给到文件中呢,  方案:只要是预渲染的文件刚开始就写好某一个函数 可以引进某个文件获取外部的参数。  服务端做的就是把参数放进某个文件中。

预渲染与服务端渲染的区别相关推荐

  1. React 服务端渲染 umi服务端渲染

    react 服务端渲染原理不复杂,其中最核心的内容就是同构. node server 接收客户端请求,得到当前的req url path,然后在已有的路由表内查找到对应的组件,拿到需要请求的数据,将数 ...

  2. 客户端渲染和服务端渲染

    参考链接:客户端渲染和服务端渲染的区别https://blog.csdn.net/qq_40885461/article/details/88539989 浅谈服务端渲染(SSR)https://ww ...

  3. java vue 服务端渲染_vue服务端渲染缓存应用详解

    服务端渲染简介 服务端渲染不是一个新的技术:在 Web 最初的时候,页面就是通过服务端渲染来返回的,用 PHP 来说,通常是使用 Smarty 等模板写模板文件,然后 PHP 服务端框架将数据和模板渲 ...

  4. python 服务端渲染_客户端渲染与服务端渲染

    后端渲染 服务器直接生成HTML文档并返回给浏览器,但页面交互能力有限.适用于任何后端语言:PHP.Java.Python.GO等. 客户端渲染(CSR) 页面初始加载的HTML文档中无内容,需要下载 ...

  5. vue服务端渲染 MySQL_Vue 服务端渲染(SSR)

    什么是服务端渲染? 简单理解是将组件或页面通过服务器生成html字符串,再发送到浏览器,最后将静态标记"混合"为客户端上完全交互的应用程序. 服务端渲染的优点 更好的SEO,搜索引 ...

  6. vue服务端渲染 MySQL_vue服务端渲染简单入门实例

    想到要学习vue-ssr的同学,自不必多说,一定是熟悉了vue,并且多多少少做过几个项目.然后学习vue服务端渲染无非解决首屏渲染的白屏问题以及SEO友好. 话不多说,笔者也是研究多日才搞明白这个服务 ...

  7. vue服务端渲染 MySQL_Vue 服务端渲染

    关于 vue 做服务端渲染,目前主要有俩种解决方案,使用 vue-server-renderer 或者使用 nuxt .但个人感觉使用 nuxt 写法太死,以及即使你用 nuxt 写出了 vue ss ...

  8. vue服务端渲染 MySQL_vue服务端渲染

    一.基本原理 1.服务端渲染实现原理机制:在服务端拿数据进行解析渲染,直接生成html片段返回给前端.然后前端可以通过解析后端返回的html片段到前端页面,大致有以下两种形式: a.服务器通过模板引擎 ...

  9. python 服务端渲染_客户端渲染和服务器渲染的区别

    我们都知道,网页上的很多内容之所以能那么丰富,是因为大量的css.js去渲染出这个页面.那么他们是如何渲染的呢?那么就要说到我们本文的两种渲染方式了,即客户端渲染和服务端渲染. 正文 本文将分别讲述两 ...

最新文章

  1. 新数学丛书《连分数》 习题 3.2
  2. virtualbox 安装ubuntu 时,看不到继续、退出按钮?共享文件无权限?
  3. 李宏毅线性代数笔记8 :坐标系变换8
  4. MATLAB绘图笔记——画立方体的几种方法
  5. 在银行存款被吞了,怎么能快速解决?
  6. 有限元课堂笔记03:钢架(Frame)
  7. 大分区表高并发性能提升100倍?阿里云 RDS PostgreSQL 12 解读
  8. 【从入门到放弃-Java】并发编程-NIO-Buffer
  9. 用 Python 编写一个天气查询应用
  10. yaourt下载安装dropbox提示curl ssl证书错误
  11. Android 系统(4)---Android HAL层与Linux Kernel层驱动开发简介
  12. javascript判断非空
  13. canape与matlab如何连接,CANape使用介绍.ppt
  14. java计算税后工资switch语句_计算个人所得税!switch语句
  15. 104Triangle Area三角面积
  16. UnityShader源码2017---学习笔记与自我拓展019
  17. 2021-08-07 STM32F103 Buffer SPI Transfer 缓冲通讯
  18. UITT不忘初心,为交易而生
  19. 读书会招募 | 勇气七日谈,一起在“讨厌”中寻找幸福的真谛
  20. jQuery 稳定、快速的CDN加速服务引用地址

热门文章

  1. Python脚本一键找出哪些微信好友删了你(附源码)
  2. 【数据结构实验】链表的创建与功能的实现
  3. 高版本Word保存为97-2003版本公式变图片问题
  4. BERT的学习理解笔记
  5. 十六进制颜色码对照表
  6. Android getDimensionPixelSize, 代码中设置字体大小,读xml配置。
  7. 使用Java8中的Optional类来消除代码中的null检查
  8. 专注力的重要性和提高的方法
  9. 用python pynput 监听键盘输入
  10. 算法训练营 重编码_我在编码训练营中的经验(以及是否适合您)