Server-Side Rendering(服务端渲染)的优点与缺点

优点

1. SEO

客户端渲染,页面中只有初始的几个html容器,js生成内容填充到容器中,
爬虫只能识别到初始的html容器,js生成的内容一般不会被识别,而服务端
渲染直接给出html,爬虫可以识别到所有内容

2. 首屏渲染性能

第一次加载过慢,很多客户端渲染的js有一定体积,得等到js加载解析完成才能显示首屏内容,影响体验

缺点

服务端渲染会对服务端造成一定的并发压力

如果使用nodejs进行渲染,需要增加额外的node节点维护成本,node调用其他服务,会
产生额外的性能损耗

时间: 2024-12-09 14:42:40

Server-Side Rendering(服务端渲染)的优点与缺点的相关文章

使用 PHP 来做 Vue.js 的 SSR 服务端渲染

对于客户端应用来说,服务端渲染是一个热门话题.然而不幸的是,这并不是一件容易的事,尤其是对于不用 Node.js 环境开发的人来说. 我发布了两个库让 PHP 从服务端渲染成为可能.spatie/server-side-rendering 和 spatie/laravel-server-side-rendering适配 laravel 应用. 让我们一起来仔细研究一些服务端渲染的概念,权衡优缺点,然后遵循第一法则用 PHP 建立一个服务端渲染. 什么是服务端渲染 一个单页应用(通常也叫做 SPA

服务端渲染与客户端渲染的区别与应用场景

内容整理自多个论坛博客. 主要参考:https://www.jianshu.com/p/b8cfa496b7ec https://www.jianshu.com/p/10b6074d772c https://www.douban.com/note/722996691/ 客户端渲染(CSR)VS服务端渲染(SSR) 1.客户端渲染和服务端渲染 1.1 概念 客户端渲染:后端不提供完整的html页面,而是提供一些api使得前端可以获取json数据,然后前端拿到json数据之后再在前端进行html页面

服务端渲染和客户端渲染区别

SPA.SEO.SSR 三者的区别? SPA(single page application) 单页面应用,是前后端分离时提出的一种解决方案.优点:页面之间切换快:减少了服务器压力:缺点:首屏打开速度慢,不利于 SEO 搜索引擎优. SEO(search engine optimization)搜索引擎优化,利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名. 我们之前说 SPA 单页面应用,通过 ajax 获取数据,这就难保证我们的页面能被搜索引擎收到.并且有一些搜索引擎不支持的 js 和通

React服务端渲染总结

欢迎吐槽 : ) 本demo地址( 前端库React+mobx+ReactRouter ):https://github.com/Penggggg/react-ssr.本文为笔者自学总结,有错误的地方恳请各位指出 O(∩_∩)O          序:前言.原因与思路.注意事项与问题.详解.       一.前言 为什么需要服务端渲染?什么情况下进行服务端渲染?笔者认为,当我们要求渲染时间尽量快.页面响应速度快时(优点),才会采用服务器渲染,并且应该“按需”对页面进行渲染 ——“首次加载/首屏”

Vue服务端渲染和Vue浏览器端渲染的性能对比

Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司做Vue项目的时候,一直苦于产品.客户对首屏加载要求,SEO的诉求,也想过很多解决方案,本次也是针对浏览器渲染不足之处,采用了服务端渲染,并且做了两个一样的Demo作为比较,更能直观的对比Vue前后端的渲染. talk is cheap,show us the code!话不多说,我们分别来看两个D

实例PK(Vue服务端渲染 VS Vue浏览器端渲染)

Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司做Vue项目的时候,一直苦于产品.客户对首屏加载要求,SEO的诉求,也想过很多解决方案,本次也是针对浏览器渲染不足之处,采用了服务端渲染,并且做了两个一样的Demo作为比较,更能直观的对比Vue前后端的渲染. 话不多说,我们分别来看两个Demo:(欢迎star 欢迎pull request) 1.浏

使用 Vue 2.0 实现服务端渲染的 HackerNews

Vue 2.0 支持服务端渲染 (SSR),并且是流式的,可以做组件级的缓存,这使得极速渲染成为可能.同时, 和 2.0 也都能够配合 SSR 提供同构路由和客户端 state hydration.vue-hackernews-2.0 是 Vue 作者在GitHub上面放的 Vue 2.0 的一个示例项目,结合 Express.vue-router & vuex 来构建,是很好的学习案例. Features Server Side Rendering Vue + vue-router + vue

vue服务端渲染 同构渲染

引言 自JavaScript诞生以来,前端技术发展非常迅速.移动端白屏优化是前端界面体验的一个重要优化方向,Web 前端诞生了 SSR .CSR.预渲染等技术. 十年前,几乎所有网站都使用 ASP.Java.PHP 这类做后端渲染,但后来随着 jQuery.Angular.React.Vue 等 JS 框架的崛起,开始转向了前端渲染.2014年起又兴起了同构渲染,号称是未来,集成了前后端渲染的优点,当真如此? 我们先明确三个概念: 后端渲染:后端渲染指传统的 ASP.Java 或 PHP 的渲染

Vue 2.0 服务端渲染入门

1 什么是服务端渲染 SSR server side render 就是通过后端吐模板,而不是通过前端ajax获取数据,拼接字符串. 2 为什么需要SSR 需要SEO,因为爬虫不会等待ajax结果. 客户端网络慢,加载速度慢,影响用户体验. 3 另一种解决办法 预渲染 不是一次性下载整个单页应用,预渲染只是在构建时为了特定的路由生成特定的几个静态页面 你用webpack可以很简单地通过prerender-spa-plugin来添加预渲染 4 NodeJS编写Vue的SSR 首先npm insta