当前位置: 首页 > news >正文

CSR 和 SSR 分别是什么?

CSR 和 SSR 分别是什么?

  • CSR
  • SSR

CSR

客户端渲染 (Client-Side Rendering) :指网页内容的生成和渲染主要在用户浏览器端(客户端)完成。
当用户访问一个网站时,服务器首先返回一个基本的HTML结构(通常包含必要的脚本标签和样式表引用),这个结构中通常不含或仅含少量静态内容。
随后,浏览器下载并执行这些脚本(通常使用JavaScript框架如React、Vue、Angular等),脚本从服务器或API获取数据,然后动态生成渲染网页的实际内容。

特点:

  • 延迟加载:初始加载时,用户可能先看到一个空白页面或占位符,随着脚本执行和数据加载完成,页面内容逐步填充。
  • 动态交互:由于内容在客户端渲染,页面更新和交互响应通常更快,用户体验更流畅。
  • SEO挑战:搜索引擎爬虫可能无法正确抓取到动态生成的内容,对SEO友好性有一定影响,需要额外的SEO优化措施(如预渲染、SSR配合等)。

SSR

服务端渲染 (Server-Side Rendering): 服务器端渲染是指网页内容的生成和初步渲染在服务器端完成。
当用户访问网站时,服务器接收到请求后,直接生成完整的HTML页面(包括数据填充),并将这个完整的页面发送给浏览器。
浏览器接收到后,可以直接呈现给用户,无需等待额外的脚本执行。

特点:

  • 快速首屏渲染:用户几乎立刻能看到页面主要内容,首屏加载速度快,改善用户体验,尤其是对于低网速或弱设备的用户。
  • SEO友好:搜索引擎爬虫可以直接抓取到服务器返回的完整HTML,包含所有的内容信息,有利于SEO优化。
  • 服务器负载较高:服务器需要承担更多的计算和渲染工作,可能增加服务器负担,尤其是在高并发场景下。此外,服务器端渲染的代码通常需要兼顾服务器和客户端环境,增加了开发复杂性。

总结来说,CSR和SSR各有优劣,适用于不同的场景。CSR强调客户端的交互性和动态性,适合对交互要求较高、SEO需求不迫切的现代Web应用。

而SSR重视首屏加载速度和SEO优化,更适合内容为主的网站、需要快速呈现首屏内容的场景以及对SEO有严格要求的应用。

实际项目中,有时还会采用同构(Isomorphic)或预渲染(Prerendering)等混合策略,结合CSR和SSR的优点,以适应不同需求。


http://www.mrgr.cn/news/75025.html

相关文章:

  • [Unity Demo]从零开始制作空洞骑士Hollow Knight第二十二集:制作游戏的对话系统
  • STM32串口——5个串口的使用方法
  • Spark RDD 的宽依赖和窄依赖
  • RHCE的学习(24)
  • spring @Async
  • 极客时间《Redis核心技术与实战》开篇词 知识点总结
  • 力扣 LeetCode 459. 重复的子字符串(Day4:字符串)
  • UVa 11288 Carpool
  • 打造专业问答社区:Windows部署Apache Answer结合cpolar实现公网访问
  • Cocos Creator《星际征服者》3D实时对战战机类游戏
  • 基于Springboot+微信小程序的健康饮食小程序 (含源码数据库)
  • 飞牛云fnOS本地部署WordPress个人网站并一键发布公网远程访问
  • 什么?postman 还可以做性能测试?
  • C++的返回值在内存中的传递过程
  • 【微信小程序】关于小程序开发过程中的一些经验之谈,很有用!!
  • StableDiffusion系列教程 |SD提示词编写指南
  • PSRR仿真笔记
  • 37拼购模式后期可能面临的问题及解决方案
  • 数据分析师证书怎么考
  • 后端-实现excel的导出功能(超详细讲解)
  • 海天味业监事交易违规,新任女掌门现管理漏洞
  • 121、SQL Server取开始时间、截止时间
  • redis的事务
  • 编程之路,从0开始:知识补充篇
  • Spring Boot 应用程序中集成 Redis 并实现存储读取字符串或者复杂对象
  • 得物精准测试平台设计与实现